Refactor storage to provider-agnostic band-scoped model

Replaces per-member Nextcloud credentials with a BandStorage model that
supports multiple providers. Credentials are Fernet-encrypted at rest;
worker receives audio via an internal streaming endpoint instead of
direct storage access.

- Add BandStorage DB model with partial unique index (one active per band)
- Add migrations 0007 (create band_storage) and 0008 (drop old nc columns)
- Add StorageFactory that builds the correct StorageClient from BandStorage
- Add storage router: connect/nextcloud, OAuth2 authorize/callback, list, disconnect
- Add Fernet encryption helpers in security/encryption.py
- Rewrite watcher for per-band polling via internal API config endpoint
- Update worker to stream audio from API instead of accessing storage directly
- Update frontend: new storage API in bands.ts, rewritten StorageSection,
  simplified band creation modal (no storage step)
- Add STORAGE_ENCRYPTION_KEY to all docker-compose files

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

web/src/components/TopBandBar.tsx

@@ -4,7 +4,6 @@ import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
 import { listBands, createBand } from "../api/bands";
 import { getInitials } from "../utils";
 import { useBandStore } from "../stores/bandStore";
-import { api } from "../api/client";
 
 // ── Shared primitives ──────────────────────────────────────────────────────────
 
@@ -30,27 +29,6 @@ const labelStyle: React.CSSProperties = {
   marginBottom: 5,
 };
 
-// ── Step indicator ─────────────────────────────────────────────────────────────
-
-function StepDots({ current, total }: { current: number; total: number }) {
-  return (
-    <div style={{ display: "flex", gap: 5, alignItems: "center" }}>
-      {Array.from({ length: total }, (_, i) => (
-        <div
-          key={i}
-          style={{
-            width: i === current ? 16 : 6,
-            height: 6,
-            borderRadius: 3,
-            background: i === current ? "#14b8a6" : i < current ? "rgba(20,184,166,0.4)" : "rgba(255,255,255,0.12)",
-            transition: "all 0.2s",
-          }}
-        />
-      ))}
-    </div>
-  );
-}
-
 // ── Error banner ───────────────────────────────────────────────────────────────
 
 function ErrorBanner({ msg }: { msg: string }) {
@@ -61,117 +39,20 @@ function ErrorBanner({ msg }: { msg: string }) {
   );
 }
 
-// ── Step 1: Storage setup ──────────────────────────────────────────────────────
+// ── Band creation form ─────────────────────────────────────────────────────────
 
