refactor(admin): unify webui fetch/copy/format helpers; fix audit tab load and delete-group count

- apiFetch + shared needLogin (any 401 shows the login card) replaces six
  duplicated fetch/401/error-handling blocks in the admin composables
- useCopy composable: clipboard + execCommand fallback with timed reset,
  used by MembersPanel and WebhookPanel
- utils/format.ts (fmtTime/splitList/parseMatch) removes inline duplicates
  across SendLogs, AuditLog, RouteEditor and GroupEditor
- fix: load the audit log when the audit tab becomes active (client-side
  navigation never remounted the page, leaving the list empty on first visit)
- fix: fetch the real route count for a group before confirming deletion
  instead of reusing the currently open group's route list

app/composables/useApi.ts

@@ -0,0 +1,30 @@
+/**
+ * Shared "session expired" flag: any 401 from the admin API flips it and the
+ * console swaps to the login card. One source of truth for every composable.
+ */
+export function useAuthState() {
+  const needLogin = useState<boolean>("wh-need-login", () => false);
+  return { needLogin };
+}
+
+/**
+ * JSON fetch for same-origin admin API calls: sends credentials, treats 401
+ * as "not logged in" (flips the shared flag and throws), and surfaces the
+ * server's `{ error }` message on failure.
+ */
+export async function apiFetch<T>(path: string, init?: RequestInit): Promise<T> {
+  const res = await fetch(path, {
+    credentials: "same-origin",
+    ...init,
+    headers: { accept: "application/json", ...(init?.headers ?? {}) },
+  });
+  if (res.status === 401) {
+    useAuthState().needLogin.value = true;
+    throw new Error("unauthorized");
+  }
+  if (!res.ok) {
+    const data = (await res.json().catch(() => ({}))) as { error?: string };
+    throw new Error(data.error ?? `HTTP ${res.status}`);
+  }
+  return (await res.json()) as T;
+}

app/composables/useAudit.ts

