Pre luanch plan phase 1 complete

frontend/src/pages/Settings/Account.tsx

@@ -3,11 +3,12 @@ import PageMeta from '../../components/common/PageMeta';
 import { useToast } from '../../components/ui/toast/ToastContainer';
 import { fetchAPI } from '../../services/api';
 import { Card } from '../../components/ui/card';
+import { usePageLoading } from '../../context/PageLoadingContext';
 
 export default function AccountSettings() {
   const toast = useToast();
   const [settings, setSettings] = useState<any[]>([]);
-  const [loading, setLoading] = useState(true);
+  const { startLoading, stopLoading } = usePageLoading();
 
   useEffect(() => {
     loadSettings();
@@ -15,34 +16,28 @@ export default function AccountSettings() {
 
   const loadSettings = async () => {
     try {
-      setLoading(true);
+      startLoading('Loading account settings...');
       const response = await fetchAPI('/v1/system/settings/account/');
       setSettings(response.results || []);
     } catch (error: any) {
       toast.error(`Failed to load account settings: ${error.message}`);
     } finally {
-      setLoading(false);
+      stopLoading();
     }
   };
 
   return (
-    <div className="p-6">
+    <>
       <PageMeta title="Account Settings" />
       <div className="mb-6">
         <h1 className="text-2xl font-bold text-gray-900 dark:text-white">Account Settings</h1>
         <p className="text-gray-600 dark:text-gray-400 mt-1">Manage your account preferences and profile</p>
       </div>
 
-      {loading ? (
-        <div className="flex items-center justify-center h-64">
-          <div className="text-gray-500">Loading...</div>
-        </div>
-      ) : (
-        <Card className="p-6">
-          <p className="text-gray-600 dark:text-gray-400">Account settings management interface coming soon.</p>
-        </Card>
-      )}
-    </div>
+      <Card className="p-6">
+        <p className="text-gray-600 dark:text-gray-400">Account settings management interface coming soon.</p>
+      </Card>
+    </>
   );
 }