From 8c8069e9833753f748c1a4389f03d0bf595efde4 Mon Sep 17 00:00:00 2001
From: Maurice <mauriceboe@icloud.com>
Date: Fri, 9 Oct 2026 10:49:44 +0200
Subject: [PATCH] refactor(admin): share the admin shell actions between
 desktop and phone

Saving the demo baseline and the bag tracking and collab feature switches now live in useAdmin. AdminPage and the phone admin screen pass them on instead of carrying their own inline copies.
---
 client/src/mobile/screens/admin/MAdmin.tsx | 38 ++----------
 client/src/pages/AdminPage.tsx             | 32 ++--------
 client/src/pages/admin/useAdmin.test.tsx   | 72 +++++++++++++++++++++-
 client/src/pages/admin/useAdmin.ts         | 33 ++++++++++
 4 files changed, 114 insertions(+), 61 deletions(-)

diff --git a/client/src/mobile/screens/admin/MAdmin.tsx b/client/src/mobile/screens/admin/MAdmin.tsx
index 9d3aa5ff1..453fc5a88 100644
--- a/client/src/mobile/screens/admin/MAdmin.tsx
+++ b/client/src/mobile/screens/admin/MAdmin.tsx
@@ -24,7 +24,6 @@ import {
   Users,
 } from 'lucide-react'
 import type { LucideIcon } from 'lucide-react'
-import { adminApi } from '../../../api/client'
 import { useTranslation } from '../../../i18n'
 import { useCountUp } from '../../../hooks/useCountUp'
 import { useAdmin } from '../../../pages/admin/useAdmin'
