Freezmo: self-hosted notes-to-activities study app

Next.js 15 app that turns photos, PDFs, DOCX/PPTX and text into a swipeable
feed of AI-generated activities (flashcards, multiple choice, true/false,
fill-in-the-blank, matching, ordering, short answer) using the user's own
Ollama models.

Highlights:
- All AI calls run in server route handlers; the browser never talks to Ollama.
- Bring-your-own-key mode (default): the key lives only in the browser and is
  sent per-request; server, local-daemon and shared-key modes also supported.
- Client-side document extraction (pdf.js, mammoth, jszip) with scanned-PDF
  page rendering for the vision model; notes stay in their original language.
- ChatGPT-style shell: collapsible sidebar / mobile drawer, neutral token-based
  light + dark themes, folder organisation, PWA (manifest, SW, offline page).
- Strict JSON validation with zod + auto-repair, rate limiting, and request
  guards (cross-origin, body-size, API-key sanitising).
- setup.sh bootstraps deps, .env.local and a production build.

Gitignore excludes .env*, the generated pdf.js worker and local scratch files.

components/AppHeader.tsx

@@ -0,0 +1,85 @@
+"use client";
+
+import Link from "next/link";
+import { useEffect, useState } from "react";
+
+import { GearIcon, MenuIcon, SnowflakeIcon } from "@/components/icons";
+import { SettingsDialog } from "@/components/SettingsDialog";
+import { ThemeToggle } from "@/components/ThemeToggle";
+import { sidebarOpen } from "@/lib/nav";
+import { OPEN_SETTINGS_EVENT } from "@/lib/ui-events";
+import { cn } from "@/lib/utils";
+
+/**
+ * Minimal, sticky frosted top bar: brand on the left, quiet actions on the
+ * right. The phone layout keeps the brand compact and relies on the tab bar
+ * for navigation.
+ */
+export function AppHeader({ className, compact = false }: { className?: string; compact?: boolean }) {
+  const [settingsOpen, setSettingsOpen] = useState(false);
+
+  useEffect(() => {
+    const onOpen = () => setSettingsOpen(true);
+    window.addEventListener(OPEN_SETTINGS_EVENT, onOpen);
+    return () => window.removeEventListener(OPEN_SETTINGS_EVENT, onOpen);
+  }, []);
+
+  // Restore the desktop sidebar width preference once, on the client.
+  useEffect(() => {
+    void import("@/components/Sidebar").then((module) => module.sidebarCollapse.hydrate());
+  }, []);
+
+  return (
+    <>
+      <header
+        className={cn(
+          "glass sticky top-0 z-40 -mx-4 mb-6 px-4 lg:hidden sm:-mx-6 sm:px-6",
+          className,
+        )}
+      >
+        <div className="mx-auto flex h-14 max-w-6xl items-center justify-between gap-3">
+          <button
+            type="button"
+            onClick={() => sidebarOpen.toggle()}
+            aria-label="Open menu"
+            className="mr-1 grid size-9 shrink-0 place-items-center rounded-full text-[var(--text-muted)] transition hover:bg-[var(--hover)] hover:text-[var(--text)]"
+          >
+            <MenuIcon className="size-5" />
+          </button>
+          <Link href="/" className="group flex items-center gap-2.5 rounded-xl px-1 py-1" aria-label="Freezmo home">
+            <span
+              aria-hidden
+              className="grid size-8 place-items-center rounded-[0.6rem] bg-[var(--text)] text-[var(--page)] transition-transform group-hover:scale-[1.04]"
+            >
+              <SnowflakeIcon className="size-[18px]" />
+            </span>
+            <span className="flex items-baseline gap-2">
+              <span className="text-[15px] font-semibold tracking-[-0.01em] text-[var(--text)]">
+                Freezmo
+              </span>
+              {!compact ? (
+                <span className="hidden text-[13px] text-[var(--text-subtle)] sm:inline">
+                  study feed
+                </span>
+              ) : null}
+            </span>
+          </Link>
+
+          <div className="flex items-center gap-1">
+            <button
+              type="button"
+              onClick={() => setSettingsOpen(true)}
+              aria-label="Open settings and Ollama status"
+              title="Settings"
+              className="inline-flex size-9 items-center justify-center rounded-full text-[var(--text-muted)] transition hover:bg-[var(--hover)] hover:text-[var(--text)]"
+            >
+              <GearIcon className="size-[18px]" />
+            </button>
+            <ThemeToggle />
+          </div>
+        </div>
+      </header>
+      <SettingsDialog open={settingsOpen} onClose={() => setSettingsOpen(false)} />
+    </>
+  );
+}