di usage in website

apps/website/app/leagues/[id]/rulebook/LeagueRulebookInteractive.tsx

@@ -3,14 +3,15 @@
 import { useState, useEffect } from 'react';
 import { useParams } from 'next/navigation';
 import { LeagueRulebookTemplate } from '@/templates/LeagueRulebookTemplate';
-import { useServices } from '@/lib/services/ServiceProvider';
+import { useInject } from '@/lib/di/hooks/useInject';
+import { LEAGUE_SERVICE_TOKEN } from '@/lib/di/tokens';
 import { LeagueDetailPageViewModel } from '@/lib/view-models/LeagueDetailPageViewModel';
 
 export default function LeagueRulebookInteractive() {
   const params = useParams();
   const leagueId = params.id as string;
 
-  const { leagueService } = useServices();
+  const leagueService = useInject(LEAGUE_SERVICE_TOKEN);
 
   const [viewModel, setViewModel] = useState<LeagueDetailPageViewModel | null>(null);
   const [loading, setLoading] = useState(true);