@@ -71,12 +70,12 @@ export default function MAdmin() {
   const { t, locale } = useTranslation()
   const admin = useAdmin()
   const {
-    demoMode, mcpEnabled, devMode, managed, toast, navigate,
+    demoMode, mcpEnabled, devMode, managed, navigate,
     activeTab, setActiveTab, stats, serverTimezone,
-    bagTrackingEnabled, setBagTrackingEnabled,
-    collabFeatures, setCollabFeatures,
+    bagTrackingEnabled, collabFeatures,
     setShowCreateUser,
     updateInfo, setShowUpdateModal,
+    saveDemoBaseline, toggleBagTracking, toggleCollabFeature,
   } = admin
   const [sectionsOpen, setSectionsOpen] = useState(false)
 
@@ -101,15 +100,6 @@ export default function MAdmin() {
   ]
   const activeSection = sections.find((s) => s.id === activeTab) ?? sections[0]
 
-  const saveDemoBaseline = async () => {
-    try {
-      await adminApi.saveDemoBaseline()
-      toast.success('Baseline saved! Resets will restore to this state.')
-    } catch (e) {
-      toast.error(e.response?.data?.error || 'Failed to save baseline')
-    }
-  }
-
   return (
     // Flow screen: scrolls with the document (#1809), so no height and no
     // scroll container of its own.
@@ -221,27 +211,9 @@ export default function MAdmin() {
       {activeTab === 'addons' && (
         <MAdminAddonManager
           bagTrackingEnabled={bagTrackingEnabled}
-          onToggleBagTracking={async () => {
-            const next = !bagTrackingEnabled
-            setBagTrackingEnabled(next)
-            try {
-              await adminApi.updateBagTracking(next)
-            } catch {
-              setBagTrackingEnabled(!next)
-            }
-          }}
+          onToggleBagTracking={toggleBagTracking}
           collabFeatures={collabFeatures}
-          onToggleCollabFeature={async (key: string) => {
-            const previous = collabFeatures[key]
-            setCollabFeatures({ ...collabFeatures, [key]: !previous })
-            try {
-              await adminApi.updateCollabFeatures({ [key]: !previous })
-            } catch {
-              // Only this key rolls back — a slower request must not undo a toggle
-              // the admin made in the meantime.
-              setCollabFeatures(prev => ({ ...prev, [key]: previous }))
-            }
-          }}
+          onToggleCollabFeature={toggleCollabFeature}
         />
       )}
       {activeTab === 'plugins' && <MAdminPluginsPanel />}
diff --git a/client/src/pages/AdminPage.tsx b/client/src/pages/AdminPage.tsx
index dd47f7691..f86850413 100644
--- a/client/src/pages/AdminPage.tsx
+++ b/client/src/pages/AdminPage.tsx
@@ -1,6 +1,5 @@
 import SchoolHolidayCatalog from '../components/Admin/SchoolHolidayCatalog'
 import React, { Fragment } from 'react'
-import { adminApi } from '../api/client'
 import DevNotificationsPanel from '../components/Admin/DevNotificationsPanel'
 import DefaultUserSettingsTab from '../components/Admin/DefaultUserSettingsTab'
 import { useTranslation } from '../i18n'
@@ -41,12 +40,12 @@ function AdminPageDesktop(): React.ReactElement {
   // each tab/section renders from a dedicated sub-component.
   const admin = useAdmin()
   const {
-    demoMode, mcpEnabled, devMode, managed, toast,
+    demoMode, mcpEnabled, devMode, managed,
     activeTab, setActiveTab, stats,
-    bagTrackingEnabled, setBagTrackingEnabled,
-    collabFeatures, setCollabFeatures,
+    bagTrackingEnabled, collabFeatures,
     serverTimezone,
     updateInfo, setShowUpdateModal,
+    saveDemoBaseline, toggleBagTracking, toggleCollabFeature,
   } = admin
 
   const gUsers = t('admin.group.users')
@@ -124,14 +123,7 @@ function AdminPageDesktop(): React.ReactElement {
                 <p className="m-0 mt-0.5 text-content-muted" style={fs(12.5, 'body')}>Save current state as the hourly reset point. All admin trips and settings will be preserved.</p>
               </div>
               <button type="button"
-                onClick={async () => {
-                  try {
-                    await adminApi.saveDemoBaseline()
-                    toast.success('Baseline saved! Resets will restore to this state.')
-                  } catch (e) {
-                    toast.error(e.response?.data?.error || 'Failed to save baseline')
-                  }
-                }}
+                onClick={saveDemoBaseline}
                 className={`${SETTINGS_BUTTON_PRIMARY} flex-none`}
                 style={fs(13, 'body')}
               >
@@ -164,21 +156,7 @@ function AdminPageDesktop(): React.ReactElement {
 
           {activeTab === 'addons' && (
             <div className="space-y-6">
-              <AddonManager bagTrackingEnabled={bagTrackingEnabled} onToggleBagTracking={async () => {
-                const next = !bagTrackingEnabled
-                setBagTrackingEnabled(next)
-                try { await adminApi.updateBagTracking(next) } catch { setBagTrackingEnabled(!next) }
-              }} collabFeatures={collabFeatures} onToggleCollabFeature={async (key: string) => {
-                const previous = collabFeatures[key]
-                setCollabFeatures({ ...collabFeatures, [key]: !previous })
-                try {
-                  await adminApi.updateCollabFeatures({ [key]: !previous })
-                } catch {
-                  // Only this key rolls back — a slower request must not undo a toggle
-                  // the admin made in the meantime.
-                  setCollabFeatures(prev => ({ ...prev, [key]: previous }))
-                }
-              }} />
+              <AddonManager bagTrackingEnabled={bagTrackingEnabled} onToggleBagTracking={toggleBagTracking} collabFeatures={collabFeatures} onToggleCollabFeature={toggleCollabFeature} />
             </div>
           )}
 
diff --git a/client/src/pages/admin/useAdmin.test.tsx b/client/src/pages/admin/useAdmin.test.tsx
index 43c29b24d..747bc8d3c 100644
--- a/client/src/pages/admin/useAdmin.test.tsx
+++ b/client/src/pages/admin/useAdmin.test.tsx
@@ -1,4 +1,4 @@
-// FE-ADMHOOK-001 to FE-ADMHOOK-053
+// FE-ADMHOOK-001 to FE-ADMHOOK-058
 import { http, HttpResponse } from 'msw';
 import React from 'react';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
@@ -8,6 +8,7 @@ import { server } from '../../../tests/helpers/msw/server';
 import { act, renderHook, waitFor } from '../../../tests/helpers/render';
 import { resetAllStores, seedStore } from '../../../tests/helpers/store';
 import { TranslationProvider } from '../../i18n/TranslationContext';
+import { adminApi } from '../../api/client';
 import { useAuthStore } from '../../store/authStore';
 
 import { useAdmin } from './useAdmin';
@@ -863,4 +864,73 @@ describe('useAdmin', () => {
     expect(result.current.hour12).toBe(false);
     expect(result.current.currentUser?.username).toBe('admin');
   });
+  it('FE-ADMHOOK-054: saving the demo baseline toasts the outcome, with the server message on failure', async () => {
+    const save = vi.spyOn(adminApi, 'saveDemoBaseline').mockResolvedValue({});
+    const { result } = await mountAdmin();
+
+    await act(() => result.current.saveDemoBaseline());
+    expect(save).toHaveBeenCalledTimes(1);
+    expect(toastCalls).toContainEqual({ type: 'success', message: 'Baseline saved! Resets will restore to this state.' });
+
+    save.mockRejectedValueOnce({ response: { data: { error: 'Not a demo' } } });
+    await act(() => result.current.saveDemoBaseline());
+    expect(toastCalls).toContainEqual({ type: 'error', message: 'Not a demo' });
+
+    save.mockRejectedValueOnce(new Error('offline'));
+    await act(() => result.current.saveDemoBaseline());
+    expect(toastCalls).toContainEqual({ type: 'error', message: 'Failed to save baseline' });
+  });
+
+  it('FE-ADMHOOK-055: bag tracking flips at once and saves the new value', async () => {
+    const update = vi.spyOn(adminApi, 'updateBagTracking').mockResolvedValue({});
+    const { result } = await mountAdmin();
+    const before = result.current.bagTrackingEnabled;
+
+    await act(() => result.current.toggleBagTracking());
+    expect(update).toHaveBeenCalledWith(!before);
+    expect(result.current.bagTrackingEnabled).toBe(!before);
+  });
+
+  it('FE-ADMHOOK-056: a failed bag tracking save flips back without a toast', async () => {
+    vi.spyOn(adminApi, 'updateBagTracking').mockRejectedValue(new Error('x'));
+    const { result } = await mountAdmin();
+    const before = result.current.bagTrackingEnabled;
+    const toastsBefore = toastCalls.length;
+
+    await act(() => result.current.toggleBagTracking());
+    expect(result.current.bagTrackingEnabled).toBe(before);
+    expect(toastCalls).toHaveLength(toastsBefore);
+  });
+
+  it('FE-ADMHOOK-057: a collab feature toggle saves only that key', async () => {
+    vi.spyOn(adminApi, 'getCollabFeatures').mockResolvedValue({ chat: true, notes: true, polls: true, whatsnext: true });
+    const update = vi.spyOn(adminApi, 'updateCollabFeatures').mockResolvedValue({});
+    const { result } = await mountAdmin();
+    await waitFor(() => expect(result.current.collabFeatures.chat).toBe(true));
+
+    await act(() => result.current.toggleCollabFeature('chat'));
+    expect(update).toHaveBeenCalledWith({ chat: false });
+    expect(result.current.collabFeatures).toEqual({ chat: false, notes: true, polls: true, whatsnext: true });
+  });
+
+  it('FE-ADMHOOK-058: a failed collab toggle rolls back its own key and keeps a later one', async () => {
+    vi.spyOn(adminApi, 'getCollabFeatures').mockResolvedValue({ chat: true, notes: true, polls: true, whatsnext: true });
+    let fail!: (e: unknown) => void;
+    vi.spyOn(adminApi, 'updateCollabFeatures')
+      .mockReturnValueOnce(new Promise((_, reject) => (fail = reject)))
+      .mockResolvedValueOnce({});
+    const { result } = await mountAdmin();
+    await waitFor(() => expect(result.current.collabFeatures.chat).toBe(true));
+
+    let pending!: Promise<void>;
+    act(() => {
+      pending = result.current.toggleCollabFeature('chat');
+    });
+    await act(() => result.current.toggleCollabFeature('notes'));
+    await act(async () => {
+      fail(new Error('x'));
+      await pending;
+    });
+    expect(result.current.collabFeatures).toEqual({ chat: true, notes: false, polls: true, whatsnext: true });
+  });
 });
diff --git a/client/src/pages/admin/useAdmin.ts b/client/src/pages/admin/useAdmin.ts
index 34d793ff1..4f543cc0b 100644
--- a/client/src/pages/admin/useAdmin.ts
+++ b/client/src/pages/admin/useAdmin.ts
@@ -509,6 +509,38 @@ export function useAdmin() {
     }
   }
 
+  // The admin shell's own actions, the same on desktop and phone.
+  const saveDemoBaseline = async () => {
+    try {
+      await adminApi.saveDemoBaseline()
+      toast.success('Baseline saved! Resets will restore to this state.')
+    } catch (e: unknown) {
+      toast.error((e as { response?: { data?: { error?: string } } }).response?.data?.error || 'Failed to save baseline')
+    }
+  }
+
+  const toggleBagTracking = async () => {
+    const next = !bagTrackingEnabled
+    setBagTrackingEnabled(next)
+    try {
+      await adminApi.updateBagTracking(next)
+    } catch {
+      setBagTrackingEnabled(!next)
+    }
+  }
+
+  const toggleCollabFeature = async (key: string) => {
+    const previous = (collabFeatures as Record<string, boolean>)[key]
+    setCollabFeatures({ ...collabFeatures, [key]: !previous })
+    try {
+      await adminApi.updateCollabFeatures({ [key]: !previous })
+    } catch {
+      // Only this key rolls back: a slower request must not undo a toggle the
+      // admin made in the meantime.
+      setCollabFeatures(prev => ({ ...prev, [key]: previous }))
+    }
+  }
+
   return {
     // store-derived
     demoMode, serverTimezone, hour12, mcpEnabled, devMode, managed, currentUser,
@@ -550,5 +582,6 @@ export function useAdmin() {
     toggleKey, handleSaveApiKeys, handleValidateKeys, handleValidateKey,
     handleCreateUser, handleCreateInvite, handleDeleteInvite, copyInviteLink,
     handleEditUser, handleSaveUser, handleDeleteUser,
+    saveDemoBaseline, toggleBagTracking, toggleCollabFeature,
   }
 }