mmintel/gridpilot.gg
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

website refactor

Browse Source
This commit is contained in:
Marc Mintel
2026-01-14 10:51:05 +01:00
parent 4522d41aef
commit 0d89ad027e
291 changed files with 6887 additions and 3685 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
apps/website/app/drivers/DriversPageClient.tsx
View File

@@ -1,84 +0,0 @@
'use client';
import React, { useState } from 'react';
import { useRouter } from 'next/navigation';
import { DriversTemplate } from '@/templates/DriversTemplate';
import { DriverLeaderboardViewModel } from '@/lib/view-models/DriverLeaderboardViewModel';
import type { DriversLeaderboardDTO } from '@/lib/types/generated/DriversLeaderboardDTO';
import type { DriverLeaderboardItemDTO } from '@/lib/types/generated/DriverLeaderboardItemDTO';
interface DriversPageClientProps {
pageDto: DriversLeaderboardDTO | null;
error?: string;
empty?: {
title: string;
description: string;
};
}
/**
* DriversPageClient
*
* Client component that:
* 1. Handles state (search, filter, sort)
* 2. Calls ViewModel to get computed display data
* 3. Transforms ViewModel to Template-compatible format
* 4. Passes data to Template
*/
export function DriversPageClient({ pageDto, error, empty }: DriversPageClientProps) {
const router = useRouter();
// Client state
const [searchQuery, setSearchQuery] = useState('');
// Event handlers
const onSearchChange = (query: string) => setSearchQuery(query);
const onDriverClick = (id: string) => router.push(`/drivers/${id}`);
const onBackToLeaderboards = () => router.push('/leaderboards');
// Handle error/empty states
if (error) {
return (
<div className="max-w-7xl mx-auto px-4 py-12 text-center">
<div className="text-red-400 mb-4">Error loading drivers</div>
<p className="text-gray-400">Please try again later</p>
</div>
);
}
if (!pageDto || pageDto.drivers.length === 0) {
if (empty) {
return (
<div className="max-w-7xl mx-auto px-4 py-12 text-center">
<h2 className="text-xl font-semibold text-white mb-2">{empty.title}</h2>
<p className="text-gray-400">{empty.description}</p>
</div>
);
}
return null;
}
// Transform DTO to ViewModel
const dtoForViewModel: { drivers: DriverLeaderboardItemDTO[] } = {
drivers: pageDto.drivers.map(driver => ({
...driver,
avatarUrl: driver.avatarUrl || '',
})),
};
const viewModel = new DriverLeaderboardViewModel(dtoForViewModel);
// Filter drivers based on search
let filteredDrivers = viewModel.drivers.filter(driver => {
if (searchQuery) {
const query = searchQuery.toLowerCase();
const matchesSearch =
driver.name.toLowerCase().includes(query) ||
driver.nationality.toLowerCase().includes(query);
if (!matchesSearch) return false;
}
return true;
});
// Pass to template
return <DriversTemplate data={viewModel} />;
}

92
apps/website/app/drivers/[id]/DriverProfilePageClient.tsx
View File

