feat: admin session revocation, security activity improvements, and CSS fixes

- Add session revocation: revokeOtherSessions server action with client-side
  UA parsing, auto-revoke on password reset/change, manual 'Other Devices' button
- Security Activity table: remove pagination, flex-based scrollable layout with
  sticky header, all columns always visible, sessions_revoked shows 'Signed Out
  Other Devices' with dash placeholders for device info
- Revoke confirmation dialog: simplified copy and UX
- Dashboard: add OCR workspace link on desktop banner, mobile quick action swap
- Mobile overflow: relax AdminShell root/flex/main overflow chain for scroll,
  overflow-x-hidden on html/body, max-width 100vw on mobile body
- Global scrollbar hiding: scrollbar-width none, webkit scrollbar display none
- Fix .scrollbar-none CSS selector: was applying width:0/height:0/display:none
  to elements themselves instead of only their scrollbar pseudo-elements,
  causing OCR, Team, and About pages to render invisible
- Migration script: add session revocation function, update README with
  database migration docs

Author: biranchikulesika

README.md

@@ -52,6 +52,8 @@ lipy/
 ├── scripts/
 │   ├── common/              # Shared utilities
 │   ├── dataset/             # Dataset management
+│   ├── database/            # Database schema and migrations
+│   │   └── migration.sql    # Full Supabase schema (tables, RLS, policies, storage)
 │   ├── model/               # Model management
 │   └── requirements.txt
 │
@@ -171,6 +173,7 @@ Each major component contains its own documentation.
 | `backend/README.md` | Backend API (endpoints, response models, status-based predictions), inference pipeline, Docker deployment, and Azure setup |
 | `frontend/README.md` | Frontend setup and development |
 | `scripts/README.md` | Dataset and model management utilities |
+| `scripts/database/migration.sql` | Supabase database schema — run in SQL Editor to set up all tables (`lipy_contributors`, `lipy_sessions`, `lipy_samples`, `security_events`), RLS policies, indexes, session revocation function, and storage bucket. Safe to re-run (uses `IF NOT EXISTS`) |
 | `notebooks/L.ipynb` | Complete training workflow from dataset download to model export |
 
 ### Key Features

frontend/app/admin/dataset/page.tsx

