@gelabs/ovr 0.2.2 → 0.3.0

package/dist/ui-components-admin/admin-nav.js

@@ -1,85 +1,411 @@
 "use client";
-import { Dialog, DialogTrigger, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, DialogClose } from '../chunk-M35R6JLA.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator } from '../chunk-V7VQVDWS.js';
+import { Sheet, SheetTrigger, SheetContent, SheetHeader, SheetTitle, SheetDescription, SheetFooter } from '../chunk-3YKVH4Y7.js';
+import { Label } from '../chunk-XQTVSNHC.js';
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, DialogClose } from '../chunk-M35R6JLA.js';
+import { Input } from '../chunk-K3KIBHJF.js';
 import { Button } from '../chunk-I4WDVYHX.js';
-import { useCopy } from '../chunk-E2D7QT6N.js';
+import { useCopy } from '../chunk-TJSNVTVB.js';
 import { cn } from '../chunk-77QBZC7J.js';
-import { useIdentity } from '../chunk-IB4JVGKJ.js';
-import '../chunk-B634JHKZ.js';
-import Link from 'next/link';
+import { hasPermission } from '../chunk-IS3THKTE.js';
+import { useIdentity, useNotificationsState, cacheCredential } from '../chunk-YGYA7KEG.js';
+import '../chunk-BI4EGLPG.js';
+import * as React from 'react';
+import Link2 from 'next/link';
 import { usePathname } from 'next/navigation';
-import { LayoutDashboard, ListChecks, FilePlus2, LogOut } from 'lucide-react';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { LayoutDashboard, ListChecks, Users, ShieldCheck, BadgeCheck, ScrollText, MoreHorizontal, ChevronDown, UserRound, KeyRound, LogOut, Menu, Bell, Loader2 } from 'lucide-react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { toast } from 'sonner';
 
