106 lines
3.8 KiB
TypeScript
106 lines
3.8 KiB
TypeScript
'use client';
|
|
|
|
import { ReadonlyLeagueInfo } from '@/components/leagues/ReadonlyLeagueInfo';
|
|
import LeagueOwnershipTransfer from '@/components/leagues/LeagueOwnershipTransfer';
|
|
import Card from '@/components/ui/Card';
|
|
import { useEffectiveDriverId } from "@/lib/hooks/useEffectiveDriverId";
|
|
import { useParams, useRouter } from 'next/navigation';
|
|
|
|
// Shared state components
|
|
import { StateContainer } from '@/components/shared/state/StateContainer';
|
|
import { LoadingWrapper } from '@/components/shared/state/LoadingWrapper';
|
|
import { useLeagueAdminStatus } from "@/lib/hooks/league/useLeagueAdminStatus";
|
|
import { useLeagueSettings } from "@/lib/hooks/league/useLeagueSettings";
|
|
import { useInject } from '@/lib/di/hooks/useInject';
|
|
import { LEAGUE_SETTINGS_SERVICE_TOKEN } from '@/lib/di/tokens';
|
|
import { AlertTriangle, Settings } from 'lucide-react';
|
|
|
|
export default function LeagueSettingsPage() {
|
|
const params = useParams();
|
|
const leagueId = params.id as string;
|
|
const currentDriverId = useEffectiveDriverId();
|
|
const leagueSettingsService = useInject(LEAGUE_SETTINGS_SERVICE_TOKEN);
|
|
const router = useRouter();
|
|
|
|
// Check admin status using DI + React-Query
|
|
const { data: isAdmin, isLoading: adminLoading } = useLeagueAdminStatus(leagueId, currentDriverId ?? '');
|
|
|
|
// Load settings (only if admin) using DI + React-Query
|
|
const { data: settings, isLoading: settingsLoading, error, retry } = useLeagueSettings(leagueId, { enabled: !!isAdmin });
|
|
|
|
const handleTransferOwnership = async (newOwnerId: string) => {
|
|
try {
|
|
await leagueSettingsService.transferOwnership(leagueId, currentDriverId ?? '', newOwnerId);
|
|
router.refresh();
|
|
} catch (err) {
|
|
throw err; // Let the component handle the error
|
|
}
|
|
};
|
|
|
|
// Show loading for admin check
|
|
if (adminLoading) {
|
|
return <LoadingWrapper variant="full-screen" message="Checking permissions..." />;
|
|
}
|
|
|
|
// Show access denied if not admin
|
|
if (!isAdmin) {
|
|
return (
|
|
<Card>
|
|
<div className="text-center py-12">
|
|
<div className="w-16 h-16 mx-auto mb-4 rounded-full bg-iron-gray/50 flex items-center justify-center">
|
|
<AlertTriangle className="w-8 h-8 text-warning-amber" />
|
|
</div>
|
|
<h3 className="text-lg font-medium text-white mb-2">Admin Access Required</h3>
|
|
<p className="text-sm text-gray-400">
|
|
Only league admins can access settings.
|
|
</p>
|
|
</div>
|
|
</Card>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<StateContainer
|
|
data={settings}
|
|
isLoading={settingsLoading}
|
|
error={error}
|
|
retry={retry}
|
|
config={{
|
|
loading: { variant: 'spinner', message: 'Loading settings...' },
|
|
error: { variant: 'full-screen' },
|
|
empty: {
|
|
icon: Settings,
|
|
title: 'No settings available',
|
|
description: 'Unable to load league configuration.',
|
|
}
|
|
}}
|
|
>
|
|
{(settingsData) => (
|
|
<div className="space-y-6">
|
|
{/* Header */}
|
|
<div className="flex items-center gap-3">
|
|
<div className="flex h-12 w-12 items-center justify-center rounded-xl bg-primary-blue/10">
|
|
<Settings className="w-6 h-6 text-primary-blue" />
|
|
</div>
|
|
<div>
|
|
<h1 className="text-2xl font-bold text-white">League Settings</h1>
|
|
<p className="text-sm text-gray-400">Manage your league configuration</p>
|
|
</div>
|
|
</div>
|
|
|
|
{/* READONLY INFORMATION SECTION - Compact */}
|
|
<div className="space-y-4">
|
|
<ReadonlyLeagueInfo league={settingsData!.league} configForm={settingsData!.config} />
|
|
|
|
<LeagueOwnershipTransfer
|
|
settings={settingsData!}
|
|
currentDriverId={currentDriverId ?? ''}
|
|
onTransferOwnership={handleTransferOwnership}
|
|
/>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</StateContainer>
|
|
);
|
|
}
|