website refactor

apps/website/components/admin/AdminDashboardPage.tsx

@@ -3,7 +3,7 @@
 import { useState, useEffect } from 'react';
 import { apiClient } from '@/lib/apiClient';
 import Card from '@/components/ui/Card';
-import { AdminViewModelService } from '@/lib/services/AdminViewModelService';
+import { AdminViewModelPresenter } from '@/lib/view-models/AdminViewModelPresenter';
 import { DashboardStatsViewModel } from '@/lib/view-models/AdminUserViewModel';
 import { 
   Users, 
@@ -31,7 +31,7 @@ export function AdminDashboardPage() {
       const response = await apiClient.admin.getDashboardStats();
       
       // Map DTO to View Model
-      const viewModel = AdminViewModelService.mapDashboardStats(response);
+      const viewModel = AdminViewModelPresenter.mapDashboardStats(response);
       setStats(viewModel);
     } catch (err) {
       const message = err instanceof Error ? err.message : 'Failed to load stats';
@@ -222,4 +222,4 @@ export function AdminDashboardPage() {
       </Card>
     </div>
   );
-}
+}

apps/website/components/admin/AdminLayout.tsx

@@ -10,6 +10,7 @@ import {
   Activity
 } from 'lucide-react';
 import { useRouter, usePathname } from 'next/navigation';
+import { logoutAction } from '@/app/actions/logoutAction';
 
 interface AdminLayoutProps {
   children: ReactNode;
@@ -62,15 +63,6 @@ export function AdminLayout({ children }: AdminLayoutProps) {
     }
   };
 
-  const handleLogout = async () => {
-    try {
-      await fetch('/api/auth/logout', { method: 'POST' });
-      router.push('/');
-    } catch (error) {
-      console.error('Logout failed:', error);
-    }
-  };
-
   return (
     <div className="flex h-screen bg-deep-graphite overflow-hidden">
       {/* Sidebar */}
@@ -132,13 +124,16 @@ export function AdminLayout({ children }: AdminLayoutProps) {
             {isSidebarOpen && <span className="text-sm">Toggle Sidebar</span>}
           </button>
           
-          <button
-            onClick={handleLogout}
-            className="w-full flex items-center gap-3 px-3 py-2 rounded-lg text-racing-red hover:bg-racing-red/10 transition-colors"
-          >
-            <LogOut className="w-5 h-5" />
-            {isSidebarOpen && <span className="text-sm">Logout</span>}
-          </button>
+          {/* Use form with server action for logout */}
+          <form action={logoutAction}>
+            <button
+              type="submit"
+              className="w-full flex items-center gap-3 px-3 py-2 rounded-lg text-racing-red hover:bg-racing-red/10 transition-colors"
+            >
+              <LogOut className="w-5 h-5" />
+              {isSidebarOpen && <span className="text-sm">Logout</span>}
+            </button>
+          </form>
         </div>
       </aside>
 

apps/website/components/admin/AdminUsersPage.tsx

@@ -4,7 +4,7 @@ import { useState, useEffect } from 'react';
 import { apiClient } from '@/lib/apiClient';
 import Card from '@/components/ui/Card';
 import StatusBadge from '@/components/ui/StatusBadge';
-import { AdminViewModelService } from '@/lib/services/AdminViewModelService';
+import { AdminViewModelPresenter } from '@/lib/view-models/AdminViewModelPresenter';
 import { AdminUserViewModel, UserListViewModel } from '@/lib/view-models/AdminUserViewModel';
 import { 
   Search, 
@@ -47,7 +47,7 @@ export function AdminUsersPage() {
       });
 
       // Map DTO to View Model
-      const viewModel = AdminViewModelService.mapUserList(response);
+      const viewModel = AdminViewModelPresenter.mapUserList(response);
       setUserList(viewModel);
     } catch (err) {
       const message = err instanceof Error ? err.message : 'Failed to load users';
@@ -356,4 +356,4 @@ export function AdminUsersPage() {
       )}
     </div>
   );
-}
+}