+var BELL_LIMIT = 6;
+function NotificationBell() {
+  const { items, total, unseen, markSeen } = useNotificationsState();
+  const t = useCopy().admin.notifications;
+  const hasOverdue = items.some((n) => n.type === "overdue");
+  const top = items.slice(0, BELL_LIMIT);
+  return /* @__PURE__ */ jsxs(
+    DropdownMenu,
+    {
+      onOpenChange: (open) => {
+        if (open) markSeen();
+      },
+      children: [
+        /* @__PURE__ */ jsxs(
+          DropdownMenuTrigger,
+          {
+            render: /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "aria-label": t.title,
+                className: "relative flex items-center rounded-md px-2 py-1.5 text-sm font-medium text-gov-foreground/80 transition-colors hover:bg-white/10 hover:text-gov-foreground aria-expanded:bg-white/10 aria-expanded:text-gov-foreground"
+              }
+            ),
+            children: [
+              /* @__PURE__ */ jsx(Bell, { className: "size-4 shrink-0" }),
+              unseen ? /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cn(
+                    "absolute -top-0.5 -right-0.5 flex min-w-4 items-center justify-center rounded-full px-1 text-[0.625rem] leading-4 font-semibold text-white",
+                    hasOverdue ? "bg-red-500" : "bg-amber-500"
+                  ),
+                  children: total > 99 ? "99+" : total
+                }
+              ) : null
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: "min-w-72", children: [
+          /* @__PURE__ */ jsx("div", { className: "px-2 py-1.5 text-sm font-medium", children: t.title }),
+          /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+          items.length === 0 ? /* @__PURE__ */ jsx("div", { className: "px-2 py-3 text-center text-sm text-muted-foreground", children: t.empty }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            top.map((n) => /* @__PURE__ */ jsxs(DropdownMenuItem, { render: /* @__PURE__ */ jsx(Link2, { href: n.href }), children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cn(
+                    "mt-1 size-2 shrink-0 rounded-full",
+                    n.type === "overdue" ? "bg-red-500" : "bg-amber-500"
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsxs("span", { className: "flex-1", children: [
+                /* @__PURE__ */ jsx("span", { className: "block font-mono text-xs", children: n.ovrTicketNo }),
+                /* @__PURE__ */ jsxs("span", { className: "block text-xs text-muted-foreground", children: [
+                  n.type === "overdue" ? t.overdue : t.outstanding,
+                  " \xB7 ",
+                  n.name
+                ] })
+              ] })
+            ] }, n.id)),
+            /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+            /* @__PURE__ */ jsx(DropdownMenuItem, { render: /* @__PURE__ */ jsx(Link2, { href: "/admin/notifications" }), children: /* @__PURE__ */ jsxs("span", { className: "flex-1 text-center text-sm", children: [
+              t.viewAll,
+              total > top.length ? ` (${total})` : ""
+            ] }) })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+function ChangePasswordDialog({
+  open,
+  onOpenChange,
+  action
+}) {
+  const t = useCopy().admin.changePassword;
+  const identity = useIdentity();
+  const [current, setCurrent] = React.useState("");
+  const [next, setNext] = React.useState("");
+  const [confirm, setConfirm] = React.useState("");
+  const [submitting, setSubmitting] = React.useState(false);
+  function reset() {
+    setCurrent("");
+    setNext("");
+    setConfirm("");
+  }
+  async function submit(e) {
+    e.preventDefault();
+    if (next.length < 6)
+      return toast.error("New password must be at least 6 characters.");
+    if (next !== confirm) return toast.error(t.mismatch);
+    setSubmitting(true);
+    try {
+      const res = await action(current, next);
+      if (res?.error) {
+        toast.error(res.error);
+        return;
+      }
+      if (identity) {
+        try {
+          await cacheCredential(identity.username, next, identity);
+        } catch {
+        }
+      }
+      toast.success(t.success);
+      reset();
+      onOpenChange(false);
+    } finally {
+      setSubmitting(false);
+    }
+  }
+  return /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      open,
+      onOpenChange: (o) => {
+        if (!o) reset();
+        onOpenChange(o);
+      },
+      children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-sm", children: [
+        /* @__PURE__ */ jsxs(DialogHeader, { children: [
+          /* @__PURE__ */ jsx(DialogTitle, { children: t.title }),
+          /* @__PURE__ */ jsx(DialogDescription, { children: t.subtitle })
+        ] }),
+        /* @__PURE__ */ jsxs("form", { onSubmit: submit, className: "space-y-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "cp-current", children: t.current }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "cp-current",
+                type: "password",
+                value: current,
+                onChange: (e) => setCurrent(e.target.value),
+                autoComplete: "current-password",
+                autoFocus: true
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "cp-new", children: t.new }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "cp-new",
+                type: "password",
+                value: next,
+                onChange: (e) => setNext(e.target.value),
+                autoComplete: "new-password"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "cp-confirm", children: t.confirm }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "cp-confirm",
+                type: "password",
+                value: confirm,
+                onChange: (e) => setConfirm(e.target.value),
+                autoComplete: "new-password"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs(DialogFooter, { children: [
+            /* @__PURE__ */ jsx(DialogClose, { render: /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline" }), children: t.cancel }),
+            /* @__PURE__ */ jsxs(Button, { type: "submit", disabled: submitting, className: "gap-1.5", children: [
+              submitting ? /* @__PURE__ */ jsx(Loader2, { className: "size-4 animate-spin" }) : /* @__PURE__ */ jsx(KeyRound, { className: "size-4" }),
+              submitting ? t.saving : t.submit
+            ] })
+          ] })
+        ] })
+      ] })
+    }
+  );
+}
 function isActive(p, href) {
   if (href === "/admin") return p === "/admin";
   if (href === "/admin/tickets") {
     return p === "/admin/tickets" || p.startsWith("/admin/tickets/") && p !== "/admin/tickets/new";
   }
+  if (href === "/admin/accounts") return p.startsWith("/admin/accounts");
+  if (href === "/admin/roles") return p.startsWith("/admin/roles");
+  if (href === "/admin/officers") return p.startsWith("/admin/officers");
+  if (href === "/admin/logs") return p.startsWith("/admin/logs");
   return p === href;
 }
