feat(dashboard): Next.js 16 merchant panel with offline POS and PWA

Complete merchant dashboard upgrade:

Next.js 16 compatibility:
- Fix params/searchParams typed as Promise<{}> throughout App Router
- Replace middleware.ts with proxy.ts (Next.js 16 convention)
- Remove unused @ts-expect-error directives caught by stricter TS
- Cast dynamic next-intl t() keys to fix TranslateArgs type errors

Offline POS:
- IndexedDB queue (meezi_pos_offline) for orders created while offline
- Zustand sync store tracking queueCount, isSyncing, isOnline
- useOfflineSync hook: auto-syncs on reconnect/visibility-change
- SyncStatusIndicator chip in topbar (amber=offline, blue=syncing)
- submitOrderToApi falls back to local order on network failure
- Local orders skip payment flow; sync on reconnect

PWA (installable):
- @ducanh2912/next-pwa with Workbox runtime caching rules
- Web App Manifest (manifest.ts) — RTL/Farsi, theme #0F6E56
- PWA icons: 192px, 512px, maskable 512px
- next.config.ts replaces next.config.mjs

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

web/dashboard/src/components/crm/crm-screen.tsx

@@ -0,0 +1,132 @@
+"use client";
+
+import { useState } from "react";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { useTranslations } from "next-intl";
+import { Plus, Pencil, Search } from "lucide-react";
+import { apiGet } from "@/lib/api/client";
+import type { Customer } from "@/lib/api/types";
+import { useAuthStore } from "@/lib/stores/auth.store";
+import { formatNumber } from "@/lib/format";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { LabeledField } from "@/components/ui/labeled-field";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Badge } from "@/components/ui/badge";
+import { CustomerWizard, type CustomerWizardMode } from "@/components/crm/customer-wizard";
+
+export function CrmScreen() {
+  const t = useTranslations("crm");
+  const tCommon = useTranslations("common");
+  const cafeId = useAuthStore((s) => s.user?.cafeId);
+  const queryClient = useQueryClient();
+
+  const [search, setSearch] = useState("");
+  const [debouncedSearch, setDebouncedSearch] = useState("");
+  const [wizardOpen, setWizardOpen] = useState(false);
+  const [wizardMode, setWizardMode] = useState<CustomerWizardMode>("create");
+  const [editingCustomer, setEditingCustomer] = useState<Customer | null>(null);
+
+  const { data: customers = [], isLoading } = useQuery({
+    queryKey: ["customers", cafeId, debouncedSearch],
+    queryFn: () =>
+      apiGet<Customer[]>(
+        `/api/cafes/${cafeId}/customers${debouncedSearch ? `?q=${encodeURIComponent(debouncedSearch)}` : ""}`
+      ),
+    enabled: !!cafeId,
+  });
+
+  const openWizard = (mode: CustomerWizardMode, customer?: Customer) => {
+    setWizardMode(mode);
+    setEditingCustomer(customer ?? null);
+    setWizardOpen(true);
+  };
+
+  const refreshCustomers = () => {
+    queryClient.invalidateQueries({ queryKey: ["customers", cafeId] });
+  };
+
+  if (!cafeId) return null;
+
+  return (
+    <div className="space-y-4">
+      <div className="flex flex-wrap items-center justify-between gap-3">
+        <h2 className="text-xl font-bold">{t("title")}</h2>
+        <Button
+          className="bg-[#0F6E56] hover:bg-[#0c5a46]"
+          onClick={() => openWizard("create")}
+        >
+          <Plus className="me-2 h-4 w-4" />
+          {t("addCustomer")}
+        </Button>
+      </div>
+
+      <div className="flex flex-wrap items-end gap-2">
+        <LabeledField label={tCommon("search")} htmlFor="crm-search" className="min-w-[12rem] flex-1">
+          <Input
+            id="crm-search"
+            value={search}
+            onChange={(e) => setSearch(e.target.value)}
+            onKeyDown={(e) => e.key === "Enter" && setDebouncedSearch(search)}
+          />
+        </LabeledField>
+        <Button variant="outline" onClick={() => setDebouncedSearch(search)}>
+          <Search className="h-4 w-4" />
+          {tCommon("search")}
+        </Button>
+      </div>
+
+      {isLoading ? (
+        <p className="text-muted-foreground">{tCommon("loading")}</p>
+      ) : customers.length === 0 ? (
+        <p className="text-muted-foreground">{t("noCustomers")}</p>
+      ) : (
+        <div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
+          {customers.map((c) => (
+            <Card key={c.id} className="rounded-xl border border-border/80 shadow-sm">
+              <CardHeader className="pb-2">
+                <div className="flex items-start justify-between gap-2">
+                  <CardTitle className="text-base">{c.name}</CardTitle>
+                  <Badge variant="secondary">{t(`groups.${c.group}`)}</Badge>
+                </div>
+              </CardHeader>
+              <CardContent className="space-y-3">
+                <div className="space-y-1 text-sm text-muted-foreground">
+                  <p dir="ltr" className="text-end font-mono">
+                    {c.phone}
+                  </p>
+                  {c.nationalId ? (
+                    <p>
+                      {t("nationalId")}: {c.nationalId}
+                    </p>
+                  ) : null}
+                  <p>
+                    {t("loyaltyPoints")}: {formatNumber(c.loyaltyPoints)}
+                  </p>
+                </div>
+                <Button
+                  size="sm"
+                  variant="outline"
+                  className="w-full"
+                  onClick={() => openWizard("edit", c)}
+                >
+                  <Pencil className="me-1 h-3.5 w-3.5" />
+                  {tCommon("edit")}
+                </Button>
+              </CardContent>
+            </Card>
+          ))}
+        </div>
+      )}
+
+      <CustomerWizard
+        open={wizardOpen}
+        mode={wizardMode}
+        cafeId={cafeId}
+        customer={editingCustomer}
+        onClose={() => setWizardOpen(false)}
+        onSaved={refreshCustomers}
+      />
+    </div>
+  );
+}