diff --git a/webapp/IronCalc/src/components/SheetTabBar/SheetTabBar.tsx b/webapp/IronCalc/src/components/SheetTabBar/SheetTabBar.tsx index dd3e592..cf43641 100644 --- a/webapp/IronCalc/src/components/SheetTabBar/SheetTabBar.tsx +++ b/webapp/IronCalc/src/components/SheetTabBar/SheetTabBar.tsx @@ -23,6 +23,8 @@ export interface SheetTabBarProps { onSheetDeleted: () => void; onHideSheet: () => void; onOpenWorkbookSettings: () => void; + initialLocale: string; + initialTimezone: string; } function SheetTabBar(props: SheetTabBarProps) { @@ -124,6 +126,8 @@ function SheetTabBar(props: SheetTabBarProps) { setWorkbookSettingsOpen(false)} + initialLocale={props.initialLocale} + initialTimezone={props.initialTimezone} /> ); diff --git a/webapp/IronCalc/src/components/WorkbookSettings/WorkbookSettingsDialog.tsx b/webapp/IronCalc/src/components/WorkbookSettings/WorkbookSettingsDialog.tsx index 85b9303..ab82b8d 100644 --- a/webapp/IronCalc/src/components/WorkbookSettings/WorkbookSettingsDialog.tsx +++ b/webapp/IronCalc/src/components/WorkbookSettings/WorkbookSettingsDialog.tsx @@ -16,18 +16,30 @@ import { theme } from "../../theme"; type WorkbookSettingsDialogProps = { open: boolean; onClose: () => void; - initialLocale?: string; - initialTimezone?: string; + initialLocale: string; + initialTimezone: string; onSave?: (locale: string, timezone: string) => void; }; const WorkbookSettingsDialog = (properties: WorkbookSettingsDialogProps) => { const { t } = useTranslation(); + const locales = ["en-US", "en-GB", "de-DE", "fr-FR", "es-ES"]; + const timezones = [ + "Berlin, Germany (GMT+1)", + "New York, USA (GMT-5)", + "Tokyo, Japan (GMT+9)", + "London, UK (GMT+0)", + "Sydney, Australia (GMT+10)", + ]; const [selectedLocale, setSelectedLocale] = useState( - properties.initialLocale || "", + properties.initialLocale && locales.includes(properties.initialLocale) + ? properties.initialLocale + : locales[0], ); const [selectedTimezone, setSelectedTimezone] = useState( - properties.initialTimezone || "", + properties.initialTimezone && timezones.includes(properties.initialTimezone) + ? properties.initialTimezone + : timezones[0], ); const handleSave = () => { @@ -37,15 +49,17 @@ const WorkbookSettingsDialog = (properties: WorkbookSettingsDialogProps) => { properties.onClose(); }; - const timezones = [ - "Berlin, Germany (GMT+1)", - "New York, USA (GMT-5)", - "Tokyo, Japan (GMT+9)", - "London, UK (GMT+0)", - "Sydney, Australia (GMT+10)", - ]; + // Ensure selectedLocale is always a valid locale + const validSelectedLocale = + selectedLocale && locales.includes(selectedLocale) + ? selectedLocale + : locales[0]; - const locales = ["en-US", "en-GB", "de-DE", "fr-FR", "es-ES"]; + // Ensure selectedTimezone is always a valid timezone + const validSelectedTimezone = + selectedTimezone && timezones.includes(selectedTimezone) + ? selectedTimezone + : timezones[0]; return ( { { setSelectedLocale(event.target.value as string); }} - displayEmpty MenuProps={{ PaperProps: { sx: menuPaperStyles, @@ -99,18 +112,15 @@ const WorkbookSettingsDialog = (properties: WorkbookSettingsDialogProps) => { }, }} > - {locales.map((locale) => { - const isSelected = locale === selectedLocale; - return ( - - {locale} - - ); - })} + {locales.map((locale) => ( + + {locale} + + ))} @@ -139,24 +149,21 @@ const WorkbookSettingsDialog = (properties: WorkbookSettingsDialogProps) => { { setSelectedTimezone((newValue as string) || ""); }} options={timezones} renderInput={(params) => } - renderOption={(props, option) => { - const isSelected = option === selectedTimezone; - return ( - - {option as string} - - ); - }} + renderOption={(props, option) => ( + + {option as string} + + )} disableClearable slotProps={{ paper: {