@@ -1,92 +0,0 @@
'use client';
import React, { useState } from 'react';
import { useRouter } from 'next/navigation';
import { DriverProfileTemplate } from '@/templates/DriverProfileTemplate';
import { DriverProfileViewModelBuilder } from '@/lib/builders/view-models/DriverProfileViewModelBuilder';
import type { GetDriverProfileOutputDTO } from '@/lib/types/generated/GetDriverProfileOutputDTO';
interface DriverProfilePageClientProps {
pageDto: GetDriverProfileOutputDTO | null;
error?: string;
empty?: {
title: string;
description: string;
};
}
/**
* DriverProfilePageClient
*
* Client component that:
* 1. Handles UI state (tabs, friend requests)
* 2. Uses ViewModelBuilder to transform DTO
* 3. Passes ViewModel to Template
*/
export function DriverProfilePageClient({ pageDto, error, empty }: DriverProfilePageClientProps) {
const router = useRouter();
// UI State
const [activeTab, setActiveTab] = useState<'overview' | 'stats'>('overview');
const [friendRequestSent, setFriendRequestSent] = useState(false);
// Event handlers
const handleAddFriend = () => {
setFriendRequestSent(true);
};
const handleBackClick = () => {
router.push('/drivers');
};
// Handle error/empty states
if (error) {
return (
<div className="max-w-6xl mx-auto px-4 py-12 text-center">
<div className="text-red-400 mb-4">Error loading driver profile</div>
<p className="text-gray-400">Please try again later</p>
</div>
);
}
if (!pageDto || !pageDto.currentDriver) {
if (empty) {
return (
<div className="max-w-4xl mx-auto px-4">
<div className="text-center py-12">
<h2 className="text-xl font-semibold text-white mb-2">{empty.title}</h2>
<p className="text-gray-400">{empty.description}</p>
</div>
</div>
);
}
return null;
}
// Transform DTO to ViewModel using Builder
const viewModel = DriverProfileViewModelBuilder.build(pageDto);
// Transform teamMemberships for template
const allTeamMemberships = pageDto.teamMemberships.map(membership => ({
team: {
id: membership.teamId,
name: membership.teamName,
},
role: membership.role,
joinedAt: new Date(membership.joinedAt),
}));
return (
<DriverProfileTemplate
driverProfile={viewModel}
allTeamMemberships={allTeamMemberships}
isLoading={false}
error={null}
onBackClick={handleBackClick}
onAddFriend={handleAddFriend}
friendRequestSent={friendRequestSent}
activeTab={activeTab}
setActiveTab={setActiveTab}
/>
);
}

11
apps/website/app/drivers/[id]/page.tsx
View File

@@ -1,6 +1,7 @@
import { redirect } from 'next/navigation';
import { routes } from '@/lib/routing/RouteConfig';
import { DriverProfilePageQuery } from '@/lib/page-queries/page-queries/DriverProfilePageQuery';
import { DriverProfilePageClient } from './DriverProfilePageClient';
import { DriverProfilePageClient } from '@/components/drivers/DriverProfilePageClient';
export default async function DriverProfilePage({ params }: { params: { id: string } }) {
// Execute the page query
@@ -9,7 +10,7 @@ export default async function DriverProfilePage({ params }: { params: { id: stri
// Handle different result statuses
switch (result.status) {
case 'notFound':
redirect('/404');
redirect(routes.error.notFound);
case 'redirect':
redirect(result.to);
case 'error':
@@ -21,8 +22,8 @@ export default async function DriverProfilePage({ params }: { params: { id: stri
/>
);
case 'ok':
const pageDto = result.dto;
const hasData = !!pageDto.currentDriver;
const viewModel = result.dto;
const hasData = !!viewModel.currentDriver;
if (!hasData) {
return (
@@ -38,7 +39,7 @@ export default async function DriverProfilePage({ params }: { params: { id: stri
return (
<DriverProfilePageClient
pageDto={pageDto}
pageDto={viewModel}
/>
);
}

11
apps/website/app/drivers/page.tsx
View File

@@ -1,6 +1,7 @@
import { redirect } from 'next/navigation';
import { routes } from '@/lib/routing/RouteConfig';
import { DriversPageQuery } from '@/lib/page-queries/page-queries/DriversPageQuery';
import { DriversPageClient } from './DriversPageClient';
import { DriversPageClient } from '@/components/drivers/DriversPageClient';
export default async function Page() {
// Execute the page query
@@ -9,7 +10,7 @@ export default async function Page() {
// Handle different result statuses
switch (result.status) {
case 'notFound':
redirect('/404');
redirect(routes.error.notFound);
case 'redirect':
redirect(result.to);
case 'error':
@@ -21,8 +22,8 @@ export default async function Page() {
/>
);
case 'ok':
const pageDto = result.dto;
const hasData = (pageDto.drivers?.length ?? 0) > 0;
const viewModel = result.dto;
const hasData = (viewModel.drivers?.length ?? 0) > 0;
if (!hasData) {
return (
@@ -38,7 +39,7 @@ export default async function Page() {
return (
<DriversPageClient
pageDto={pageDto}
pageDto={viewModel}
/>
);
}