website refactor

This commit is contained in:
2026-01-14 02:02:24 +01:00
parent 8d7c709e0c
commit 4522d41aef
291 changed files with 12763 additions and 9309 deletions

View File

@@ -1,58 +0,0 @@
'use client';
import { useState, useEffect } from 'react';
import { AdminDashboardTemplate } from '@/templates/AdminDashboardTemplate';
import { AdminDashboardViewData } from '@/lib/view-data/AdminDashboardViewData';
import { AdminDashboardPageQuery } from '@/lib/page-queries/AdminDashboardPageQuery';
export function AdminDashboardClient() {
const [viewData, setViewData] = useState<AdminDashboardViewData | null>(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const loadStats = async () => {
try {
setLoading(true);
const query = new AdminDashboardPageQuery();
const result = await query.execute();
if (result.status === 'ok') {
// Page Query already returns View Data via builder
setViewData(result.dto);
} else if (result.status === 'notFound') {
// Handle not found - could show a message or redirect
console.error('Access denied - You must be logged in as an Owner or Admin');
} else {
// Handle error - could show a toast or error message
console.error('Failed to load dashboard stats');
}
} catch (err) {
const message = err instanceof Error ? err.message : 'Failed to load stats';
console.error(message);
} finally {
setLoading(false);
}
};
useEffect(() => {
loadStats();
}, []);
if (!viewData) {
return (
<div className="flex flex-col items-center justify-center py-20 space-y-3">
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-primary-blue"></div>
<div className="text-gray-400">Loading dashboard...</div>
</div>
);
}
return (
<AdminDashboardTemplate
viewData={viewData}
onRefresh={loadStats}
isLoading={loading}
/>
);
}

View File

@@ -1,115 +0,0 @@
'use client';
import { useState, useEffect, useCallback } from 'react';
import { AdminUsersTemplate } from '@/templates/AdminUsersTemplate';
import { AdminUsersViewData } from '@/templates/AdminUsersViewData';
import { AdminUsersPresenter } from '@/lib/presenters/AdminUsersPresenter';
import { AdminUsersPageQuery } from '@/lib/page-queries/AdminUsersPageQuery';
import { updateUserStatus, deleteUser } from './actions';
export function AdminUsersClient() {
const [viewData, setViewData] = useState<AdminUsersViewData | null>(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const [search, setSearch] = useState('');
const [roleFilter, setRoleFilter] = useState('');
const [statusFilter, setStatusFilter] = useState('');
const [deletingUser, setDeletingUser] = useState<string | null>(null);
const loadUsers = useCallback(async () => {
try {
setLoading(true);
setError(null);
const query = new AdminUsersPageQuery();
const result = await query.execute({
search: search || undefined,
role: roleFilter || undefined,
status: statusFilter || undefined,
page: 1,
limit: 50,
});
if (result.status === 'ok') {
const data = AdminUsersPresenter.present(result.dto);
setViewData(data);
} else if (result.status === 'notFound') {
setError('Access denied - You must be logged in as an Owner or Admin');
} else {
setError('Failed to load users');
}
} catch (err) {
const message = err instanceof Error ? err.message : 'Failed to load users';
setError(message);
} finally {
setLoading(false);
}
}, [search, roleFilter, statusFilter]);
useEffect(() => {
const timeout = setTimeout(() => {
loadUsers();
}, 300);
return () => clearTimeout(timeout);
}, [loadUsers]);
const handleUpdateStatus = async (userId: string, newStatus: string) => {
try {
await updateUserStatus(userId, newStatus);
await loadUsers();
} catch (err) {
setError(err instanceof Error ? err.message : 'Failed to update status');
}
};
const handleDeleteUser = async (userId: string) => {
if (!confirm('Are you sure you want to delete this user? This action cannot be undone.')) {
return;
}
try {
setDeletingUser(userId);
await deleteUser(userId);
await loadUsers();
} catch (err) {
setError(err instanceof Error ? err.message : 'Failed to delete user');
} finally {
setDeletingUser(null);
}
};
const handleClearFilters = () => {
setSearch('');
setRoleFilter('');
setStatusFilter('');
};
if (!viewData) {
return (
<div className="flex flex-col items-center justify-center py-20 space-y-3">
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-primary-blue"></div>
<div className="text-gray-400">Loading users...</div>
</div>
);
}
return (
<AdminUsersTemplate
viewData={viewData}
onRefresh={loadUsers}
onSearch={setSearch}
onFilterRole={setRoleFilter}
onFilterStatus={setStatusFilter}
onClearFilters={handleClearFilters}
onUpdateStatus={handleUpdateStatus}
onDeleteUser={handleDeleteUser}
search={search}
roleFilter={roleFilter}
statusFilter={statusFilter}
loading={loading}
error={error}
deletingUser={deletingUser}
/>
);
}

View File

@@ -15,31 +15,29 @@ import { revalidatePath } from 'next/cache';
/**
* Update user status
*/
export async function updateUserStatus(userId: string, status: string): Promise<void> {
try {
const mutation = new UpdateUserStatusMutation();
await mutation.execute({ userId, status });
// Revalidate the users page
revalidatePath('/admin/users');
} catch (error) {
console.error('updateUserStatus failed:', error);
export async function updateUserStatus(userId: string, status: string) {
const mutation = new UpdateUserStatusMutation();
const result = await mutation.execute({ userId, status });
if (result.isErr()) {
console.error('updateUserStatus failed:', result.getError());
throw new Error('Failed to update user status');
}
revalidatePath('/admin/users');
}
/**
* Delete user
*/
export async function deleteUser(userId: string): Promise<void> {
try {
const mutation = new DeleteUserMutation();
await mutation.execute({ userId });
// Revalidate the users page
revalidatePath('/admin/users');
} catch (error) {
console.error('deleteUser failed:', error);
export async function deleteUser(userId: string) {
const mutation = new DeleteUserMutation();
const result = await mutation.execute({ userId });
if (result.isErr()) {
console.error('deleteUser failed:', result.getError());
throw new Error('Failed to delete user');
}
revalidatePath('/admin/users');
}

View File

@@ -1,4 +1,5 @@
import { headers } from 'next/headers';
import { redirect } from 'next/navigation';
import { createRouteGuard } from '@/lib/auth/createRouteGuard';
interface AdminLayoutProps {
@@ -16,11 +17,14 @@ export default async function AdminLayout({ children }: AdminLayoutProps) {
const pathname = headerStore.get('x-pathname') || '/';
const guard = createRouteGuard();
await guard.enforce({ pathname });
const result = await guard.enforce({ pathname });
if (result.type === 'redirect') {
redirect(result.to);
}
return (
<div className="min-h-screen bg-deep-graphite">
{children}
</div>
);
}
}

View File

@@ -1,5 +1,32 @@
import { AdminDashboardClient } from './AdminDashboardClient';
import { AdminDashboardPageQuery } from '@/lib/page-queries/AdminDashboardPageQuery';
import { AdminDashboardTemplate } from '@/templates/AdminDashboardTemplate';
export default function AdminPage() {
return <AdminDashboardClient />;
export default async function AdminPage() {
const result = await AdminDashboardPageQuery.execute();
if (result.isErr()) {
const error = result.getError();
if (error === 'notFound') {
return (
<div className="container mx-auto p-6">
<div className="bg-racing-red/10 border border-racing-red text-racing-red px-4 py-3 rounded-lg">
Access denied - You must be logged in as an Owner or Admin
</div>
</div>
);
}
return (
<div className="container mx-auto p-6">
<div className="bg-racing-red/10 border border-racing-red text-racing-red px-4 py-3 rounded-lg">
Failed to load dashboard: {error}
</div>
</div>
);
}
const viewData = result.unwrap();
// For now, use empty callbacks. In a real app, these would be Server Actions
// that trigger revalidation or navigation
return <AdminDashboardTemplate adminDashboardViewData={viewData} onRefresh={() => {}} isLoading={false} />;
}

View File

@@ -0,0 +1,109 @@
'use client';
import { useState, useCallback } from 'react';
import { useRouter, useSearchParams } from 'next/navigation';
import { AdminUsersTemplate } from '@/templates/AdminUsersTemplate';
import { AdminUsersViewData } from '@/lib/view-data/AdminUsersViewData';
import { updateUserStatus, deleteUser } from '../actions';
interface AdminUsersWrapperProps {
initialViewData: AdminUsersViewData;
}
export function AdminUsersWrapper({ initialViewData }: AdminUsersWrapperProps) {
const router = useRouter();
const searchParams = useSearchParams();
// UI state (not business logic)
const [loading, setLoading] = useState(false);
const [error, setError] = useState<string | null>(null);
const [deletingUser, setDeletingUser] = useState<string | null>(null);
// Current filter values from URL
const search = searchParams.get('search') || '';
const roleFilter = searchParams.get('role') || '';
const statusFilter = searchParams.get('status') || '';
// Callbacks that update URL (triggers RSC re-render)
const handleSearch = useCallback((newSearch: string) => {
const params = new URLSearchParams(searchParams);
if (newSearch) params.set('search', newSearch);
else params.delete('search');
params.delete('page'); // Reset to page 1
router.push(`/admin/users?${params.toString()}`);
}, [router, searchParams]);
const handleFilterRole = useCallback((role: string) => {
const params = new URLSearchParams(searchParams);
if (role) params.set('role', role);
else params.delete('role');
params.delete('page');
router.push(`/admin/users?${params.toString()}`);
}, [router, searchParams]);
const handleFilterStatus = useCallback((status: string) => {
const params = new URLSearchParams(searchParams);
if (status) params.set('status', status);
else params.delete('status');
params.delete('page');
router.push(`/admin/users?${params.toString()}`);
}, [router, searchParams]);
const handleClearFilters = useCallback(() => {
router.push('/admin/users');
}, [router]);
const handleRefresh = useCallback(() => {
router.refresh();
}, [router]);
// Mutation callbacks (call Server Actions)
const handleUpdateStatus = useCallback(async (userId: string, newStatus: string) => {
try {
setLoading(true);
await updateUserStatus(userId, newStatus);
// Revalidate data
router.refresh();
} catch (err) {
setError(err instanceof Error ? err.message : 'Failed to update status');
} finally {
setLoading(false);
}
}, [router]);
const handleDeleteUser = useCallback(async (userId: string) => {
if (!confirm('Are you sure you want to delete this user? This action cannot be undone.')) {
return;
}
try {
setDeletingUser(userId);
await deleteUser(userId);
// Revalidate data
router.refresh();
} catch (err) {
setError(err instanceof Error ? err.message : 'Failed to delete user');
} finally {
setDeletingUser(null);
}
}, [router]);
return (
<AdminUsersTemplate
adminUsersViewData={initialViewData}
onRefresh={handleRefresh}
onSearch={handleSearch}
onFilterRole={handleFilterRole}
onFilterStatus={handleFilterStatus}
onClearFilters={handleClearFilters}
onUpdateStatus={handleUpdateStatus}
onDeleteUser={handleDeleteUser}
search={search}
roleFilter={roleFilter}
statusFilter={statusFilter}
loading={loading}
error={error}
deletingUser={deletingUser}
/>
);
}

View File

@@ -1,5 +1,51 @@
import { AdminUsersClient } from '../AdminUsersClient';
import { AdminUsersPageQuery } from '@/lib/page-queries/AdminUsersPageQuery';
import { AdminUsersWrapper } from './AdminUsersWrapper';
export default function AdminUsers() {
return <AdminUsersClient />;
interface AdminUsersPageProps {
searchParams?: {
search?: string;
role?: string;
status?: string;
page?: string;
};
}
export default async function AdminUsersPage({ searchParams }: AdminUsersPageProps) {
// Parse query parameters
const query = {
search: searchParams?.search,
role: searchParams?.role,
status: searchParams?.status,
page: searchParams?.page ? parseInt(searchParams.page, 10) : 1,
limit: 50,
};
// Execute PageQuery using static method
const result = await AdminUsersPageQuery.execute(query);
// Handle errors
if (result.isErr()) {
const error = result.getError();
if (error === 'notFound') {
return (
<div className="container mx-auto p-6">
<div className="bg-racing-red/10 border border-racing-red text-racing-red px-4 py-3 rounded-lg">
Access denied - You must be logged in as an Owner or Admin
</div>
</div>
);
}
return (
<div className="container mx-auto p-6">
<div className="bg-racing-red/10 border border-racing-red text-racing-red px-4 py-3 rounded-lg">
Failed to load users: {error}
</div>
</div>
);
}
const viewData = result.unwrap();
// Pass to client wrapper for UI interactions
return <AdminUsersWrapper initialViewData={viewData} />;
}