feat: add per-state action dropdowns and table view to ZeroTier All Approvals

src/components/auth/SessionTimeoutModal.tsx

@@ -0,0 +1,50 @@
+import { useEffect, useState, useCallback } from 'react';
+import { useNavigate } from 'react-router-dom';
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogDescription,
+} from '@/components/ui/dialog';
+import { Button } from '@/components/ui/button';
+import { tokenManager } from '@/lib/api';
+
+export default function SessionTimeoutModal() {
+  const [open, setOpen] = useState(false);
+  const navigate = useNavigate();
+
+  const handleOpenChange = useCallback((isOpen: boolean) => {
+    if (!isOpen) {
+      tokenManager.clearToken();
+      navigate('/login', { replace: true });
+    }
+  }, [navigate]);
+
+  useEffect(() => {
+    const onSessionExpired = () => setOpen(true);
+    window.addEventListener('session:expired', onSessionExpired);
+    return () => window.removeEventListener('session:expired', onSessionExpired);
+  }, []);
+
+  return (
+    <Dialog open={open} onOpenChange={handleOpenChange}>
+      <DialogContent
+        onPointerDownOutside={(e) => e.preventDefault()}
+        onEscapeKeyDown={(e) => e.preventDefault()}
+      >
+        <DialogHeader>
+          <DialogTitle>Session Expired</DialogTitle>
+          <DialogDescription>
+            Your session has timed out. Please sign in again to continue.
+          </DialogDescription>
+        </DialogHeader>
+        <div className="flex justify-end">
+          <Button onClick={() => { tokenManager.clearToken(); navigate('/login', { replace: true }); }}>
+            Sign In
+          </Button>
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}