@@ -2,12 +2,40 @@ import { useState } from 'react';
22import { BaseSettingsSection } from '../components/BaseSettingsSection' ;
33import { StandingsWidgetSettings } from '../types' ;
44import { useDashboard } from '@irdashies/context' ;
5+ import { ToggleSwitch } from '../components/ToggleSwitch' ;
6+
7+ const SETTING_ID = 'standings' ;
8+
9+ const defaultConfig : StandingsWidgetSettings [ 'config' ] = {
10+ iRatingChange : { enabled : true } ,
11+ badge : { enabled : true } ,
12+ delta : { enabled : true } ,
13+ lastTime : { enabled : true } ,
14+ fastestTime : { enabled : true } ,
15+ } ;
16+
17+ // Migration function to handle missing properties in the new config format
18+ const migrateConfig = ( savedConfig : unknown ) : StandingsWidgetSettings [ 'config' ] => {
19+ if ( ! savedConfig || typeof savedConfig !== 'object' ) return defaultConfig ;
20+
21+ const config = savedConfig as Record < string , unknown > ;
22+
23+ // Handle new format with missing properties
24+ return {
25+ iRatingChange : { enabled : ( config . iRatingChange as { enabled ?: boolean } ) ?. enabled ?? true } ,
26+ badge : { enabled : ( config . badge as { enabled ?: boolean } ) ?. enabled ?? true } ,
27+ delta : { enabled : ( config . delta as { enabled ?: boolean } ) ?. enabled ?? true } ,
28+ lastTime : { enabled : ( config . lastTime as { enabled ?: boolean } ) ?. enabled ?? true } ,
29+ fastestTime : { enabled : ( config . fastestTime as { enabled ?: boolean } ) ?. enabled ?? true } ,
30+ } ;
31+ } ;
532
633export const StandingsSettings = ( ) => {
734 const { currentDashboard } = useDashboard ( ) ;
35+ const savedSettings = currentDashboard ?. widgets . find ( w => w . id === SETTING_ID ) as StandingsWidgetSettings | undefined ;
836 const [ settings , setSettings ] = useState < StandingsWidgetSettings > ( {
9- enabled : currentDashboard ?. widgets . find ( w => w . id === 'standings' ) ?. enabled ?? false ,
10- config : currentDashboard ?. widgets . find ( w => w . id === 'standings' ) ?. config ?? { } ,
37+ enabled : savedSettings ?. enabled ?? false ,
38+ config : migrateConfig ( savedSettings ?. config ) ,
1139 } ) ;
1240
1341 if ( ! currentDashboard ) {
@@ -20,12 +48,65 @@ export const StandingsSettings = () => {
2048 description = "Configure how the standings widget appears and behaves."
2149 settings = { settings }
2250 onSettingsChange = { setSettings }
23- widgetId = "standings"
51+ widgetId = { SETTING_ID }
2452 >
25- { /* Add specific settings controls here */ }
26- < div className = "text-slate-300" >
27- Additional settings will appear here
28- </ div >
53+ { ( handleConfigChange ) => (
54+ < div className = "space-y-8" >
55+ { /* Display Settings */ }
56+ < div className = "space-y-4" >
57+ < div className = "flex items-center justify-between" >
58+ < h3 className = "text-lg font-medium text-slate-200" > Display Settings</ h3 >
59+ </ div >
60+ < div className = "space-y-3 pl-4" >
61+ < div className = "flex items-center justify-between" >
62+ < span className = "text-sm text-slate-300" > Show iRating Changes</ span >
63+ < ToggleSwitch
64+ enabled = { settings . config . iRatingChange . enabled }
65+ onToggle = { ( enabled ) =>
66+ handleConfigChange ( { iRatingChange : { enabled } } )
67+ }
68+ />
69+ </ div >
70+ < div className = "flex items-center justify-between" >
71+ < span className = "text-sm text-slate-300" > Show Driver Badge</ span >
72+ < ToggleSwitch
73+ enabled = { settings . config . badge . enabled }
74+ onToggle = { ( enabled ) =>
75+ handleConfigChange ( { badge : { enabled } } )
76+ }
77+ />
78+ </ div >
79+ < div className = "flex items-center justify-between" >
80+ < span className = "text-sm text-slate-300" > Show Delta</ span >
81+ < ToggleSwitch
82+ enabled = { settings . config . delta . enabled }
83+ onToggle = { ( enabled ) =>
84+ handleConfigChange ( { delta : { enabled } } )
85+ }
86+ />
87+ </ div >
88+ < div className = "flex items-center justify-between" >
89+ < span className = "text-sm text-slate-300" > Show Last Time</ span >
90+ < ToggleSwitch
91+ enabled = { settings . config . lastTime . enabled }
92+ onToggle = { ( enabled ) =>
93+ handleConfigChange ( { lastTime : { enabled } } )
94+ }
95+ />
96+ </ div >
97+ < div className = "flex items-center justify-between" >
98+ < span className = "text-sm text-slate-300" > Show Fastest Time</ span >
99+ < ToggleSwitch
100+ enabled = { settings . config . fastestTime . enabled }
101+ onToggle = { ( enabled ) =>
102+ handleConfigChange ( { fastestTime : { enabled } } )
103+ }
104+ />
105+ </ div >
106+ </ div >
107+ </ div >
108+ </ div >
109+ ) }
29110 </ BaseSettingsSection >
30111 ) ;
31112} ;
0 commit comments