@@ -186,24 +186,34 @@ export default function DatasetViewerPage() {
 
       if (err1) throw err1;
 
-      // 2. Get distinct contributors count by querying distinct contributor_ids
+      // 2. Get contributors who have at least 1 sample (with count)
       const { data: contribData, error: err2 } = await client
         .from('lipy_samples')
-        .select('contributor_id, contributor_name');
+        .select('contributor_id, contributor_name')
+        .not('storage_path', 'is', null);
 
       if (err2) throw err2;
 
       let uniqueContributors = 0;
-      const uniqueContribsMap = new Map();
+      const uniqueContribsMap = new Map<string, { name: string; count: number }>();
 
       if (contribData) {
         contribData.forEach((d: any) => {
           if (d.contributor_id) {
-            uniqueContribsMap.set(d.contributor_id, d.contributor_name || d.contributor_id);
+            const existing = uniqueContribsMap.get(d.contributor_id);
+            if (existing) {
+              existing.count++;
+            } else {
+              uniqueContribsMap.set(d.contributor_id, { name: d.contributor_name || d.contributor_id, count: 1 });
+            }
           }
         });
-        uniqueContributors = uniqueContribsMap.size;
-        const list = Array.from(uniqueContribsMap.entries()).map(([id, name]) => ({ id, name }));
+        // Only keep contributors with at least 1 image
+        const list = Array.from(uniqueContribsMap.entries())
+          .filter(([, v]) => v.count > 0)
+          .map(([id, v]) => ({ id, name: v.name }))
+          .sort((a, b) => a.name.localeCompare(b.name));
+        uniqueContributors = list.length;
         setContributors(list);
       }
 
@@ -543,10 +553,13 @@ export default function DatasetViewerPage() {
 
       // 2. Attempt to delete from Storage (soft fail if error)
       try {
-        const bucketName = sample.storage_bucket || 'lipi-samples';
-        await supabase.storage
-          .from(bucketName)
-          .remove([sample.storage_path]);
+        const bucketName = sample.storage_bucket || 'lipy-samples';
+        const cleanPath = cleanStoragePath(sample.storage_path);
+        if (cleanPath) {
+          await supabase.storage
+            .from(bucketName)
+            .remove([cleanPath]);
+        }
       } catch (err) {
         console.warn('Failed to delete storage file, but DB record was deleted:', err);
       }
@@ -608,11 +621,14 @@ export default function DatasetViewerPage() {
       const bucketToPaths = new Map<string, string[]>();
       selectedSamples.forEach(s => {
         if (s.storage_path) {
-          const bucketName = s.storage_bucket || 'lipi-samples';
-          if (!bucketToPaths.has(bucketName)) {
-            bucketToPaths.set(bucketName, []);
+          const bucketName = s.storage_bucket || 'lipy-samples';
+          const cleanPath = cleanStoragePath(s.storage_path);
+          if (cleanPath) {
+            if (!bucketToPaths.has(bucketName)) {
+              bucketToPaths.set(bucketName, []);
+            }
+            bucketToPaths.get(bucketName)!.push(cleanPath);
           }
-          bucketToPaths.get(bucketName)!.push(s.storage_path);
         }
       });
 

frontend/app/admin/page.tsx

@@ -9,7 +9,7 @@ import {
   TrendingUp, Shield, Settings, Loader2,
   Mail, CalendarDays, Fingerprint, ChevronRight,
   Database, UserCheck, Users, AlertCircle, Github,
-  CheckCircle2, Hash
+  CheckCircle2, Hash, ScanLine
 } from 'lucide-react';
 import Link from 'next/link';
 import { AdminShell } from '@/components/admin/AdminShell';
@@ -293,7 +293,7 @@ export default function AdminDashboardPage() {
 
   return (
     <AdminShell title="Dashboard" subtitle="Administrator overview">
-      <div ref={containerRef} className="p-3 sm:p-4 md:p-5 space-y-4 w-full max-w-none flex flex-col flex-1 h-full overflow-hidden">
+      <div ref={containerRef} className="p-3 sm:p-4 md:p-5 space-y-4 w-full max-w-none flex flex-col flex-1 sm:h-full overflow-x-hidden overflow-y-visible sm:overflow-hidden">
 
         {/* Welcome Banner */}
         <motion.div
@@ -311,14 +311,22 @@ export default function AdminDashboardPage() {
                 {(userName || userEmail || 'A').charAt(0).toUpperCase()}
               </div>
             )}
-            <h2 className="min-w-0 text-sm sm:text-base leading-tight tracking-normal">
+            <h2 className="min-w-0 text-sm sm:text-base leading-tight tracking-normal flex-1">
               <span className="block text-[10px] sm:text-[11px] uppercase tracking-[0.24em] opacity-70 font-semibold font-display">
                 {greeting}
               </span>
               <span className="block truncate text-base sm:text-[1.35rem] font-display font-bold tracking-[-0.02em]">
                 {userName ? userName.trim().split(' ')[0] : (userEmail ? userEmail.split('@')[0].split(/[\._-]/)[0].replace(/\b\w/g, c => c.toUpperCase()) : 'Admin')}
               </span>
             </h2>
+            <Link
+              href="/"
+              className="hidden sm:flex items-center gap-1.5 px-3 py-2 rounded-xl border border-stone-800 bg-[#0F0F0F] hover:bg-stone-900/60 hover:border-stone-700 text-stone-400 hover:text-stone-200 text-xs font-semibold transition-all shrink-0"
+            >
+              <ScanLine className="w-3.5 h-3.5" />
+              OCR
+              <ArrowUpRight className="w-3 h-3 opacity-50" />
+            </Link>
           </div>
         </motion.div>
 
@@ -437,15 +445,27 @@ export default function AdminDashboardPage() {
                   color="bg-blue-950/30 text-blue-500"
                   delay={0.1}
                 />
-                <QuickAction
-                  title="Lipy GitHub"
-                  description="Open the source repository for the project"
-                  icon={Github}
-                  href="https://github.com/biranchikulesika/lipy"
-                  color="bg-emerald-950/30 text-emerald-500"
-                  delay={0.15}
-                  external
-                />
+                <div className="sm:hidden">
+                  <QuickAction
+                    title="OCR Workspace"
+                    description="Recognize handwritten Odia characters"
+                    icon={ScanLine}
+                    href="/"
+                    color="bg-violet-950/30 text-violet-500"
+                    delay={0.15}
+                  />
+                </div>
+                <div className="hidden sm:block">
+                  <QuickAction
+                    title="Lipy GitHub"
+                    description="Open the source repository for the project"
+                    icon={Github}
+                    href="https://github.com/biranchikulesika/lipy"
+                    color="bg-emerald-950/30 text-emerald-500"
+                    delay={0.15}
+                    external
+                  />
+                </div>
               </div>
             </div>
           </div>

frontend/app/admin/reset-password/page.tsx

@@ -7,6 +7,7 @@ import { createClient } from '@/lib/supabase/client';
 import { Loader2, KeyRound, Eye, EyeOff, ShieldAlert, Check, ArrowLeft, LogIn, CircleCheckBig } from 'lucide-react';
 import { Logo } from '@/components/ui/logo';
 import Link from 'next/link';
+import { revokeOtherSessions } from '@/app/admin/security-actions';
 
 type Phase = 'loading' | 'expired' | 'form' | 'success';
 
@@ -94,6 +95,21 @@ function ResetPasswordContent() {
           setError(msg || 'Failed to update password.');
         }
       } else {
+        // Auto-revoke all old sessions after password reset
+        try {
+          const supabase = createClient();
+          const { data: { session } } = await supabase.auth.getSession();
+          if (session?.access_token) {
+            const base64 = session.access_token.split('.')[1];
+            const padded = base64.replace(/-/g, '+').replace(/_/g, '/');
+            const payload = JSON.parse(atob(padded));
+            const userId = payload.sub as string | undefined;
+            const sessionId = payload.session_id as string | undefined;
+            if (userId && sessionId) {
+              await revokeOtherSessions(userId, sessionId);
+            }
+          }
+        } catch { /* non-critical */ }
         setPhase('success');
       }
     } catch (err: unknown) {
@@ -176,7 +192,7 @@ function ResetPasswordContent() {
           <div className="space-y-2">
             <h1 className="text-xl font-bold tracking-tight">Password Updated</h1>
             <p className="text-sm text-stone-400 leading-relaxed">
-              Your password has been changed successfully. Sign in with your new password to continue.
+              Your password has been changed successfully. All other sessions have been logged out for security. Sign in with your new password to continue.
             </p>
           </div>
           <Link

frontend/app/admin/security-actions.ts

@@ -15,7 +15,8 @@ export type SecurityEventType =
   | 'passkey_register'
   | 'provider_link'
   | 'provider_unlink'
-  | 'active_session';
+  | 'active_session'
+  | 'sessions_revoked';
 
 function parseUserAgent(ua: string | null) {
   if (!ua) return { browser: 'Unknown', os: 'Unknown' };
@@ -174,3 +175,72 @@ export async function logSecurityEventDirect(
     // Gracefully ignore
   }
 }
+
+export async function revokeOtherSessions(
+  userId: string,
+  currentSessionId: string,
+  clientInfo?: { browser: string; os: string; ip?: string }
+): Promise<{ success: boolean; revokedCount: number; error?: string }> {
+  try {
+    const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL;
+    const supabaseServiceKey = process.env.SUPABASE_SERVICE_ROLE_KEY;
+    if (!supabaseUrl || !supabaseServiceKey) {
+      return { success: false, revokedCount: 0, error: 'Missing Supabase configuration' };
+    }
+
+    const { createClient } = await import('@supabase/supabase-js');
+    const supabase = createClient(supabaseUrl, supabaseServiceKey);
+
+    const { data, error } = await supabase.rpc('revoke_other_sessions', {
+      p_user_id: userId,
+      p_current_session_id: currentSessionId,
+    });
+
+    if (error) {
+      console.error('revokeOtherSessions RPC error:', error);
+      return { success: false, revokedCount: 0, error: error.message };
+    }
+
+    const revokedCount = typeof data === 'number' ? data : 0;
+
+    // Log the event using client-provided browser/OS (more reliable than server-side UA parsing)
+    try {
+      let browser = 'Unknown';
+      let os = 'Unknown';
+
+      if (clientInfo?.browser) {
+        // Client sends raw navigator.userAgent — parse it
+        const parsed = parseUserAgent(clientInfo.browser);
+        browser = parsed.browser;
+        os = parsed.os;
+      } else if (clientInfo?.os) {
+        // Client sent pre-parsed platform string
+        os = clientInfo.os;
+      }
+
+      const ip = clientInfo?.ip || 'unknown';
+
+      await supabase.from('security_events').insert({
+        user_id: userId,
+        event_type: 'sessions_revoked',
+        status: 'Success',
+        device_info: getDeviceLabel(browser, os),
+        browser,
+        os,
+        ip_address: ip,
+        metadata: { revoked_count: revokedCount, current_session_id: currentSessionId },
+      });
+    } catch {
+      // Non-critical: don't fail the revoke if logging fails
+    }
+
+    return { success: true, revokedCount };
+  } catch (err: unknown) {
+    console.error('revokeOtherSessions error:', err);
+    return {
+      success: false,
+      revokedCount: 0,
+      error: err instanceof Error ? err.message : 'Unknown error',
+    };
+  }
+}

frontend/app/globals.css

@@ -35,6 +35,12 @@ html {
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+}
+
+html::-webkit-scrollbar {
+  display: none;
 }
 
 input, textarea, [contenteditable="true"] {
@@ -46,27 +52,46 @@ input, textarea, [contenteditable="true"] {
 
 body {
   height: 100dvh;
-  overflow: hidden;
+  overflow-y: auto;
   color: var(--foreground);
   background:
     radial-gradient(circle at top, rgba(111, 195, 182, 0.1), transparent 26%),
     radial-gradient(circle at bottom right, rgba(60, 144, 131, 0.1), transparent 24%),
     linear-gradient(180deg, var(--background), var(--background-deep));
   font-family: var(--font-body), sans-serif;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
 }
 
-.scrollbar-none {
-  scrollbar-width: none !important;
-  -ms-overflow-style: none !important;
+body::-webkit-scrollbar {
+  display: none;
 }
 
-.scrollbar-none::-webkit-scrollbar {
+@media (max-width: 639px) {
+  html {
+    overflow: hidden;
+  }
+  body {
+    overflow-x: hidden;
+    overflow-y: auto;
+    max-width: 100vw;
+    width: 100%;
+  }
+}
+
+.scrollbar-none::-webkit-scrollbar,
+*::-webkit-scrollbar {
   display: none !important;
   width: 0 !important;
   height: 0 !important;
   background: transparent !important;
 }
 
+* {
+  scrollbar-width: none !important;
+  -ms-overflow-style: none !important;
+}
+
 ::selection {
   background: rgba(60, 144, 131, 0.22);
 }

frontend/components/admin/AdminShell.tsx

@@ -200,7 +200,7 @@ export function AdminShell({
 
   return (
     <SidebarContext.Provider value={{ collapsed }}>
-      <div className="h-screen bg-[#070707] text-[#F5F5F5] font-sans selection:bg-blue-900 flex flex-col overflow-hidden">
+      <div className="min-h-dvh sm:h-dvh bg-[#070707] text-[#F5F5F5] font-sans selection:bg-blue-900 flex flex-col overflow-x-hidden overflow-y-auto sm:overflow-hidden">
 
         {/* Mobile Top Bar */}
         <header className="sticky top-0 z-50 h-14 border-b border-stone-900 bg-[#0A0A0A]/95 backdrop-blur-xl md:hidden">
@@ -236,7 +236,7 @@ export function AdminShell({
         </header>
 
         {/* ─── Split layout below Header ─── */}
-        <div className="flex flex-1 min-h-0 overflow-hidden">
+        <div className="flex flex-1 sm:min-h-0 overflow-x-hidden overflow-y-visible sm:overflow-hidden">
 
           {/* ─── Desktop Sidebar ─── */}
           <aside
@@ -342,7 +342,7 @@ export function AdminShell({
           </AnimatePresence>
 
           {/* Page Content */}
-          <main className="flex-1 overflow-hidden flex flex-col">
+          <main className="flex-1 overflow-x-hidden overflow-y-visible sm:overflow-hidden flex flex-col">
             {children}
           </main>
         </div>