-interface Me { nc_configured: boolean; nc_url: string | null; nc_username: string | null; }
-
-function StorageStep({ me, onNext }: { me: Me; onNext: () => void }) {
-  const qc = useQueryClient();
-  const [ncUrl, setNcUrl] = useState(me.nc_url ?? "");
-  const [ncUsername, setNcUsername] = useState(me.nc_username ?? "");
-  const [ncPassword, setNcPassword] = useState("");
-  const [error, setError] = useState<string | null>(null);
-  const urlRef = useRef<HTMLInputElement>(null);
-
-  useEffect(() => { urlRef.current?.focus(); }, []);
-
-  const saveMutation = useMutation({
-    mutationFn: () =>
-      api.patch("/auth/me/settings", {
-        nc_url: ncUrl.trim() || null,
-        nc_username: ncUsername.trim() || null,
-        nc_password: ncPassword || null,
-      }),
-    onSuccess: () => {
-      qc.invalidateQueries({ queryKey: ["me"] });
-      onNext();
-    },
-    onError: (err) => setError(err instanceof Error ? err.message : "Failed to save"),
-  });
-
-  const canSave = ncUrl.trim() && ncUsername.trim() && ncPassword;
-
-  return (
-    <>
-      <div style={{ marginBottom: 14 }}>
-        <label style={labelStyle}>NEXTCLOUD URL</label>
-        <input
-          ref={urlRef}
-          value={ncUrl}
-          onChange={(e) => setNcUrl(e.target.value)}
-          style={inputStyle}
-          placeholder="https://cloud.example.com"
-          type="url"
-        />
-      </div>
-
-      <div style={{ marginBottom: 14 }}>
-        <label style={labelStyle}>USERNAME</label>
-        <input
-          value={ncUsername}
-          onChange={(e) => setNcUsername(e.target.value)}
-          style={inputStyle}
-          placeholder="your-nc-username"
-          autoComplete="username"
-        />
-      </div>
-
-      <div style={{ marginBottom: 4 }}>
-        <label style={labelStyle}>APP PASSWORD</label>
-        <input
-          value={ncPassword}
-          onChange={(e) => setNcPassword(e.target.value)}
-          style={inputStyle}
-          type="password"
-          placeholder="Generate one in Nextcloud → Settings → Security"
-          autoComplete="current-password"
-        />
-      </div>
-      <p style={{ margin: "0 0 20px", fontSize: 11, color: "rgba(232,233,240,0.3)", lineHeight: 1.5 }}>
-        Use an app password, not your account password.
-      </p>
-
-      {error && <ErrorBanner msg={error} />}
-
-      <div style={{ display: "flex", gap: 8, justifyContent: "flex-end" }}>
-        <button
-          onClick={onNext}
-          style={{ padding: "8px 16px", background: "transparent", border: "1px solid rgba(255,255,255,0.1)", borderRadius: 7, color: "rgba(232,233,240,0.5)", cursor: "pointer", fontSize: 13, fontFamily: "inherit" }}
-        >
-          Skip for now
-        </button>
-        <button
-          onClick={() => saveMutation.mutate()}
-          disabled={!canSave || saveMutation.isPending}
-          style={{ padding: "8px 18px", background: canSave ? "#14b8a6" : "rgba(20,184,166,0.3)", border: "none", borderRadius: 7, color: canSave ? "#fff" : "rgba(255,255,255,0.4)", cursor: canSave ? "pointer" : "default", fontSize: 13, fontWeight: 600, fontFamily: "inherit" }}
-        >
-          {saveMutation.isPending ? "Saving…" : "Save & Continue"}
-        </button>
-      </div>
-    </>
-  );
-}
-
-// ── Step 2: Band details ───────────────────────────────────────────────────────
-
-function BandStep({ ncConfigured, onClose }: { ncConfigured: boolean; onClose: () => void }) {
+function BandStep({ onClose }: { onClose: () => void }) {
   const navigate = useNavigate();
   const qc = useQueryClient();
   const [name, setName] = useState("");
   const [slug, setSlug] = useState("");
-  const [ncFolder, setNcFolder] = useState("");
   const [error, setError] = useState<string | null>(null);
   const nameRef = useRef<HTMLInputElement>(null);
 
   useEffect(() => { nameRef.current?.focus(); }, []);
 
   const mutation = useMutation({
-    mutationFn: () =>
-      createBand({
-        name,
-        slug,
-        ...(ncFolder.trim() ? { nc_base_path: ncFolder.trim() } : {}),
-      }),
+    mutationFn: () => createBand({ name, slug }),
     onSuccess: (band) => {
       qc.invalidateQueries({ queryKey: ["bands"] });
       onClose();
@@ -187,12 +68,6 @@ function BandStep({ ncConfigured, onClose }: { ncConfigured: boolean; onClose: (
 
   return (
     <>
-      {!ncConfigured && (
-        <div style={{ marginBottom: 18, padding: "9px 12px", background: "rgba(251,191,36,0.07)", border: "1px solid rgba(251,191,36,0.2)", borderRadius: 7, fontSize: 12, color: "rgba(251,191,36,0.8)", lineHeight: 1.5 }}>
-          Storage not configured — recordings won't be scanned. You can set it up later in Settings → Storage.
-        </div>
-      )}
-
       {error && <ErrorBanner msg={error} />}
 
       <div style={{ marginBottom: 14 }}>
@@ -207,7 +82,7 @@ function BandStep({ ncConfigured, onClose }: { ncConfigured: boolean; onClose: (
         />
       </div>
 
-      <div style={{ marginBottom: 20 }}>
+      <div style={{ marginBottom: 24 }}>
         <label style={labelStyle}>SLUG</label>
         <input
           value={slug}
@@ -217,24 +92,9 @@ function BandStep({ ncConfigured, onClose }: { ncConfigured: boolean; onClose: (
         />
       </div>
 
-      <div style={{ borderTop: "1px solid rgba(255,255,255,0.06)", paddingTop: 18, marginBottom: 22 }}>
-        <label style={labelStyle}>
-          NEXTCLOUD FOLDER{" "}
-          <span style={{ color: "rgba(232,233,240,0.25)", fontWeight: 400, letterSpacing: 0 }}>(optional)</span>
-        </label>
-        <input
-          value={ncFolder}
-          onChange={(e) => setNcFolder(e.target.value)}
-          style={{ ...inputStyle, fontFamily: "monospace" }}
-          placeholder={slug ? `bands/${slug}/` : "bands/my-band/"}
-          disabled={!ncConfigured}
-        />
-        <p style={{ margin: "7px 0 0", fontSize: 11, color: "rgba(232,233,240,0.3)", lineHeight: 1.5 }}>
-          {ncConfigured
-            ? <>Leave blank to auto-create <code style={{ color: "rgba(232,233,240,0.45)", fontFamily: "monospace" }}>bands/{slug || "slug"}/</code>.</>
-            : "Connect storage first to set a folder."}
-        </p>
-      </div>
+      <p style={{ margin: "0 0 20px", fontSize: 11, color: "rgba(232,233,240,0.3)", lineHeight: 1.5 }}>
+        Connect storage after creating the band via Settings → Storage.
+      </p>
 
       <div style={{ display: "flex", gap: 8, justifyContent: "flex-end" }}>
         <button
@@ -255,17 +115,9 @@ function BandStep({ ncConfigured, onClose }: { ncConfigured: boolean; onClose: (
   );
 }
 
-// ── Create Band Modal (orchestrates steps) ─────────────────────────────────────
+// ── Create Band Modal ──────────────────────────────────────────────────────────
 
 function CreateBandModal({ onClose }: { onClose: () => void }) {
-  const { data: me, isLoading } = useQuery<Me>({
-    queryKey: ["me"],
-    queryFn: () => api.get("/auth/me"),
-  });
-
-  // Start on step 0 (storage) if NC not configured, otherwise jump straight to step 1 (band)
-  const [step, setStep] = useState<0 | 1 | null>(me ? (me.nc_configured ? 1 : 0) : null);
-
   // Close on Escape
   useEffect(() => {
     const handler = (e: KeyboardEvent) => { if (e.key === "Escape") onClose(); };
@@ -273,9 +125,6 @@ function CreateBandModal({ onClose }: { onClose: () => void }) {
     return () => document.removeEventListener("keydown", handler);
   }, [onClose]);
 
-  const totalSteps = me?.nc_configured === false ? 2 : 1;
-  const currentDot = step === 0 ? 0 : totalSteps - 1;
-
   return (
     <div
       onClick={onClose}
@@ -285,28 +134,13 @@ function CreateBandModal({ onClose }: { onClose: () => void }) {
         onClick={(e) => e.stopPropagation()}
         style={{ background: "#112018", border: "1px solid rgba(255,255,255,0.1)", borderRadius: 14, padding: 28, width: 420, boxShadow: "0 24px 64px rgba(0,0,0,0.6)" }}
       >
-        {/* Header */}
-        <div style={{ display: "flex", alignItems: "flex-start", justifyContent: "space-between", marginBottom: 18 }}>
-          <div>
-            <h3 style={{ margin: "0 0 3px", fontSize: 15, fontWeight: 600, color: "#e8e9f0" }}>
-              {step === 0 ? "Connect storage" : "New band"}
-            </h3>
-            <p style={{ margin: 0, fontSize: 12, color: "rgba(232,233,240,0.4)" }}>
-              {step === 0 ? "Needed to scan and index your recordings." : "Create a workspace for your recordings."}
-            </p>
-          </div>
-          {totalSteps > 1 && step !== null && (
-            <StepDots current={currentDot} total={totalSteps} />
-          )}
+        <div style={{ marginBottom: 18 }}>
+          <h3 style={{ margin: "0 0 3px", fontSize: 15, fontWeight: 600, color: "#e8e9f0" }}>New band</h3>
+          <p style={{ margin: 0, fontSize: 12, color: "rgba(232,233,240,0.4)" }}>
+            Create a workspace for your recordings.
+          </p>
         </div>
-
-        {isLoading || step === null ? (
-          <p style={{ color: "rgba(232,233,240,0.3)", fontSize: 13 }}>Loading…</p>
-        ) : step === 0 ? (
-          <StorageStep me={me!} onNext={() => setStep(1)} />
-        ) : (
-          <BandStep ncConfigured={me?.nc_configured ?? false} onClose={onClose} />
-        )}
+        <BandStep onClose={onClose} />
       </div>
     </div>
   );