streamline components

apps/website/components/leagues/LeagueScoringSection.tsx

@@ -5,6 +5,9 @@ import { Trophy, Award, Check, Zap, Settings, Globe, Medal, Plus, Minus, RotateC
 import { createPortal } from 'react-dom';
 import type { LeagueScoringPresetViewModel } from '@/lib/view-models/LeagueScoringPresetViewModel';
 import type { LeagueConfigFormModel } from '@/lib/types/LeagueConfigFormModel';
+import { useInject } from '@/lib/di/hooks/useInject';
+import { LEAGUE_SETTINGS_SERVICE_TOKEN } from '@/lib/di/tokens';
+import type { CustomPointsConfig } from '@/lib/view-models/ScoringConfigurationViewModel';
 
 // ============================================================================
 // INFO FLYOUT COMPONENT
@@ -304,14 +307,6 @@ interface ScoringPatternSectionProps {
   onUpdateCustomPoints?: (points: CustomPointsConfig) => void;
 }
 
-// Custom points configuration for inline editor
-export interface CustomPointsConfig {
-  racePoints: number[];
-  poleBonusPoints: number;
-  fastestLapPoints: number;
-  leaderLapPoints: number;
-}
-
 const DEFAULT_CUSTOM_POINTS: CustomPointsConfig = {
   racePoints: [25, 18, 15, 12, 10, 8, 6, 4, 2, 1],
   poleBonusPoints: 1,
@@ -333,29 +328,19 @@ export function LeagueScoringSection({
   patternOnly,
   championshipsOnly,
 }: LeagueScoringSectionProps) {
+  const leagueSettingsService = useInject(LEAGUE_SETTINGS_SERVICE_TOKEN);
   const disabled = readOnly || !onChange;
 
   const handleSelectPreset = (presetId: string) => {
     if (disabled || !onChange) return;
-    onChange({
-      ...form,
-      scoring: {
-        ...form.scoring,
-        patternId: presetId,
-        customScoringEnabled: false,
-      },
-    });
+    const updatedForm = leagueSettingsService.selectScoringPreset(form, presetId);
+    onChange(updatedForm);
   };
 
   const handleToggleCustomScoring = () => {
     if (disabled || !onChange) return;
-    onChange({
-      ...form,
-      scoring: {
-        ...form.scoring,
-        customScoringEnabled: !form.scoring.customScoringEnabled,
-      },
-    });
+    const updatedForm = leagueSettingsService.toggleCustomScoring(form);
+    onChange(updatedForm);
   };
 
   const patternProps: ScoringPatternSectionProps = {
@@ -465,6 +450,7 @@ export function ScoringPatternSection({
   onToggleCustomScoring,
   onUpdateCustomPoints,
 }: ScoringPatternSectionProps) {
+  const leagueSettingsService = useInject(LEAGUE_SETTINGS_SERVICE_TOKEN);
   const disabled = readOnly || !onChangePatternId;
   const currentPreset = presets.find((p) => p.id === scoring.patternId) ?? null;
   const isCustom = scoring.customScoringEnabled;
@@ -514,19 +500,11 @@ export function ScoringPatternSection({
   };
 
   const getPresetEmoji = (preset: LeagueScoringPresetViewModel) => {
-    const name = preset.name.toLowerCase();
-    if (name.includes('sprint') || name.includes('double')) return '⚡';
-    if (name.includes('endurance') || name.includes('long')) return '🏆';
-    if (name.includes('club') || name.includes('casual')) return '🏅';
-    return '🏁';
+    return leagueSettingsService.getPresetEmoji(preset);
   };
 
   const getPresetDescription = (preset: LeagueScoringPresetViewModel) => {
-    const name = preset.name.toLowerCase();
-    if (name.includes('sprint')) return 'Sprint + Feature race';
-    if (name.includes('endurance')) return 'Long-form endurance';
-    if (name.includes('club')) return 'Casual league format';
-    return preset.sessionSummary;
+    return leagueSettingsService.getPresetDescription(preset);
   };
 
   // Flyout state
@@ -939,6 +917,7 @@ export function ChampionshipsSection({
   onChange,
   readOnly,
 }: ChampionshipsSectionProps) {
+  const leagueSettingsService = useInject(LEAGUE_SETTINGS_SERVICE_TOKEN);
   const disabled = readOnly || !onChange;
   const isTeamsMode = form.structure.mode === 'fixedTeams';
   const [showChampFlyout, setShowChampFlyout] = useState(false);
@@ -948,13 +927,8 @@ export function ChampionshipsSection({
 
   const updateChampionship = (key: keyof LeagueConfigFormModel['championships'], value: boolean) => {
     if (!onChange) return;
-    onChange({
-      ...form,
-      championships: {
-        ...form.championships,
-        [key]: value,
-      },
-    });
+    const updatedForm = leagueSettingsService.updateChampionship(form, key, value);
+    onChange(updatedForm);
   };
 
   const championships = [
@@ -1157,4 +1131,4 @@ export function ChampionshipsSection({
       </div>
     </div>
   );
-}
+}