refactor: consolidate security devices UI and remove pending auth requests from settings

- Merge device management and authorized devices sections into a single card in SecurityDevicesPage
- Remove PendingAuthRequestsPanel from SettingsPage and its related props
- Clean up unused auth request prop drilling in AppMainRoutes

Co-Authored-By: Claude <noreply@anthropic.com>

webapp/src/components/AppMainRoutes.tsx

@@ -275,11 +275,6 @@ export default function AppMainRoutes(props: AppMainRoutesProps) {
                 onCreateAccountPasskey={props.onCreateAccountPasskey}
                 onEnableAccountPasskeyDirectUnlock={props.onEnableAccountPasskeyDirectUnlock}
                 onDeleteAccountPasskey={props.onDeleteAccountPasskey}
-                pendingAuthRequests={props.pendingAuthRequests}
-                pendingAuthRequestsLoading={props.pendingAuthRequestsLoading}
-                onRefreshPendingAuthRequests={props.onRefreshPendingAuthRequests}
-                onApproveAuthRequest={props.onApproveAuthRequest}
-                onDenyAuthRequest={props.onDenyAuthRequest}
                 onLockTimeoutChange={props.onLockTimeoutChange}
                 onSessionTimeoutActionChange={props.onSessionTimeoutActionChange}
                 onNotify={props.onNotify}

webapp/src/components/SecurityDevicesPage.tsx

@@ -91,7 +91,7 @@ export default function SecurityDevicesPage(props: SecurityDevicesPageProps) {
         <section className="card">
           <div className="section-head">
             <div>
-            <h3 className="flush-title">{t('txt_device_management')}</h3>
+              <h3 className="flush-title">{t('txt_authorized_devices')}</h3>
               <div className="muted-inline section-note">
                 {t('txt_manage_device_sessions_and_30_day_totp_trusted_sessions')}
               </div>
@@ -111,10 +111,6 @@ export default function SecurityDevicesPage(props: SecurityDevicesPageProps) {
               </button>
             </div>
           </div>
-        </section>
-
-        <section className="card">
-        <h3 className="section-title-flush">{t('txt_authorized_devices')}</h3>
           {!!props.error && (
             <div className="local-error">
               <span>{props.error}</span>

webapp/src/components/SettingsPage.tsx

@@ -2,10 +2,9 @@ import { useEffect, useMemo, useState } from 'preact/hooks';
 import { Clipboard, KeyRound, RefreshCw, ShieldCheck, ShieldOff, Trash2 } from 'lucide-preact';
 import { copyTextToClipboard } from '@/lib/clipboard';
 import qrcode from 'qrcode-generator';
-import type { AccountPasskeyCredential, AuthRequest, Profile } from '@/lib/types';
+import type { AccountPasskeyCredential, Profile } from '@/lib/types';
 import { AVAILABLE_LOCALES, getLocale, setLocale, t, type Locale } from '@/lib/i18n';
 import ConfirmDialog from '@/components/ConfirmDialog';
-import PendingAuthRequestsPanel from '@/components/PendingAuthRequestsPanel';
 
 interface SettingsPageProps {
   profile: Profile;
@@ -23,11 +22,6 @@ interface SettingsPageProps {
   onCreateAccountPasskey: (name: string, masterPassword: string, directUnlock: boolean) => Promise<AccountPasskeyCredential | null>;
   onEnableAccountPasskeyDirectUnlock: (id: string, masterPassword: string) => Promise<void>;
   onDeleteAccountPasskey: (id: string, masterPassword: string) => Promise<void>;
-  pendingAuthRequests: AuthRequest[];
-  pendingAuthRequestsLoading: boolean;
-  onRefreshPendingAuthRequests: () => Promise<void>;
-  onApproveAuthRequest: (request: AuthRequest) => Promise<void>;
-  onDenyAuthRequest: (request: AuthRequest) => Promise<void>;
   onLockTimeoutChange: (minutes: 0 | 1 | 5 | 15 | 30) => void;
   onSessionTimeoutActionChange: (action: 'lock' | 'logout') => void;
   onNotify?: (type: 'success' | 'error' | 'warning', text: string) => void;
@@ -515,15 +509,6 @@ export default function SettingsPage(props: SettingsPageProps) {
           )}
         </div>
       </section>
-
-      <PendingAuthRequestsPanel
-        pendingAuthRequests={props.pendingAuthRequests}
-        pendingAuthRequestsLoading={props.pendingAuthRequestsLoading}
-        onRefreshPendingAuthRequests={props.onRefreshPendingAuthRequests}
-        onApproveAuthRequest={props.onApproveAuthRequest}
-        onDenyAuthRequest={props.onDenyAuthRequest}
-      />
-
       <section className="settings-module sensitive-actions-module">
         <div className="sensitive-actions-grid">
           <div className="sensitive-action">