feat(opensearch-web): dest_ip filter, per-tab session persistence, sidebar redesign, and overview table fixes (#31)

* feat(opensearch-web): add destination IP filter to query pipeline and search bar

Extend the query backend and web form to support filtering by destination
IP alongside the existing src_ip filter.

- build_base_query gains a dest_ip_filter param that appends a
  destination.ip term clause when set
- run_query guards dest_ip_filter the same way src_ip is guarded:
  only applied to modules that declare destination.ip in SOURCE_FIELDS
- build_search_params_from_request reads the dest_ip form value
- base.html search bar exposes a Dst IP text input

* fix(opensearch-web): skip em-dash placeholder IPs in overview table

Zeek modules emit "—" (U+2014) as src_ip when no source IP is present
in a record. run_cross_protocol_query was aggregating these into a
phantom "—" row in the cross-protocol overview matrix.

Extend the IP guard to also skip em-dash values alongside empty strings.

* feat(opensearch-web): redesign sidebar nav, persist filters per-tab, and fix sticky-column rendering

Sidebar navigation:
- Add always-visible Overview link (cross-protocol matrix) to sidebar
- Replace Hub home link with brand logo that routes to Hub when mounted
  under a script name, or to Overview when running standalone
- Polish collapsed sidebar: hide scrollbar, center icons, apply category
  colour accents to group headers, add .sidebar-overview highlight class
- Update category icons (alerts, network, web, remote, auth, messaging)
- Reorder MODULES so suricata_alert appears before weird in the registry

Filter persistence:
- Replace localStorage-based sensor/time_range persistence with
  sessionStorage so each browser tab maintains independent filter state
- Snapshot all filter keys (time_range, sensor, src_ip, dest_ip,
  direction, public_only, limit, min_risk) on form submit; restore on
  link navigation
- Remove inline onchange handler from the time_range select

CSS cache-busting:
- Compute pisces.css version from file mtime at app startup and inject
  as a ?v= query param in the stylesheet link

Sticky-column rendering:
- Raise col-ip-addr z-index to 20 (top-left corner) and add explicit
  top+left sticky declarations to thead .col-ip-addr and thead .col-total
  so both axes stick reliably at the corner
- Remove drop shadows from col-ip-addr and col-total; keep only the
  inset separator line
- Remove z-index from the shared thead rule to avoid clobbering the
  per-column corner values

* ci(djlint): add HTML linting to pre-commit and CI pipeline

Introduces djLint as a dev dependency and wires it into both pre-commit
and the GitHub Actions CI workflow, following the same advisory-on-dev /
blocking-on-PR-to-main pattern used by the existing ruff checks.

- djlint-jinja pre-commit hook lints Jinja templates on every commit
- CI: "Lint HTML (djlint check)" runs blocking on PRs to main,
  advisory on pushes to dev (mirrors ruff check behaviour)
- CI: "Format check HTML (djlint format)" runs advisory on all triggers
- [tool.djlint] config added to pyproject.toml: jinja profile,
  100-char line limit, H021/H023/H030/H031 suppressed with rationale

* style(templates): fix all djlint lint errors across 13 HTML files

Resolves all djlint warnings to reach 0 errors across 32 HTML files:

- T003: added block names to all bare endblock tags (21 occurrences)
  across dashboard_web, mantis_web, and opensearch_web templates
- H006: added height/width attributes to brand logo img tags in 4
  base templates
- H025: added closing </option> tags to datalist options in
  filter_form.html
- H014: removed extra blank lines in opensearch_web base.html and
  record_detail.html
- T032: removed extra whitespace in Jinja set tags in ticket_detail.html
  and record_detail.html
- H029: lowercased form method="GET" to method="get" in opensearch_web
  base.html
- H020: replaced empty <span></span> with <span>&nbsp;</span> in
  threat_card.html

Also adds J018 to the djlint ignore list in pyproject.toml — cross-app
internal links cannot use url_for() in a multi-app Flask setup.

Author: liamadale

.github/workflows/ci.yml

@@ -44,3 +44,11 @@ jobs:
       - name: SAST (bandit) — advisory
         run: uv run bandit -r src/ apps/ mcp/ -c pyproject.toml
         continue-on-error: true
+
+      - name: Lint HTML (djlint check)
+        run: uv run djlint apps/ --lint
+        continue-on-error: ${{ env.ADVISORY == 'true' }}
+
+      - name: Format check HTML (djlint format) — advisory
+        run: uv run djlint apps/ --check
+        continue-on-error: true

.pre-commit-config.yaml

@@ -18,6 +18,12 @@ repos:
       - id: detect-secrets
         args: [--baseline, .secrets.baseline]
 
+  - repo: https://github.com/djlint/djLint
+    rev: v1.36.4
+    hooks:
+      - id: djlint-jinja
+        args: [--lint]
+
   - repo: https://github.com/pre-commit/pre-commit-hooks
     rev: v5.0.0
     hooks:

apps/dashboard_web/templates/base.html

@@ -3,7 +3,7 @@
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>{% block title %}PISCES · Dashboard{% endblock %}</title>
+  <title>{% block title %}PISCES · Dashboard{% endblock title %}</title>
   <link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='pisces-logo.ico') }}">
   <script>
     /* Apply saved theme before CSS loads to prevent flash */
