feat: Implement automatic MFA verification modal

src/pages/AdminModeration.tsx

@@ -1,6 +1,6 @@
 import { useRef, useCallback } from 'react';
 import { useAdminGuard } from '@/hooks/useAdminGuard';
-import { MFARequiredAlert } from '@/components/auth/MFARequiredAlert';
+import { MFAGuard } from '@/components/auth/MFAGuard';
 import { AdminLayout } from '@/components/layout/AdminLayout';
 import { ModerationQueue, ModerationQueueRef } from '@/components/moderation/ModerationQueue';
 import { QueueSkeleton } from '@/components/moderation/QueueSkeleton';
@@ -56,14 +56,6 @@ export default function AdminModeration() {
   if (!isAuthorized) {
     return null;
   }
-  
-  if (needsMFA) {
-    return (
-      <AdminLayout>
-        <MFARequiredAlert />
-      </AdminLayout>
-    );
-  }
 
   return (
     <AdminLayout
@@ -72,16 +64,18 @@ export default function AdminModeration() {
       pollInterval={pollInterval}
       lastUpdated={lastUpdated ?? undefined}
     >
-      <div className="space-y-6">
-        <div>
-          <h1 className="text-2xl font-bold tracking-tight">Moderation Queue</h1>
-          <p className="text-muted-foreground mt-1">
-            Review and manage pending content submissions
-          </p>
-        </div>
+      <MFAGuard>
+        <div className="space-y-6">
+          <div>
+            <h1 className="text-2xl font-bold tracking-tight">Moderation Queue</h1>
+            <p className="text-muted-foreground mt-1">
+              Review and manage pending content submissions
+            </p>
+          </div>
 
-        <ModerationQueue ref={moderationQueueRef} />
-      </div>
+          <ModerationQueue ref={moderationQueueRef} />
+        </div>
+      </MFAGuard>
     </AdminLayout>
   );
 }