+function itemClass(active) {
+  return cn(
+    "flex items-center gap-1.5 rounded-md px-2.5 py-1.5 text-sm font-medium transition-colors",
+    active ? "bg-white/15 text-gov-foreground" : "text-gov-foreground/80 hover:bg-white/10 hover:text-gov-foreground aria-expanded:bg-white/10 aria-expanded:text-gov-foreground"
+  );
+}
 function AdminNav({
-  signOutAction
+  signOutAction,
+  changePasswordAction
 }) {
   const pathname = usePathname();
   const copy = useCopy();
   const identity = useIdentity();
-  const limited = identity?.role === "ENFORCER";
-  const nav = [
-    ...limited ? [] : [{ href: "/admin", label: copy.admin.dashboard, icon: LayoutDashboard }],
-    { href: "/admin/tickets", label: copy.admin.tickets, icon: ListChecks },
-    { href: "/admin/tickets/new", label: copy.admin.issueTicket, icon: FilePlus2 }
+  const perms = identity?.permissions ?? [];
+  const [signOutOpen, setSignOutOpen] = React.useState(false);
+  const [changePwOpen, setChangePwOpen] = React.useState(false);
+  const [mobileOpen, setMobileOpen] = React.useState(false);
+  const primaryAll = [
+    { href: "/admin", label: copy.admin.dashboard, icon: LayoutDashboard, perm: "dashboard:view" },
+    { href: "/admin/tickets", label: copy.admin.tickets, icon: ListChecks, perm: "tickets:view" }
   ];
-  return /* @__PURE__ */ jsxs("nav", { className: "flex items-center gap-0.5 sm:gap-1", children: [
-    nav.map((it) => {
-      const active = isActive(pathname, it.href);
-      const Icon = it.icon;
-      return /* @__PURE__ */ jsxs(
-        Link,
-        {
-          href: it.href,
-          className: cn(
-            "flex items-center gap-1.5 rounded-md px-2.5 py-1.5 text-sm font-medium transition-colors",
-            active ? "bg-white/15 text-gov-foreground" : "text-gov-foreground/80 hover:bg-white/10 hover:text-gov-foreground"
-          ),
-          children: [
-            /* @__PURE__ */ jsx(Icon, { className: "size-4 shrink-0" }),
-            /* @__PURE__ */ jsx("span", { className: "hidden md:inline", children: it.label })
-          ]
-        },
-        it.href
-      );
-    }),
-    /* @__PURE__ */ jsxs(Dialog, { children: [
-      /* @__PURE__ */ jsxs(
-        DialogTrigger,
-        {
-          render: /* @__PURE__ */ jsx(
-            "button",
+  const overflowAll = [
+    { href: "/admin/accounts", label: copy.admin.accounts, icon: Users, perm: "accounts:manage" },
+    { href: "/admin/roles", label: copy.admin.roles, icon: ShieldCheck, perm: "roles:manage" },
+    { href: "/admin/officers", label: copy.admin.officers, icon: BadgeCheck, perm: "officers:manage" },
+    { href: "/admin/logs", label: copy.admin.logs, icon: ScrollText, perm: "logs:view" }
+  ];
+  const primary = primaryAll.filter((it) => hasPermission(perms, it.perm));
+  const overflow = overflowAll.filter((it) => hasPermission(perms, it.perm));
+  const overflowActive = overflow.some((it) => isActive(pathname, it.href));
+  const allNav = [...primary, ...overflow];
+  const roleLabel = identity?.roleLabel ?? identity?.role ?? void 0;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("nav", { className: "hidden items-center gap-0.5 md:flex md:gap-1", children: [
+      primary.map((it) => {
+        const Icon = it.icon;
+        return /* @__PURE__ */ jsxs(Link2, { href: it.href, className: itemClass(isActive(pathname, it.href)), children: [
+          /* @__PURE__ */ jsx(Icon, { className: "size-4 shrink-0" }),
+          /* @__PURE__ */ jsx("span", { className: "hidden md:inline", children: it.label })
+        ] }, it.href);
+      }),
+      overflow.length > 0 ? /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+        /* @__PURE__ */ jsxs(
+          DropdownMenuTrigger,
+          {
+            render: /* @__PURE__ */ jsx("button", { type: "button", className: itemClass(overflowActive) }),
+            children: [
+              /* @__PURE__ */ jsx(MoreHorizontal, { className: "size-4 shrink-0" }),
+              /* @__PURE__ */ jsx("span", { className: "hidden md:inline", children: copy.admin.more }),
+              /* @__PURE__ */ jsx(ChevronDown, { className: "size-3.5 shrink-0 opacity-70" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(DropdownMenuContent, { align: "end", className: "min-w-44", children: overflow.map((it) => {
+          const Icon = it.icon;
+          return /* @__PURE__ */ jsxs(
+            DropdownMenuItem,
             {
-              type: "button",
-              className: "flex items-center gap-1.5 rounded-md px-2.5 py-1.5 text-sm font-medium text-gov-foreground/80 transition-colors hover:bg-white/10 hover:text-gov-foreground"
-            }
-          ),
-          children: [
+              render: /* @__PURE__ */ jsx(Link2, { href: it.href }),
+              className: cn(isActive(pathname, it.href) && "bg-accent text-accent-foreground"),
+              children: [
+                /* @__PURE__ */ jsx(Icon, { className: "size-4 shrink-0" }),
+                it.label
+              ]
+            },
+            it.href
+          );
+        }) })
+      ] }) : null,
+      hasPermission(perms, "notifications:view") ? /* @__PURE__ */ jsx(NotificationBell, {}) : null,
+      /* @__PURE__ */ jsx("span", { className: "mx-1 hidden h-5 w-px bg-white/15 sm:block", "aria-hidden": true }),
+      /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+        /* @__PURE__ */ jsxs(
+          DropdownMenuTrigger,
+          {
+            render: /* @__PURE__ */ jsx("button", { type: "button", className: itemClass(false) }),
+            children: [
+              /* @__PURE__ */ jsx(UserRound, { className: "size-4 shrink-0" }),
+              /* @__PURE__ */ jsx("span", { className: "hidden max-w-[14ch] truncate md:inline", children: identity?.username ?? copy.admin.portal }),
+              /* @__PURE__ */ jsx(ChevronDown, { className: "size-3.5 shrink-0 opacity-70" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: "min-w-48", children: [
+          /* @__PURE__ */ jsxs("div", { className: "px-2 py-1.5", children: [
+            /* @__PURE__ */ jsx("p", { className: "truncate text-sm font-medium leading-tight", children: identity?.username ?? "\u2014" }),
+            roleLabel ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: roleLabel }) : null
+          ] }),
+          /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+          changePasswordAction ? /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: () => setChangePwOpen(true), children: [
+            /* @__PURE__ */ jsx(KeyRound, { className: "size-4 shrink-0" }),
+            copy.admin.changePassword.title
+          ] }) : null,
+          /* @__PURE__ */ jsxs(DropdownMenuItem, { variant: "destructive", onClick: () => setSignOutOpen(true), children: [
             /* @__PURE__ */ jsx(LogOut, { className: "size-4 shrink-0" }),
-            /* @__PURE__ */ jsx("span", { className: "hidden md:inline", children: "Sign out" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-sm", children: [
-        /* @__PURE__ */ jsxs(DialogHeader, { children: [
-          /* @__PURE__ */ jsx(DialogTitle, { children: "Sign out?" }),
-          /* @__PURE__ */ jsx(DialogDescription, { children: "You'll need to sign in again to issue or manage tickets." })
-        ] }),
-        /* @__PURE__ */ jsxs(DialogFooter, { children: [
-          /* @__PURE__ */ jsx(DialogClose, { render: /* @__PURE__ */ jsx(Button, { variant: "outline" }), children: "Cancel" }),
-          /* @__PURE__ */ jsx("form", { action: signOutAction, children: /* @__PURE__ */ jsxs(Button, { type: "submit", variant: "destructive", className: "gap-2", children: [
-            /* @__PURE__ */ jsx(LogOut, { className: "size-4" }),
-            "Sign out"
-          ] }) })
+            copy.admin.signOut
+          ] })
         ] })
       ] })
-    ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-0.5 md:hidden", children: [
+      hasPermission(perms, "notifications:view") ? /* @__PURE__ */ jsx(NotificationBell, {}) : null,
+      /* @__PURE__ */ jsxs(Sheet, { open: mobileOpen, onOpenChange: setMobileOpen, children: [
+        /* @__PURE__ */ jsx(
+          SheetTrigger,
+          {
+            render: /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "aria-label": copy.admin.more,
+                className: itemClass(false)
+              }
+            ),
+            children: /* @__PURE__ */ jsx(Menu, { className: "size-5 shrink-0" })
+          }
+        ),
+        /* @__PURE__ */ jsxs(SheetContent, { side: "right", className: "w-72 gap-0 p-0", children: [
+          /* @__PURE__ */ jsxs(SheetHeader, { className: "border-b", children: [
+            /* @__PURE__ */ jsx(SheetTitle, { className: "truncate", children: identity?.username ?? copy.admin.portal }),
+            roleLabel ? /* @__PURE__ */ jsx(SheetDescription, { children: roleLabel }) : null
+          ] }),
+          /* @__PURE__ */ jsx("nav", { className: "flex flex-1 flex-col gap-0.5 overflow-y-auto p-2", children: allNav.map((it) => {
+            const Icon = it.icon;
+            const active = isActive(pathname, it.href);
+            return /* @__PURE__ */ jsxs(
+              Link2,
+              {
+                href: it.href,
+                onClick: () => setMobileOpen(false),
+                className: cn(
+                  "flex items-center gap-2.5 rounded-md px-3 py-2 text-sm font-medium transition-colors",
+                  active ? "bg-accent text-accent-foreground" : "text-foreground/80 hover:bg-muted hover:text-foreground"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(Icon, { className: "size-4 shrink-0" }),
+                  it.label
+                ]
+              },
+              it.href
+            );
+          }) }),
+          /* @__PURE__ */ jsxs(SheetFooter, { className: "border-t", children: [
+            changePasswordAction ? /* @__PURE__ */ jsxs(
+              Button,
+              {
+                variant: "outline",
+                className: "justify-start gap-2",
+                onClick: () => {
+                  setMobileOpen(false);
+                  setChangePwOpen(true);
+                },
+                children: [
+                  /* @__PURE__ */ jsx(KeyRound, { className: "size-4" }),
+                  copy.admin.changePassword.title
+                ]
+              }
+            ) : null,
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                variant: "destructive",
+                className: "justify-start gap-2",
+                onClick: () => {
+                  setMobileOpen(false);
+                  setSignOutOpen(true);
+                },
+                children: [
+                  /* @__PURE__ */ jsx(LogOut, { className: "size-4" }),
+                  copy.admin.signOut
+                ]
+              }
+            )
+          ] })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(Dialog, { open: signOutOpen, onOpenChange: setSignOutOpen, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-sm", children: [
+      /* @__PURE__ */ jsxs(DialogHeader, { children: [
+        /* @__PURE__ */ jsx(DialogTitle, { children: copy.admin.signOutConfirmTitle }),
+        /* @__PURE__ */ jsx(DialogDescription, { children: copy.admin.signOutConfirmBody })
+      ] }),
+      /* @__PURE__ */ jsxs(DialogFooter, { children: [
+        /* @__PURE__ */ jsx(DialogClose, { render: /* @__PURE__ */ jsx(Button, { variant: "outline" }), children: copy.admin.cancel }),
+        /* @__PURE__ */ jsx("form", { action: signOutAction, children: /* @__PURE__ */ jsxs(Button, { type: "submit", variant: "destructive", className: "gap-2", children: [
+          /* @__PURE__ */ jsx(LogOut, { className: "size-4" }),
+          copy.admin.signOut
+        ] }) })
+      ] })
+    ] }) }),
+    changePasswordAction ? /* @__PURE__ */ jsx(
+      ChangePasswordDialog,
+      {
+        open: changePwOpen,
+        onOpenChange: setChangePwOpen,
+        action: changePasswordAction
+      }
+    ) : null
   ] });
 }
 

package/dist/ui-components-admin/issuance-form.js

@@ -1,24 +1,25 @@
 "use client";
 import { Skeleton } from '../chunk-EGKFELO3.js';
 import { Textarea } from '../chunk-QCRVT2SS.js';
+import { Alert, AlertDescription } from '../chunk-EYFZWQ4J.js';
 import { Checkbox } from '../chunk-BBQBKQA4.js';
-import { Input } from '../chunk-K3KIBHJF.js';
-import { Label } from '../chunk-XQTVSNHC.js';
-import { TicketPreview } from '../chunk-GDOCD7LT.js';
-import '../chunk-JEYT63LE.js';
-import '../chunk-BIQ2J75Y.js';
+import { TicketPreview } from '../chunk-ZUMEOZ22.js';
+import '../chunk-IBZVIUNI.js';
+import '../chunk-GLIK5BHP.js';
 import '../chunk-NSCIBSCW.js';
-import { Alert, AlertDescription } from '../chunk-EYFZWQ4J.js';
-import { Card, CardHeader, CardTitle, CardContent, CardDescription } from '../chunk-SETIN6XP.js';
 import '../chunk-OE525ZER.js';
+import '../chunk-BVI5XDDA.js';
+import { Card, CardHeader, CardTitle, CardContent, CardDescription } from '../chunk-SETIN6XP.js';
 import '../chunk-OWCGEEAZ.js';
 import '../chunk-55FQP2DO.js';
-import '../chunk-3KIDW4LT.js';
+import { Label } from '../chunk-XQTVSNHC.js';
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, DialogClose } from '../chunk-M35R6JLA.js';
+import { Input } from '../chunk-K3KIBHJF.js';
 import { Button } from '../chunk-I4WDVYHX.js';
-import { useFormatters, useOvrConfig } from '../chunk-E2D7QT6N.js';
+import { useFormatters, useOvrConfig } from '../chunk-TJSNVTVB.js';
 import { cn } from '../chunk-77QBZC7J.js';
-import { localToManilaISO, toPreviewTicket } from '../chunk-B634JHKZ.js';
+import { useIdentity } from '../chunk-YGYA7KEG.js';
+import { localToManilaISO, toPreviewTicket, listProvinces, citiesOfProvince } from '../chunk-BI4EGLPG.js';
 import * as React from 'react';
 import { toast } from 'sonner';
 import { FilePlus2, TriangleAlert, Loader2 } from 'lucide-react';
@@ -107,6 +108,7 @@ function IssuanceForm({
 }) {
   const { formatPeso, nowManilaLocalInput } = useFormatters();
   const { municipality, rules } = useOvrConfig();
+  const identity = useIdentity();
   const [firstName, setFirstName] = React.useState("");
   const [middleName, setMiddleName] = React.useState("");
   const [lastName, setLastName] = React.useState("");
@@ -177,7 +179,9 @@ function IssuanceForm({
         details: details || void 0
       })),
       remarks: remarks || void 0,
-      issuedBy: issuedBy || void 0
+      issuedBy: issuedBy || void 0,
+      apprehendingEnforcerId: identity?.userId,
+      apprehendingEnforcerName: identity?.username
     };
     startTransition(async () => {
       const res = await createAction(input);
@@ -200,8 +204,51 @@ function IssuanceForm({
           /* @__PURE__ */ jsx(TextField, { id: "license", label: "License number", value: licenseNumber, onChange: setLicenseNumber, required: true, placeholder: "N03-12-345678" }),
           /* @__PURE__ */ jsx("div", { className: "sm:col-span-2", children: /* @__PURE__ */ jsx(TextField, { id: "street", label: "Address line", value: street, onChange: setStreet, required: true, placeholder: "House no. / Purok / Zone / Street" }) }),
           /* @__PURE__ */ jsx("div", { className: "sm:col-span-2", children: /* @__PURE__ */ jsx(TextField, { id: "barangay", label: "Barangay", value: barangay, onChange: setBarangay, placeholder: "e.g. Amungan" }) }),
-          /* @__PURE__ */ jsx(TextField, { id: "city", label: "City / Municipality", value: cityMunicipality, onChange: setCityMunicipality, required: true }),
-          /* @__PURE__ */ jsx(TextField, { id: "province", label: "Province", value: province, onChange: setProvince, required: true }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsxs(Label, { htmlFor: "province", children: [
+              "Province",
+              /* @__PURE__ */ jsx("span", { className: "text-destructive", children: " *" })
+            ] }),
+            /* @__PURE__ */ jsxs(
+              "select",
+              {
+                id: "province",
+                value: province,
+                onChange: (e) => {
+                  const p = e.target.value;
+                  setProvince(p);
+                  if (cityMunicipality && !citiesOfProvince(p).includes(cityMunicipality)) {
+                    setCityMunicipality("");
+                  }
+                },
+                className: fieldClass,
+                children: [
+                  /* @__PURE__ */ jsx("option", { value: "", children: "Select province\u2026" }),
+                  listProvinces().map((p) => /* @__PURE__ */ jsx("option", { value: p, children: p }, p))
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsxs(Label, { htmlFor: "city", children: [
+              "City / Municipality",
+              /* @__PURE__ */ jsx("span", { className: "text-destructive", children: " *" })
+            ] }),
+            /* @__PURE__ */ jsxs(
+              "select",
+              {
+                id: "city",
+                value: cityMunicipality,
+                onChange: (e) => setCityMunicipality(e.target.value),
+                disabled: !province,
+                className: fieldClass,
+                children: [
+                  /* @__PURE__ */ jsx("option", { value: "", children: province ? "Select city / municipality\u2026" : "Select a province first" }),
+                  citiesOfProvince(province).map((c) => /* @__PURE__ */ jsx("option", { value: c, children: c }, c))
+                ]
+              }
+            )
+          ] }),
           /* @__PURE__ */ jsx(TextField, { id: "plate", label: "Plate number", value: plateNumber, onChange: setPlateNumber, placeholder: "ABC 1234" }),
           /* @__PURE__ */ jsx(TextField, { id: "contact", label: "Contact number", value: contactNo, onChange: setContactNo, placeholder: "0917 555 0000" })
         ] })
@@ -243,6 +290,18 @@ function IssuanceForm({
               }
             )
           ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "apprehendingEnforcer", children: "Apprehending enforcer" }),
+            /* @__PURE__ */ jsx(
+              "p",
+              {
+                id: "apprehendingEnforcer",
+                className: "flex h-9 items-center rounded-lg border border-input bg-muted/40 px-2.5 text-sm text-muted-foreground",
+                children: identity?.username ?? "\u2014"
+              }
+            ),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Auto-recorded from your sign-in." })
+          ] }),
           /* @__PURE__ */ jsx("div", { className: "sm:col-span-2", children: /* @__PURE__ */ jsx(TextField, { id: "place", label: "Place of violation", value: placeOfViolation, onChange: setPlaceOfViolation, placeholder: `Street / landmark, ${municipality.shortName}` }) })
         ] })
       ] }),

package/dist/ui-components-admin/logs-viewer.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { ActivityLog } from '../types.js';
+
+/**
+ * Activity-log viewer (GE-022). Read-only audit trail with client-side filters
+ * (action dropdown + actor/detail search) over the entries fetched by the page.
+ */
+
+declare function LogsViewer({ entries }: {
+    entries: ActivityLog[];
+}): React.JSX.Element;
+
+export { LogsViewer };