@@ -200,7 +200,7 @@
 <div id="htmx-bar"></div>
 
 <nav>
-  <a class="brand" href="{{ script_name }}/"><img src="{{ url_for('static', filename='pisces-logo.png') }}" alt="PISCES" class="brand-logo">PISCES <span class="brand-sub">Dashboard</span></a>
+  <a class="brand" href="{{ script_name }}/"><img src="{{ url_for('static', filename='pisces-logo.png') }}" alt="PISCES" class="brand-logo" height="32" width="auto">PISCES <span class="brand-sub">Dashboard</span></a>
   {% if script_name %}
   <a href="/" class="btn-icon" title="Back to PISCES Hub">
     <i class="fa-solid fa-house"></i>
@@ -213,7 +213,7 @@
 </nav>
 
 <main>
-{% block content %}{% endblock %}
+{% block content %}{% endblock content %}
 </main>
 
 <script>
@@ -270,6 +270,6 @@
 })();
 </script>
 
-{% block extra_scripts %}{% endblock %}
+{% block extra_scripts %}{% endblock extra_scripts %}
 </body>
 </html>

apps/dashboard_web/templates/dashboard.html

@@ -48,7 +48,7 @@
     <p class="loading-msg"><i class="fa-solid fa-spinner fa-spin"></i> Loading Threat Intel data…</p>
   </div>
 </div>
-{% endblock %}
+{% endblock content %}
 
 {% block extra_scripts %}
 <script>
@@ -95,4 +95,4 @@
   loadSection('overview');
 });
 </script>
-{% endblock %}
+{% endblock extra_scripts %}

apps/hub/templates/index.html

@@ -76,7 +76,7 @@
 </head>
 <body>
 <nav>
-  <a class="brand" href="/"><img src="{{ url_for('static', filename='pisces-logo.png') }}" alt="PISCES" class="brand-logo">PISCES <span class="brand-sub">Hub</span></a>
+  <a class="brand" href="/"><img src="{{ url_for('static', filename='pisces-logo.png') }}" alt="PISCES" class="brand-logo" height="32" width="auto">PISCES <span class="brand-sub">Hub</span></a>
   <div class="spacer"></div>
   <button class="btn-theme" id="theme-toggle" onclick="toggleTheme()" title="Toggle light/dark theme">
     <i class="fa-solid fa-moon" id="theme-icon"></i>

apps/mantis_web/templates/base.html