@@ -1,9 +1,9 @@
 import type { AuditEntry } from "~/types";
 
 export function useAuditApi() {
+  const { needLogin } = useAuthState();
   const entries = ref<AuditEntry[]>([]);
   const loading = ref(false);
-  const needLogin = ref(false);
   const error = ref("");
 
   async function load(limit = 50, groupId?: string): Promise<void> {
@@ -13,19 +13,10 @@ export function useAuditApi() {
     try {
       let url = `/admin/api/audit?limit=${limit}`;
       if (groupId) url += `&groupId=${encodeURIComponent(groupId)}`;
-      const res = await fetch(url, {
-        headers: { accept: "application/json" },
-        credentials: "same-origin",
-      });
-      if (res.status === 401) {
-        needLogin.value = true;
-        return;
-      }
-      if (!res.ok) throw new Error(`HTTP ${res.status}`);
-      const data = (await res.json()) as { audit?: AuditEntry[] };
+      const data = await apiFetch<{ audit?: AuditEntry[] }>(url);
       entries.value = data.audit ?? [];
     } catch (err) {
-      error.value = err instanceof Error ? err.message : String(err);
+      if (!needLogin.value) error.value = err instanceof Error ? err.message : String(err);
     } finally {
       loading.value = false;
     }

app/composables/useCopy.ts

@@ -0,0 +1,33 @@
+/**
+ * Clipboard helper with execCommand fallback and a "just copied" flag keyed
+ * by whatever identifies the copied value (a token, "url", "secret", ...).
+ * The flag resets after `duration` ms.
+ */
+export function useCopy(duration = 1500) {
+  const copied = ref("");
+
+  async function copy(text: string, key: string): Promise<void> {
+    try {
+      await navigator.clipboard.writeText(text);
+    } catch {
+      try {
+        const ta = document.createElement("textarea");
+        ta.value = text;
+        ta.style.position = "fixed";
+        ta.style.opacity = "0";
+        document.body.appendChild(ta);
+        ta.select();
+        document.execCommand("copy");
+        document.body.removeChild(ta);
+      } catch {
+        return;
+      }
+    }
+    copied.value = key;
+    window.setTimeout(() => {
+      if (copied.value === key) copied.value = "";
+    }, duration);
+  }
+
+  return { copied, copy };
+}

app/composables/useGroupRoutes.ts

@@ -1,9 +1,9 @@
 import type { Route } from "~/types";
 
 export function useGroupRoutesApi() {
+  const { needLogin } = useAuthState();
   const routes = ref<Route[]>([]);
   const loading = ref(false);
-  const needLogin = ref(false);
   const error = ref("");
 
   async function load(groupId: string): Promise<void> {
@@ -11,39 +11,22 @@ export function useGroupRoutesApi() {
     error.value = "";
     needLogin.value = false;
     try {
-      const res = await fetch(`/admin/api/groups/${encodeURIComponent(groupId)}/routes`, {
-        headers: { accept: "application/json" },
-        credentials: "same-origin",
-      });
-      if (res.status === 401) {
-        needLogin.value = true;
-        return;
-      }
-      if (!res.ok) throw new Error(`HTTP ${res.status}`);
-      const data = (await res.json()) as { routes?: Route[] };
+      const data = await apiFetch<{ routes?: Route[] }>(
+        `/admin/api/groups/${encodeURIComponent(groupId)}/routes`,
+      );
       routes.value = data.routes ?? [];
     } catch (err) {
-      error.value = err instanceof Error ? err.message : String(err);
+      if (!needLogin.value) error.value = err instanceof Error ? err.message : String(err);
     } finally {
       loading.value = false;
     }
   }
 
   async function save(groupId: string, next: Route[]): Promise<void> {
-    const res = await fetch(`/admin/api/groups/${encodeURIComponent(groupId)}/routes`, {
+    await apiFetch(`/admin/api/groups/${encodeURIComponent(groupId)}/routes`, {
       method: "PUT",
-      headers: { "content-type": "application/json" },
-      credentials: "same-origin",
       body: JSON.stringify({ routes: next }),
     });
-    if (res.status === 401) {
-      needLogin.value = true;
-      throw new Error("unauthorized");
-    }
-    if (!res.ok) {
-      const data = (await res.json().catch(() => ({}))) as { error?: string };
-      throw new Error(data.error ?? `HTTP ${res.status}`);
-    }
     routes.value = next;
   }
 

app/composables/useGroups.ts

@@ -1,12 +1,12 @@
 import type { Group, GroupRole } from "~/types";
 
 export function useGroupsApi() {
+  const { needLogin } = useAuthState();
   const groups = ref<Group[]>([]);
   const isSuper = ref(false);
   /** groupId → role of the signed-in user (absent for super admins). */
   const roles = ref<Record<string, GroupRole>>({});
   const loading = ref(false);
-  const needLogin = ref(false);
   const error = ref("");
 
   function roleOf(groupId: string): GroupRole | undefined {
@@ -28,64 +28,35 @@ export function useGroupsApi() {
     error.value = "";
     needLogin.value = false;
     try {
-      const res = await fetch("/admin/api/groups", {
-        headers: { accept: "application/json" },
-        credentials: "same-origin",
-      });
-      if (res.status === 401) {
-        needLogin.value = true;
-        return;
-      }
-      if (!res.ok) throw new Error(`HTTP ${res.status}`);
-      const data = (await res.json()) as {
+      const data = await apiFetch<{
         groups?: Group[];
         isSuper?: boolean;
         roles?: Record<string, GroupRole>;
-      };
+      }>("/admin/api/groups");
       groups.value = data.groups ?? [];
       isSuper.value = data.isSuper ?? false;
       roles.value = data.roles ?? {};
     } catch (err) {
-      error.value = err instanceof Error ? err.message : String(err);
+      if (!needLogin.value) error.value = err instanceof Error ? err.message : String(err);
     } finally {
       loading.value = false;
     }
   }
 
   async function save(next: Group[]): Promise<void> {
-    const res = await fetch("/admin/api/groups", {
+    await apiFetch("/admin/api/groups", {
       method: "PUT",
-      headers: { "content-type": "application/json" },
-      credentials: "same-origin",
       body: JSON.stringify({ groups: next }),
     });
-    if (res.status === 401) {
-      needLogin.value = true;
-      throw new Error("unauthorized");
-    }
-    if (!res.ok) {
-      const data = (await res.json().catch(() => ({}))) as { error?: string };
-      throw new Error(data.error ?? `HTTP ${res.status}`);
-    }
     groups.value = next;
   }
 
   /** Rename a group; routes, webhook secret and invites follow automatically. */
   async function rename(oldId: string, newId: string): Promise<void> {
-    const res = await fetch(`/admin/api/groups/${encodeURIComponent(oldId)}/rename`, {
+    await apiFetch(`/admin/api/groups/${encodeURIComponent(oldId)}/rename`, {
       method: "PUT",
-      headers: { "content-type": "application/json" },
-      credentials: "same-origin",
       body: JSON.stringify({ newId }),
     });
-    if (res.status === 401) {
-      needLogin.value = true;
-      throw new Error("unauthorized");
-    }
-    if (!res.ok) {
-      const data = (await res.json().catch(() => ({}))) as { error?: string };
-      throw new Error(data.error ?? `HTTP ${res.status}`);
-    }
   }
 
   return {

app/composables/useInvites.ts

@@ -8,17 +8,10 @@ export function useInvitesApi() {
     loading.value = true;
     error.value = "";
     try {
-      const res = await fetch(`/admin/api/groups/${encodeURIComponent(groupId)}/invites`, {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        credentials: "same-origin",
-        body: JSON.stringify({ role }),
-      });
-      if (!res.ok) {
-        const data = (await res.json().catch(() => ({}))) as { error?: string };
-        throw new Error(data.error ?? `HTTP ${res.status}`);
-      }
-      const data = (await res.json()) as { url?: string };
+      const data = await apiFetch<{ url?: string }>(
+        `/admin/api/groups/${encodeURIComponent(groupId)}/invites`,
+        { method: "POST", body: JSON.stringify({ role }) },
+      );
       return data.url ?? "";
     } catch (err) {
       error.value = err instanceof Error ? err.message : String(err);
@@ -32,12 +25,9 @@ export function useInvitesApi() {
     loading.value = true;
     error.value = "";
     try {
-      const res = await fetch(`/admin/api/groups/${encodeURIComponent(groupId)}/invites`, {
-        headers: { accept: "application/json" },
-        credentials: "same-origin",
-      });
-      if (!res.ok) throw new Error(`HTTP ${res.status}`);
-      const data = (await res.json()) as { invites?: GroupInvite[] };
+      const data = await apiFetch<{ invites?: GroupInvite[] }>(
+        `/admin/api/groups/${encodeURIComponent(groupId)}/invites`,
+      );
       return data.invites ?? [];
     } catch (err) {
       error.value = err instanceof Error ? err.message : String(err);
@@ -51,14 +41,7 @@ export function useInvitesApi() {
     loading.value = true;
     error.value = "";
     try {
-      const res = await fetch(`/admin/api/invites/${encodeURIComponent(token)}`, {
-        method: "DELETE",
-        credentials: "same-origin",
-      });
-      if (!res.ok) {
-        const data = (await res.json().catch(() => ({}))) as { error?: string };
-        throw new Error(data.error ?? `HTTP ${res.status}`);
-      }
+      await apiFetch(`/admin/api/invites/${encodeURIComponent(token)}`, { method: "DELETE" });
     } catch (err) {
       error.value = err instanceof Error ? err.message : String(err);
       throw err;

app/composables/useLogs.ts

@@ -1,9 +1,9 @@
 import type { SendRecord } from "~/types";
 
 export function useSendLogs() {
+  const { needLogin } = useAuthState();
   const logs = ref<SendRecord[]>([]);
   const loading = ref(false);
-  const needLogin = ref(false);
   const error = ref("");
 
   async function load(limit = 50, groupId?: string): Promise<void> {
@@ -13,35 +13,17 @@ export function useSendLogs() {
     try {
       let url = `/admin/api/logs?limit=${limit}`;
       if (groupId) url += `&groupId=${encodeURIComponent(groupId)}`;
-      const res = await fetch(url, {
-        headers: { accept: "application/json" },
-        credentials: "same-origin",
-      });
-      if (res.status === 401) {
-        needLogin.value = true;
-        return;
-      }
-      if (!res.ok) throw new Error(`HTTP ${res.status}`);
-      const data = (await res.json()) as { logs?: SendRecord[] };
+      const data = await apiFetch<{ logs?: SendRecord[] }>(url);
       logs.value = data.logs ?? [];
     } catch (err) {
-      error.value = err instanceof Error ? err.message : String(err);
+      if (!needLogin.value) error.value = err instanceof Error ? err.message : String(err);
     } finally {
       loading.value = false;
     }
   }
 
   async function loadById(id: number): Promise<SendRecord | null> {
-    const res = await fetch(`/admin/api/logs/${id}`, {
-      headers: { accept: "application/json" },
-      credentials: "same-origin",
-    });
-    if (res.status === 401) {
-      needLogin.value = true;
-      return null;
-    }
-    if (!res.ok) throw new Error(`HTTP ${res.status}`);
-    const data = (await res.json()) as { log?: SendRecord };
+    const data = await apiFetch<{ log?: SendRecord }>(`/admin/api/logs/${id}`);
     return data.log ?? null;
   }
 

app/composables/useWebhook.ts

@@ -12,16 +12,7 @@ export function useWebhookApi() {
     loading.value = true;
     error.value = "";
     try {
-      const res = await fetch(path, {
-        headers: { accept: "application/json" },
-        credentials: "same-origin",
-        ...init,
-      });
-      if (!res.ok) {
-        const data = (await res.json().catch(() => ({}))) as { error?: string };
-        throw new Error(data.error ?? `HTTP ${res.status}`);
-      }
-      return (await res.json()) as T;
+      return await apiFetch<T>(path, init);
     } catch (err) {
       error.value = err instanceof Error ? err.message : String(err);
       throw err;