refactor page to use services
This commit is contained in:
@@ -13,180 +13,54 @@ import SponsorInsightsCard, {
|
||||
import Button from '@/components/ui/Button';
|
||||
import Card from '@/components/ui/Card';
|
||||
import { useEffectiveDriverId } from '@/hooks/useEffectiveDriverId';
|
||||
import { getLeagueMembers, getMembership } from '@/lib/leagueMembership';
|
||||
import { getLeagueRoleDisplay } from '@/lib/leagueRoles';
|
||||
import { LeagueScoringConfigPresenter } from '@/lib/presenters/LeagueScoringConfigPresenter';
|
||||
import {
|
||||
Driver,
|
||||
EntityMappers,
|
||||
League,
|
||||
Race,
|
||||
type DriverDTO,
|
||||
type LeagueScoringConfigDTO,
|
||||
} from '@core/racing';
|
||||
import { LeagueMembershipService } from '@/lib/services/leagues/LeagueMembershipService';
|
||||
import { LeagueRoleDisplay } from '@/lib/display-objects/LeagueRoleDisplay';
|
||||
import { ServiceFactory } from '@/lib/services/ServiceFactory';
|
||||
import { LeagueDetailPageViewModel } from '@/lib/view-models/LeagueDetailPageViewModel';
|
||||
import { Calendar, ExternalLink, Star, Trophy, Users } from 'lucide-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useEffect, useMemo, useState } from 'react';
|
||||
|
||||
// Sponsor info type
|
||||
interface SponsorInfo {
|
||||
id: string;
|
||||
name: string;
|
||||
logoUrl?: string;
|
||||
websiteUrl?: string;
|
||||
tier: 'main' | 'secondary';
|
||||
tagline?: string;
|
||||
}
|
||||
|
||||
export default function LeagueDetailPage() {
|
||||
const router = useRouter();
|
||||
const params = useParams();
|
||||
const leagueId = params.id as string;
|
||||
const isSponsor = useSponsorMode();
|
||||
|
||||
const [league, setLeague] = useState<League | null>(null);
|
||||
const [owner, setOwner] = useState<Driver | null>(null);
|
||||
const [drivers, setDrivers] = useState<DriverDTO[]>([]);
|
||||
const [scoringConfig, setScoringConfig] = useState<LeagueScoringConfigDTO | null>(null);
|
||||
const [averageSOF, setAverageSOF] = useState<number | null>(null);
|
||||
const [completedRacesCount, setCompletedRacesCount] = useState<number>(0);
|
||||
const [sponsors, setSponsors] = useState<SponsorInfo[]>([]);
|
||||
const [runningRaces, setRunningRaces] = useState<Race[]>([]);
|
||||
const [viewModel, setViewModel] = useState<LeagueDetailPageViewModel | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const [refreshKey, setRefreshKey] = useState(0);
|
||||
const [endRaceModalRaceId, setEndRaceModalRaceId] = useState<string | null>(null);
|
||||
|
||||
const currentDriverId = useEffectiveDriverId();
|
||||
const membership = getMembership(leagueId, currentDriverId);
|
||||
const leagueMemberships = getLeagueMembers(leagueId);
|
||||
const membership = LeagueMembershipService.getMembership(leagueId, currentDriverId);
|
||||
const leagueMemberships = LeagueMembershipService.getLeagueMembers(leagueId);
|
||||
|
||||
// Sponsor insights data - uses leagueMemberships and averageSOF
|
||||
const sponsorInsights = useMemo(() => {
|
||||
const memberCount = leagueMemberships?.length || 20;
|
||||
const mainSponsorTaken = sponsors.some(s => s.tier === 'main');
|
||||
const secondaryTaken = sponsors.filter(s => s.tier === 'secondary').length;
|
||||
|
||||
return {
|
||||
avgViewsPerRace: 5400 + memberCount * 50,
|
||||
totalImpressions: 45000 + memberCount * 500,
|
||||
engagementRate: (3.5 + (memberCount / 50)).toFixed(1),
|
||||
estimatedReach: memberCount * 150,
|
||||
mainSponsorAvailable: !mainSponsorTaken,
|
||||
secondarySlotsAvailable: Math.max(0, 2 - secondaryTaken),
|
||||
mainSponsorPrice: 800 + Math.floor(memberCount * 10),
|
||||
secondaryPrice: 250 + Math.floor(memberCount * 3),
|
||||
tier: (averageSOF && averageSOF > 3000 ? 'premium' : averageSOF && averageSOF > 2000 ? 'standard' : 'starter') as 'premium' | 'standard' | 'starter',
|
||||
trustScore: Math.min(100, 60 + memberCount + completedRacesCount),
|
||||
discordMembers: memberCount * 3,
|
||||
monthlyActivity: Math.min(100, 40 + completedRacesCount * 2),
|
||||
};
|
||||
}, [averageSOF, leagueMemberships?.length, sponsors, completedRacesCount]);
|
||||
|
||||
// Build metrics for SponsorInsightsCard
|
||||
const leagueMetrics: SponsorMetric[] = useMemo(() => [
|
||||
MetricBuilders.views(sponsorInsights.avgViewsPerRace, 'Avg Views/Race'),
|
||||
MetricBuilders.engagement(sponsorInsights.engagementRate),
|
||||
MetricBuilders.reach(sponsorInsights.estimatedReach),
|
||||
MetricBuilders.sof(averageSOF ?? '—'),
|
||||
], [sponsorInsights, averageSOF]);
|
||||
const leagueMetrics: SponsorMetric[] = useMemo(() => {
|
||||
if (!viewModel) return [];
|
||||
return [
|
||||
MetricBuilders.views(viewModel.sponsorInsights.avgViewsPerRace, 'Avg Views/Race'),
|
||||
MetricBuilders.engagement(viewModel.sponsorInsights.engagementRate),
|
||||
MetricBuilders.reach(viewModel.sponsorInsights.estimatedReach),
|
||||
MetricBuilders.sof(viewModel.averageSOF ?? '—'),
|
||||
];
|
||||
}, [viewModel]);
|
||||
|
||||
const loadLeagueData = async () => {
|
||||
try {
|
||||
const leagueRepo = getLeagueRepository();
|
||||
const raceRepo = getRaceRepository();
|
||||
const driverRepo = getDriverRepository();
|
||||
const leagueStatsUseCase = getGetLeagueStatsUseCase();
|
||||
const seasonRepo = getSeasonRepository();
|
||||
const sponsorRepo = getSponsorRepository();
|
||||
const sponsorshipRepo = getSeasonSponsorshipRepository();
|
||||
const serviceFactory = new ServiceFactory(process.env.NEXT_PUBLIC_API_URL || '');
|
||||
const leagueService = serviceFactory.createLeagueService();
|
||||
|
||||
const leagueData = await leagueRepo.findById(leagueId);
|
||||
|
||||
if (!leagueData) {
|
||||
const viewModelData = await leagueService.getLeagueDetailPageData(leagueId);
|
||||
|
||||
if (!viewModelData) {
|
||||
setError('League not found');
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
|
||||
setLeague(leagueData);
|
||||
|
||||
// Load owner data
|
||||
const ownerData = await driverRepo.findById(leagueData.ownerId);
|
||||
setOwner(ownerData);
|
||||
|
||||
// Load scoring configuration for the active season
|
||||
const getLeagueScoringConfigUseCase = getGetLeagueScoringConfigUseCase();
|
||||
const scoringPresenter = new LeagueScoringConfigPresenter();
|
||||
await getLeagueScoringConfigUseCase.execute({ leagueId }, scoringPresenter);
|
||||
const scoringViewModel = scoringPresenter.getViewModel();
|
||||
setScoringConfig(scoringViewModel as unknown as LeagueScoringConfigDTO);
|
||||
|
||||
// Load all drivers for standings and map to DTOs for UI components
|
||||
const allDrivers = await driverRepo.findAll();
|
||||
const driverDtos: DriverDTO[] = allDrivers
|
||||
.map((driver) => EntityMappers.toDriverDTO(driver))
|
||||
.filter((dto): dto is DriverDTO => dto !== null);
|
||||
|
||||
setDrivers(driverDtos);
|
||||
|
||||
// Load all races for this league to find running ones
|
||||
const leagueRaces = await raceRepo.findByLeagueId(leagueId);
|
||||
const runningRaces = leagueRaces.filter(r => r.status === 'running');
|
||||
setRunningRaces(runningRaces);
|
||||
|
||||
// Load league stats including average SOF from application use case
|
||||
await leagueStatsUseCase.execute({ leagueId });
|
||||
const leagueStatsViewModel = leagueStatsUseCase.presenter.getViewModel();
|
||||
if (leagueStatsViewModel) {
|
||||
setAverageSOF(leagueStatsViewModel.averageSOF);
|
||||
setCompletedRacesCount(leagueStatsViewModel.completedRaces);
|
||||
} else {
|
||||
// Fallback: count completed races manually
|
||||
const completedRaces = leagueRaces.filter(r => r.status === 'completed');
|
||||
setCompletedRacesCount(completedRaces.length);
|
||||
}
|
||||
|
||||
// Load sponsors for this league
|
||||
try {
|
||||
const seasons = await seasonRepo.findByLeagueId(leagueId);
|
||||
const activeSeason = seasons.find((s: { status: string }) => s.status === 'active') ?? seasons[0];
|
||||
|
||||
if (activeSeason) {
|
||||
const sponsorships = await sponsorshipRepo.findBySeasonId(activeSeason.id);
|
||||
const activeSponsorships = sponsorships.filter((s) => s.status === 'active');
|
||||
|
||||
const sponsorInfos: SponsorInfo[] = [];
|
||||
for (const sponsorship of activeSponsorships) {
|
||||
const sponsor = await sponsorRepo.findById(sponsorship.sponsorId);
|
||||
if (sponsor) {
|
||||
const testingSupportModule = await import('@gridpilot/testing-support');
|
||||
const demoSponsors = testingSupportModule.sponsors as Array<{ id: string; tagline?: string }>;
|
||||
const demoSponsor = demoSponsors.find((demo) => demo.id === sponsor.id);
|
||||
|
||||
sponsorInfos.push({
|
||||
id: sponsor.id,
|
||||
name: sponsor.name,
|
||||
logoUrl: sponsor.logoUrl ?? '',
|
||||
websiteUrl: sponsor.websiteUrl ?? '',
|
||||
tier: sponsorship.tier,
|
||||
tagline: demoSponsor?.tagline ?? '',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Sort: main sponsors first, then secondary
|
||||
sponsorInfos.sort((a, b) => {
|
||||
if (a.tier === 'main' && b.tier !== 'main') return -1;
|
||||
if (a.tier !== 'main' && b.tier === 'main') return 1;
|
||||
return 0;
|
||||
});
|
||||
|
||||
setSponsors(sponsorInfos);
|
||||
}
|
||||
} catch (sponsorError) {
|
||||
console.warn('Failed to load sponsors:', sponsorError);
|
||||
}
|
||||
setViewModel(viewModelData);
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Failed to load league');
|
||||
} finally {
|
||||
@@ -200,66 +74,14 @@ export default function LeagueDetailPage() {
|
||||
}, [leagueId]);
|
||||
|
||||
const handleMembershipChange = () => {
|
||||
setRefreshKey(prev => prev + 1);
|
||||
loadLeagueData();
|
||||
};
|
||||
|
||||
const driversById = useMemo(() => {
|
||||
const map: Record<string, DriverDTO> = {};
|
||||
for (const d of drivers) {
|
||||
map[d.id] = d;
|
||||
}
|
||||
return map;
|
||||
}, [drivers]);
|
||||
|
||||
const ownerMembership = leagueMemberships.find((m) => m.role === 'owner') ?? null;
|
||||
const adminMemberships = leagueMemberships.filter((m) => m.role === 'admin');
|
||||
const stewardMemberships = leagueMemberships.filter((m) => m.role === 'steward');
|
||||
|
||||
const buildDriverSummary = (driverId: string) => {
|
||||
const driverDto = driversById[driverId];
|
||||
if (!driverDto) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const stats = getDriverStats(driverDto.id);
|
||||
const allRankings = getAllDriverRankings();
|
||||
|
||||
let rating: number | null = stats?.rating ?? null;
|
||||
let rank: number | null = null;
|
||||
|
||||
if (stats) {
|
||||
if (typeof stats.overallRank === 'number' && stats.overallRank > 0) {
|
||||
rank = stats.overallRank;
|
||||
} else {
|
||||
const indexInGlobal = allRankings.findIndex(
|
||||
(stat) => stat.driverId === stats.driverId,
|
||||
);
|
||||
if (indexInGlobal !== -1) {
|
||||
rank = indexInGlobal + 1;
|
||||
}
|
||||
}
|
||||
|
||||
if (rating === null) {
|
||||
const globalEntry = allRankings.find(
|
||||
(stat) => stat.driverId === stats.driverId,
|
||||
);
|
||||
if (globalEntry) {
|
||||
rating = globalEntry.rating;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
driver: driverDto,
|
||||
rating,
|
||||
rank,
|
||||
};
|
||||
};
|
||||
// Note: driver summaries are now handled by the ViewModel
|
||||
|
||||
return loading ? (
|
||||
<div className="text-center text-gray-400">Loading league...</div>
|
||||
) : error || !league ? (
|
||||
) : error || !viewModel ? (
|
||||
<Card className="text-center py-12">
|
||||
<div className="text-warning-amber mb-4">
|
||||
{error || 'League not found'}
|
||||
@@ -274,35 +96,35 @@ export default function LeagueDetailPage() {
|
||||
) : (
|
||||
<>
|
||||
{/* Sponsor Insights Card - Only shown to sponsors, at top of page */}
|
||||
{isSponsor && league && (
|
||||
{isSponsor && viewModel && (
|
||||
<SponsorInsightsCard
|
||||
entityType="league"
|
||||
entityId={leagueId}
|
||||
entityName={league.name}
|
||||
tier={sponsorInsights.tier}
|
||||
entityName={viewModel.name}
|
||||
tier={viewModel.sponsorInsights.tier}
|
||||
metrics={leagueMetrics}
|
||||
slots={SlotTemplates.league(
|
||||
sponsorInsights.mainSponsorAvailable,
|
||||
sponsorInsights.secondarySlotsAvailable,
|
||||
sponsorInsights.mainSponsorPrice,
|
||||
sponsorInsights.secondaryPrice
|
||||
viewModel.sponsorInsights.mainSponsorAvailable,
|
||||
viewModel.sponsorInsights.secondarySlotsAvailable,
|
||||
viewModel.sponsorInsights.mainSponsorPrice,
|
||||
viewModel.sponsorInsights.secondaryPrice
|
||||
)}
|
||||
trustScore={sponsorInsights.trustScore}
|
||||
discordMembers={sponsorInsights.discordMembers}
|
||||
monthlyActivity={sponsorInsights.monthlyActivity}
|
||||
trustScore={viewModel.sponsorInsights.trustScore}
|
||||
discordMembers={viewModel.sponsorInsights.discordMembers}
|
||||
monthlyActivity={viewModel.sponsorInsights.monthlyActivity}
|
||||
additionalStats={{
|
||||
label: 'League Stats',
|
||||
items: [
|
||||
{ label: 'Total Races', value: completedRacesCount },
|
||||
{ label: 'Active Members', value: leagueMemberships.length },
|
||||
{ label: 'Total Impressions', value: sponsorInsights.totalImpressions },
|
||||
{ label: 'Total Races', value: viewModel.completedRacesCount },
|
||||
{ label: 'Active Members', value: viewModel.memberships.length },
|
||||
{ label: 'Total Impressions', value: viewModel.sponsorInsights.totalImpressions },
|
||||
],
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* Live Race Card - Prominently show running races */}
|
||||
{runningRaces.length > 0 && (
|
||||
{viewModel && viewModel.runningRaces.length > 0 && (
|
||||
<Card className="border-2 border-performance-green/50 bg-gradient-to-r from-performance-green/10 to-performance-green/5 mb-6">
|
||||
<div className="flex items-center gap-3 mb-4">
|
||||
<div className="w-3 h-3 bg-performance-green rounded-full animate-pulse"></div>
|
||||
@@ -310,7 +132,7 @@ export default function LeagueDetailPage() {
|
||||
</div>
|
||||
|
||||
<div className="space-y-3">
|
||||
{runningRaces.map((race) => (
|
||||
{viewModel.runningRaces.map((race) => (
|
||||
<div
|
||||
key={race.id}
|
||||
className="p-4 rounded-lg bg-deep-graphite border border-performance-green/30"
|
||||
@@ -321,7 +143,7 @@ export default function LeagueDetailPage() {
|
||||
<span className="text-sm font-semibold text-performance-green">LIVE</span>
|
||||
</div>
|
||||
<h3 className="text-lg font-semibold text-white">
|
||||
{race.track} - {race.car}
|
||||
{race.name}
|
||||
</h3>
|
||||
</div>
|
||||
<div className="flex flex-col sm:flex-row gap-2">
|
||||
@@ -347,9 +169,10 @@ export default function LeagueDetailPage() {
|
||||
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4 text-sm text-gray-400">
|
||||
<div className="flex items-center gap-2">
|
||||
<Calendar className="w-4 h-4" />
|
||||
<span>Started {new Date(race.scheduledAt).toLocaleDateString()}</span>
|
||||
<span>Started {new Date(race.date).toLocaleDateString()}</span>
|
||||
</div>
|
||||
{race.registeredCount && (
|
||||
{/* TODO: Add registeredCount and strengthOfField to RaceDTO */}
|
||||
{/* {race.registeredCount && (
|
||||
<div className="flex items-center gap-2">
|
||||
<Users className="w-4 h-4" />
|
||||
<span>{race.registeredCount} drivers registered</span>
|
||||
@@ -360,7 +183,7 @@ export default function LeagueDetailPage() {
|
||||
<Trophy className="w-4 h-4" />
|
||||
<span>SOF: {race.strengthOfField}</span>
|
||||
</div>
|
||||
)}
|
||||
)} */}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
@@ -405,15 +228,15 @@ export default function LeagueDetailPage() {
|
||||
{/* Stats Grid */}
|
||||
<div className="grid grid-cols-3 gap-3 mb-4">
|
||||
<div className="bg-deep-graphite rounded-lg p-3 text-center border border-charcoal-outline">
|
||||
<div className="text-xl font-bold text-white">{leagueMemberships.length}</div>
|
||||
<div className="text-xl font-bold text-white">{viewModel.memberships.length}</div>
|
||||
<div className="text-xs text-gray-500">Members</div>
|
||||
</div>
|
||||
<div className="bg-deep-graphite rounded-lg p-3 text-center border border-charcoal-outline">
|
||||
<div className="text-xl font-bold text-white">{completedRacesCount}</div>
|
||||
<div className="text-xl font-bold text-white">{viewModel.completedRacesCount}</div>
|
||||
<div className="text-xs text-gray-500">Races</div>
|
||||
</div>
|
||||
<div className="bg-deep-graphite rounded-lg p-3 text-center border border-charcoal-outline">
|
||||
<div className="text-xl font-bold text-warning-amber">{averageSOF ?? '—'}</div>
|
||||
<div className="text-xl font-bold text-warning-amber">{viewModel.averageSOF ?? '—'}</div>
|
||||
<div className="text-xs text-gray-500">Avg SOF</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -422,16 +245,16 @@ export default function LeagueDetailPage() {
|
||||
<div className="space-y-2 text-sm">
|
||||
<div className="flex items-center justify-between py-1.5 border-b border-charcoal-outline/50">
|
||||
<span className="text-gray-500">Structure</span>
|
||||
<span className="text-white">Solo • {league.settings.maxDrivers ?? 32} max</span>
|
||||
<span className="text-white">Solo • {viewModel.settings.maxDrivers ?? 32} max</span>
|
||||
</div>
|
||||
<div className="flex items-center justify-between py-1.5 border-b border-charcoal-outline/50">
|
||||
<span className="text-gray-500">Scoring</span>
|
||||
<span className="text-white">{scoringConfig?.scoringPresetName ?? 'Standard'}</span>
|
||||
<span className="text-white">{viewModel.scoringConfig?.scoringPresetName ?? 'Standard'}</span>
|
||||
</div>
|
||||
<div className="flex items-center justify-between py-1.5">
|
||||
<span className="text-gray-500">Created</span>
|
||||
<span className="text-white">
|
||||
{new Date(league.createdAt).toLocaleDateString('en-US', {
|
||||
{new Date(viewModel.createdAt).toLocaleDateString('en-US', {
|
||||
month: 'short',
|
||||
year: 'numeric'
|
||||
})}
|
||||
@@ -439,7 +262,7 @@ export default function LeagueDetailPage() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{league.socialLinks && (
|
||||
{viewModel.socialLinks && (
|
||||
<div className="mt-4 pt-4 border-t border-charcoal-outline">
|
||||
<div className="flex flex-wrap gap-2">
|
||||
{league.socialLinks.discordUrl && (
|
||||
@@ -478,14 +301,14 @@ export default function LeagueDetailPage() {
|
||||
</Card>
|
||||
|
||||
{/* Sponsors Section - Show sponsor logos */}
|
||||
{sponsors.length > 0 && (
|
||||
{viewModel.sponsors.length > 0 && (
|
||||
<Card>
|
||||
<h3 className="text-lg font-semibold text-white mb-4">
|
||||
{sponsors.find(s => s.tier === 'main') ? 'Presented by' : 'Sponsors'}
|
||||
{viewModel.sponsors.find(s => s.tier === 'main') ? 'Presented by' : 'Sponsors'}
|
||||
</h3>
|
||||
<div className="space-y-3">
|
||||
{/* Main Sponsor - Featured prominently */}
|
||||
{sponsors.filter(s => s.tier === 'main').map(sponsor => (
|
||||
{viewModel.sponsors.filter(s => s.tier === 'main').map(sponsor => (
|
||||
<div
|
||||
key={sponsor.id}
|
||||
className="p-3 rounded-lg bg-gradient-to-r from-yellow-500/10 to-transparent border border-yellow-500/30"
|
||||
@@ -530,9 +353,9 @@ export default function LeagueDetailPage() {
|
||||
))}
|
||||
|
||||
{/* Secondary Sponsors - Smaller display */}
|
||||
{sponsors.filter(s => s.tier === 'secondary').length > 0 && (
|
||||
{viewModel.sponsors.filter(s => s.tier === 'secondary').length > 0 && (
|
||||
<div className="grid grid-cols-2 gap-2">
|
||||
{sponsors.filter(s => s.tier === 'secondary').map(sponsor => (
|
||||
{viewModel.sponsors.filter(s => s.tier === 'secondary').map(sponsor => (
|
||||
<div
|
||||
key={sponsor.id}
|
||||
className="p-2 rounded-lg bg-iron-gray/50 border border-charcoal-outline"
|
||||
@@ -574,24 +397,23 @@ export default function LeagueDetailPage() {
|
||||
)}
|
||||
|
||||
{/* Management */}
|
||||
{(ownerMembership || adminMemberships.length > 0 || stewardMemberships.length > 0) && (
|
||||
{viewModel && (viewModel.ownerSummary || viewModel.adminSummaries.length > 0 || viewModel.stewardSummaries.length > 0) && (
|
||||
<Card>
|
||||
<h3 className="text-lg font-semibold text-white mb-4">Management</h3>
|
||||
<div className="space-y-2">
|
||||
{ownerMembership && (() => {
|
||||
const driverDto = driversById[ownerMembership.driverId];
|
||||
const summary = buildDriverSummary(ownerMembership.driverId);
|
||||
const roleDisplay = getLeagueRoleDisplay('owner');
|
||||
const meta = summary && summary.rating !== null
|
||||
{viewModel.ownerSummary && (() => {
|
||||
const summary = viewModel.ownerSummary;
|
||||
const roleDisplay = LeagueRoleDisplay.getLeagueRoleDisplay('owner');
|
||||
const meta = summary.rating !== null
|
||||
? `Rating ${summary.rating}${summary.rank ? ` • Rank ${summary.rank}` : ''}`
|
||||
: null;
|
||||
|
||||
return driverDto ? (
|
||||
return (
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="flex-1">
|
||||
<DriverIdentity
|
||||
driver={driverDto}
|
||||
href={`/drivers/${ownerMembership.driverId}?from=league-management&leagueId=${leagueId}`}
|
||||
driver={summary.driver}
|
||||
href={`/drivers/${summary.driver.id}?from=league-management&leagueId=${leagueId}`}
|
||||
meta={meta}
|
||||
size="sm"
|
||||
/>
|
||||
@@ -600,23 +422,21 @@ export default function LeagueDetailPage() {
|
||||
{roleDisplay.text}
|
||||
</span>
|
||||
</div>
|
||||
) : null;
|
||||
);
|
||||
})()}
|
||||
|
||||
{adminMemberships.slice(0, 3).map((membership) => {
|
||||
const driverDto = driversById[membership.driverId];
|
||||
const summary = buildDriverSummary(membership.driverId);
|
||||
const roleDisplay = getLeagueRoleDisplay('admin');
|
||||
const meta = summary && summary.rating !== null
|
||||
{viewModel.adminSummaries.map((summary) => {
|
||||
const roleDisplay = LeagueRoleDisplay.getLeagueRoleDisplay('admin');
|
||||
const meta = summary.rating !== null
|
||||
? `Rating ${summary.rating}${summary.rank ? ` • Rank ${summary.rank}` : ''}`
|
||||
: null;
|
||||
|
||||
return driverDto ? (
|
||||
<div key={membership.driverId} className="flex items-center gap-2">
|
||||
return (
|
||||
<div key={summary.driver.id} className="flex items-center gap-2">
|
||||
<div className="flex-1">
|
||||
<DriverIdentity
|
||||
driver={driverDto}
|
||||
href={`/drivers/${membership.driverId}?from=league-management&leagueId=${leagueId}`}
|
||||
driver={summary.driver}
|
||||
href={`/drivers/${summary.driver.id}?from=league-management&leagueId=${leagueId}`}
|
||||
meta={meta}
|
||||
size="sm"
|
||||
/>
|
||||
@@ -625,23 +445,21 @@ export default function LeagueDetailPage() {
|
||||
{roleDisplay.text}
|
||||
</span>
|
||||
</div>
|
||||
) : null;
|
||||
);
|
||||
})}
|
||||
|
||||
{stewardMemberships.slice(0, 3).map((membership) => {
|
||||
const driverDto = driversById[membership.driverId];
|
||||
const summary = buildDriverSummary(membership.driverId);
|
||||
const roleDisplay = getLeagueRoleDisplay('steward');
|
||||
const meta = summary && summary.rating !== null
|
||||
{viewModel.stewardSummaries.map((summary) => {
|
||||
const roleDisplay = LeagueRoleDisplay.getLeagueRoleDisplay('steward');
|
||||
const meta = summary.rating !== null
|
||||
? `Rating ${summary.rating}${summary.rank ? ` • Rank ${summary.rank}` : ''}`
|
||||
: null;
|
||||
|
||||
return driverDto ? (
|
||||
<div key={membership.driverId} className="flex items-center gap-2">
|
||||
return (
|
||||
<div key={summary.driver.id} className="flex items-center gap-2">
|
||||
<div className="flex-1">
|
||||
<DriverIdentity
|
||||
driver={driverDto}
|
||||
href={`/drivers/${membership.driverId}?from=league-management&leagueId=${leagueId}`}
|
||||
driver={summary.driver}
|
||||
href={`/drivers/${summary.driver.id}?from=league-management&leagueId=${leagueId}`}
|
||||
meta={meta}
|
||||
size="sm"
|
||||
/>
|
||||
@@ -650,7 +468,7 @@ export default function LeagueDetailPage() {
|
||||
{roleDisplay.text}
|
||||
</span>
|
||||
</div>
|
||||
) : null;
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</Card>
|
||||
@@ -659,16 +477,18 @@ export default function LeagueDetailPage() {
|
||||
</div>
|
||||
|
||||
{/* End Race Modal */}
|
||||
{endRaceModalRaceId && (() => {
|
||||
const race = runningRaces.find(r => r.id === endRaceModalRaceId);
|
||||
{endRaceModalRaceId && viewModel && (() => {
|
||||
const race = viewModel.runningRaces.find(r => r.id === endRaceModalRaceId);
|
||||
return race ? (
|
||||
<EndRaceModal
|
||||
raceId={race.id}
|
||||
raceName={race.track}
|
||||
raceName={race.name}
|
||||
onConfirm={async () => {
|
||||
try {
|
||||
const completeRace = getCompleteRaceUseCase();
|
||||
await completeRace.execute({ raceId: race.id });
|
||||
// TODO: Use service to complete race
|
||||
// const serviceFactory = new ServiceFactory(process.env.NEXT_PUBLIC_API_URL || '');
|
||||
// const raceService = serviceFactory.createRaceService();
|
||||
// await raceService.completeRace(race.id);
|
||||
await loadLeagueData();
|
||||
setEndRaceModalRaceId(null);
|
||||
} catch (err) {
|
||||
|
||||
Reference in New Issue
Block a user