@@ -3,7 +3,7 @@
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>{% block title %}PISCES Threat Modeling{% endblock %}</title>
+  <title>{% block title %}PISCES Threat Modeling{% endblock title %}</title>
   <link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='pisces-logo.ico') }}">
   <script>
     (function() {
@@ -22,7 +22,7 @@
 <div id="htmx-bar"></div>
 
 <nav>
-  <a class="brand" href="{{ script_name }}/"><img src="{{ url_for('static', filename='pisces-logo.png') }}" alt="PISCES" class="brand-logo">PISCES <span class="brand-sub">Threat Intel</span></a>
+  <a class="brand" href="{{ script_name }}/"><img src="{{ url_for('static', filename='pisces-logo.png') }}" alt="PISCES" class="brand-logo" height="32" width="auto">PISCES <span class="brand-sub">Threat Intel</span></a>
   {% if script_name %}
   <a href="/" class="btn-icon" title="Back to PISCES Hub">
     <i class="fa-solid fa-house"></i>
@@ -37,7 +37,7 @@
 </nav>
 
 <main>
-{% block content %}{% endblock %}
+{% block content %}{% endblock content %}
 </main>
 
 {# ── Ticket detail side panel ──────────────────────── #}
@@ -618,7 +618,7 @@
 })();
 </script>
 
-{% block extra_scripts %}{% endblock %}
+{% block extra_scripts %}{% endblock extra_scripts %}
 
 </body>
 </html>

apps/mantis_web/templates/index.html

@@ -1,6 +1,6 @@
 {% extends "base.html" %}
 
-{% block title %}PISCES Threat Intel{% endblock %}
+{% block title %}PISCES Threat Intel{% endblock title %}
 
 {% block content %}
 
@@ -409,4 +409,4 @@
 
 </div>{# ── end tm-tabs-section ── #}
 
-{% endblock %}
+{% endblock content %}

apps/mantis_web/templates/partials/threat_card.html

@@ -66,7 +66,7 @@
     <div class="threat-summaries">
       <div class="threat-kv" style="margin-bottom:4px">
         <span class="k" style="font-weight:600">Summaries</span>
-        <span></span>
+        <span>&nbsp;</span>
       </div>
       <ul style="list-style:disc;padding-left:1.2rem;font-size:0.8rem;color:var(--on-surface-dim)">
         {% for s in malicious.summaries %}

apps/mantis_web/templates/partials/ticket_detail.html

@@ -43,7 +43,7 @@
 
 {# Reporter / handler #}
 {% set reporter_name = (t.reporter or {}).get('name') or (t.reporter if t.reporter is string else None) %}
-{% set handler_name  = (t.handler  or {}).get('name') or (t.handler  if t.handler  is string else None) %}
+{% set handler_name = (t.handler or {}).get('name') or (t.handler if t.handler is string else None) %}
 {% if reporter_name or handler_name %}
 <div style="display:flex;gap:1.5rem;font-size:0.78rem;color:var(--on-surface-dim)">
   {% if reporter_name %}

apps/opensearch_web/app.py

@@ -84,26 +84,31 @@ def create_app() -> Flask:
     app.register_blueprint(make_mantis_blueprint(_resolve_city))
     app.register_blueprint(make_cache_blueprint(wcache))
 
+    # Compute CSS version once at startup from file mtime — busts browser cache on deploy
+    _css_path = os.path.join(app.static_folder, "pisces.css")
+    _css_version = str(int(os.path.getmtime(_css_path))) if os.path.exists(_css_path) else "1"
+
     # Make TIME_RANGES, MODULES, and nav data available to all templates
     @app.context_processor
     def inject_globals() -> dict:
         return {
             "TIME_RANGES": TIME_RANGES,
             "MODULES": MODULES,
             "script_name": request.environ.get("SCRIPT_NAME", ""),
+            "css_version": _css_version,
         }
 
     @app.context_processor
     def inject_nav_data() -> dict:
         return {
             "proto_icons": {lt: mod.WEB_ICON for lt, mod in MODULES.items()},
             "category_icons": {
-                "alerts": "fa-bell",
-                "network": "fa-network-wired",
-                "web": "fa-globe",
-                "remote": "fa-terminal",
-                "auth": "fa-shield-halved",
-                "messaging": "fa-envelope",
+                "alerts": "fa-fire",
+                "network": "fa-sitemap",
+                "web": "fa-cloud",
+                "remote": "fa-right-to-bracket",
+                "auth": "fa-fingerprint",
+                "messaging": "fa-comments",
                 "files": "fa-folder",
                 "ot": "fa-industry",
             },