M2: Meili search + saved searches, sync windows + backfill progress, threading & image fixes

Search:
- Meilisearch backend (app/search/meili.py) + factory wiring; pinned SDK 2.7
- Search-as-you-type: debounced query + Postgres prefix matching, built from
  the DB tokenizer so full email addresses match (email stays one lexeme)
- Saved searches API + sidebar virtual mailboxes; save affordance in the box

Account sync windows (SPEC §12 M2):
- Choose at setup: All (recent 30d first, then remainder), Last 3 months, New only
- Per-account sync_window + "Sync remaining mail" from settings (idempotent re-run)
- Provider windowed backfill (SINCE/BEFORE), message_count, newest_uid
- migration 0012: accounts.sync_window + backfill_total/backfill_done

Backfill progress UX:
- Floating progress card (auto-dissolves after 10s) + spinning sidebar ring that
  fills with the account colour; driven by sync.progress over WS

Thread list pagination:
- Server-side offset + accurate grand total, with filter/order in SQL; working
  prev/next across all synced mail

Reading panel:
- "Load images" one-off now actually renders images (?images=1) without trusting
  the sender; envelope carries images_allowed so a trusted sender shows no prompt

Threading:
- Subject fallback no longer merges messages that declare an explicit (different)
  parent; true siblings still group via a shared-parent reference match. Fixes
  unrelated auto-replies with the same subject landing in one thread

Backend 257 tests green, ruff + mypy --strict clean; frontend tsc/eslint/vitest clean.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01U72FZiF1W1pb8XxyWBTREA

frontend/src/components/BackfillBanner.tsx

@@ -0,0 +1,69 @@
+// Initial-sync progress UX (SPEC §12 M2). Shows a small floating card while any
+// account is importing its history; reads the accounts query, which the WS
+// `sync.progress` event invalidates so the bar advances live.
+
+import { useQuery } from "@tanstack/react-query";
+import { useEffect, useState } from "react";
+
+import { useT } from "../i18n";
+import { api } from "../lib/api";
+
+export function BackfillBanner() {
+  const t = useT();
+  const accounts = useQuery({ queryKey: ["accounts"], queryFn: api.accounts });
+
+  const importing = (accounts.data ?? []).filter(
+    (a) => a.state === "backfilling" && a.backfill_total > 0,
+  );
+  const active = importing.length > 0;
+
+  // Dissolve the card 10s after it appears; the sidebar ring keeps showing
+  // progress until the sync finishes.
+  const [dismissed, setDismissed] = useState(false);
+  useEffect(() => {
+    if (!active) {
+      setDismissed(false);
+      return;
+    }
+    const timer = window.setTimeout(() => setDismissed(true), 10000);
+    return () => window.clearTimeout(timer);
+  }, [active]);
+
+  if (!active) return null;
+
+  return (
+    <div
+      className={`fixed bottom-4 left-4 z-40 w-72 space-y-2 transition-opacity duration-700 ${
+        dismissed ? "pointer-events-none opacity-0" : "opacity-100"
+      }`}
+    >
+      {importing.map((a) => {
+        const done = Math.min(a.backfill_done, a.backfill_total);
+        const pct = Math.round((done / a.backfill_total) * 100);
+        return (
+          <div
+            key={a.id}
+            className="rounded-lg border border-app-border bg-app-surface p-3 shadow-lg"
+          >
+            <div className="mb-1 flex items-center gap-2">
+              <span className="h-2.5 w-2.5 shrink-0 rounded-full" style={{ backgroundColor: a.color }} />
+              <span className="truncate text-xs font-medium text-app-fg">{a.email}</span>
+            </div>
+            <div className="mb-1.5 text-xs text-app-muted">
+              {t("backfill.importing", {
+                done: done.toLocaleString(),
+                total: a.backfill_total.toLocaleString(),
+              })}
+            </div>
+            <div className="h-1.5 w-full overflow-hidden rounded-full bg-app-hover">
+              <div
+                className="h-full rounded-full bg-app-accent transition-all duration-500"
+                style={{ width: `${pct}%` }}
+              />
+            </div>
+          </div>
+        );
+      })}
+    </div>
+  );
+}

frontend/src/components/thread/MessageBody.tsx

@@ -15,7 +15,9 @@ import { Attachments } from "./Attachments";
 export function MessageBody({ message }: { message: MessageEnvelope }) {
   const t = useT();
   const queryClient = useQueryClient();
-  const [allowed, setAllowed] = useState(false);
+  // Seed from the server's trusted-sender flag so an already-approved sender
+  // loads images and shows no "blocked" prompt on reopen.
+  const [allowed, setAllowed] = useState(message.images_allowed);
   const frameRef = useRef<HTMLIFrameElement>(null);
   const observerRef = useRef<ResizeObserver | null>(null);
   const [height, setHeight] = useState(80);
@@ -23,7 +25,10 @@ export function MessageBody({ message }: { message: MessageEnvelope }) {
   const { data, isLoading, isError } = useQuery({
     queryKey: ["message-html", message.id, allowed],
     queryFn: async () => {
-      const resp = await fetch(`/api/messages/${message.id}/html`, { credentials: "include" });
+      // ?images=1 asks the server to render remote images for this one request
+      // (the "Load images" one-off); "Always from this sender" persists separately.
+      const url = `/api/messages/${message.id}/html${allowed ? "?images=1" : ""}`;
+      const resp = await fetch(url, { credentials: "include" });
       if (!resp.ok) throw new Error("failed to load message");
       return resp.text();
     },
@@ -89,6 +94,11 @@ export function MessageBody({ message }: { message: MessageEnvelope }) {
     if (persist) {
       await api.allowRemoteImages(message.id);
       queryClient.invalidateQueries({ queryKey: ["message-html", message.id] });
+      // Refresh thread detail so the sender's images_allowed flag reflects the
+      // new trust on reopen (suppresses the prompt next time).
+      if (message.thread_id) {
+        queryClient.invalidateQueries({ queryKey: ["thread", message.thread_id] });
+      }
     }
     setAllowed(true);
   };