webapp: add raw protocol filter

webapp/main.py

@@ -40,7 +40,7 @@ async def api_flow_list(request):
     # Parse GET arguments
     ts_to = request.query_params.get("to", str(int(1e10)))
     services = request.query_params.getlist("service")
-    app_proto = request.query_params.get("app_proto")
+    app_proto = request.query_params.get("app_proto", "all")
     search = request.query_params.get("search")
     tags_require = request.query_params.getlist("tag_require")
     tags_deny = request.query_params.getlist("tag_deny")
@@ -55,7 +55,7 @@ async def api_flow_list(request):
           fsearchfid AS (SELECT value FROM json_each(?6))
         SELECT id, ts_start, ts_end, dest_ipport, app_proto,
           (SELECT GROUP_CONCAT(tag) FROM alert WHERE flow_id = flow.id) AS tags
-        FROM flow WHERE ts_start <= ?4 AND (?5 IS NULL OR app_proto = ?5)
+        FROM flow WHERE ts_start <= ?4 AND (?5 = 'all' OR ?5 IS app_proto)
     """
     if services == ["!"]:
         # Filter flows related to no services
@@ -97,7 +97,7 @@ async def api_flow_list(request):
             json.dumps(tags_require),
             json.dumps(tags_deny),
             int(ts_to) * 1000,
-            app_proto,
+            None if app_proto == "raw" else app_proto,
             json.dumps(search_fid),
         ),
     )

webapp/static/js/flowlist.js

@@ -273,10 +273,14 @@ class FlowList {
     }
 
     // Add protocols
-    const option = document.createElement('option')
+    let option = document.createElement('option')
     option.value = ''
     option.textContent = 'All'
     protocolSelect.appendChild(option)
+    option = document.createElement('option')
+    option.value = 'raw'
+    option.textContent = 'Raw'
+    protocolSelect.appendChild(option)
     appProto.forEach((proto) => {
       const option = document.createElement('option')
       option.value = proto