refactor page to use services

This commit is contained in:
2025-12-18 17:02:48 +01:00
parent fc386db06a
commit 9814d9682c
27 changed files with 434 additions and 282 deletions

View File

@@ -13,9 +13,8 @@ import SponsorInsightsCard, {
import Button from '@/components/ui/Button';
import Card from '@/components/ui/Card';
import { useEffectiveDriverId } from '@/hooks/useEffectiveDriverId';
import { LeagueMembershipService } from '@/lib/services/leagues/LeagueMembershipService';
import { LeagueRoleDisplay } from '@/lib/display-objects/LeagueRoleDisplay';
import { ServiceFactory } from '@/lib/services/ServiceFactory';
import { useServices } from '@/lib/services/ServiceProvider';
import { LeagueDetailPageViewModel } from '@/lib/view-models/LeagueDetailPageViewModel';
import { Calendar, ExternalLink, Star, Trophy, Users } from 'lucide-react';
import { useParams, useRouter } from 'next/navigation';
@@ -26,6 +25,7 @@ export default function LeagueDetailPage() {
const params = useParams();
const leagueId = params.id as string;
const isSponsor = useSponsorMode();
const { leagueService, leagueMembershipService } = useServices();
const [viewModel, setViewModel] = useState<LeagueDetailPageViewModel | null>(null);
const [loading, setLoading] = useState(true);
@@ -33,8 +33,8 @@ export default function LeagueDetailPage() {
const [endRaceModalRaceId, setEndRaceModalRaceId] = useState<string | null>(null);
const currentDriverId = useEffectiveDriverId();
const membership = LeagueMembershipService.getMembership(leagueId, currentDriverId);
const leagueMemberships = LeagueMembershipService.getLeagueMembers(leagueId);
const membership = leagueMembershipService.getMembership(leagueId, currentDriverId);
const leagueMemberships = leagueMembershipService.getLeagueMembers(leagueId);
// Build metrics for SponsorInsightsCard
const leagueMetrics: SponsorMetric[] = useMemo(() => {
@@ -49,9 +49,6 @@ export default function LeagueDetailPage() {
const loadLeagueData = async () => {
try {
const serviceFactory = new ServiceFactory(process.env.NEXT_PUBLIC_API_URL || '');
const leagueService = serviceFactory.createLeagueService();
const viewModelData = await leagueService.getLeagueDetailPageData(leagueId);
if (!viewModelData) {
@@ -265,9 +262,9 @@ export default function LeagueDetailPage() {
{viewModel.socialLinks && (
<div className="mt-4 pt-4 border-t border-charcoal-outline">
<div className="flex flex-wrap gap-2">
{league.socialLinks.discordUrl && (
{viewModel.socialLinks.discordUrl && (
<a
href={league.socialLinks.discordUrl}
href={viewModel.socialLinks.discordUrl}
target="_blank"
rel="noreferrer"
className="inline-flex items-center gap-1 rounded-full border border-primary-blue/40 bg-primary-blue/10 px-2 py-1 text-xs text-primary-blue hover:bg-primary-blue/20 transition-colors"
@@ -275,9 +272,9 @@ export default function LeagueDetailPage() {
Discord
</a>
)}
{league.socialLinks.youtubeUrl && (
{viewModel.socialLinks.youtubeUrl && (
<a
href={league.socialLinks.youtubeUrl}
href={viewModel.socialLinks.youtubeUrl}
target="_blank"
rel="noreferrer"
className="inline-flex items-center gap-1 rounded-full border border-red-500/40 bg-red-500/10 px-2 py-1 text-xs text-red-400 hover:bg-red-500/20 transition-colors"
@@ -285,9 +282,9 @@ export default function LeagueDetailPage() {
YouTube
</a>
)}
{league.socialLinks.websiteUrl && (
{viewModel.socialLinks.websiteUrl && (
<a
href={league.socialLinks.websiteUrl}
href={viewModel.socialLinks.websiteUrl}
target="_blank"
rel="noreferrer"
className="inline-flex items-center gap-1 rounded-full border border-charcoal-outline bg-iron-gray/70 px-2 py-1 text-xs text-gray-100 hover:bg-iron-gray transition-colors"