diff --git a/src/features/settings/hooks/useSettings.ts b/src/features/settings/hooks/useSettings.ts new file mode 100644 index 0000000..7de49ad --- /dev/null +++ b/src/features/settings/hooks/useSettings.ts @@ -0,0 +1,87 @@ +import { useAppDispatch, useAppSelector } from "../../../store"; +import { + resetSettings, + setMaxExecutionTime, + setTheme, + toggleAutoUpdateScripts, + toggleLogExecutions, + toggleScriptsEnabled, + updateSettings, +} from "../settingsSlice"; +import { SettingsState } from "../types"; + +export const useSettings = () => { + const dispatch = useAppDispatch(); + const settings = useAppSelector((state) => state.settings); + + // General settings update + const updateAppSettings = (updates: Partial) => { + dispatch(updateSettings(updates)); + }; + + // Script-related settings + const toggleScripts = () => { + dispatch(toggleScriptsEnabled()); + }; + + const updateMaxExecutionTime = (time: number) => { + dispatch(setMaxExecutionTime(time)); + }; + + const toggleExecutionLogging = () => { + dispatch(toggleLogExecutions()); + }; + + const toggleAutoUpdate = () => { + dispatch(toggleAutoUpdateScripts()); + }; + + // Theme settings + const switchTheme = (theme: "light" | "dark" | "system") => { + dispatch(setTheme(theme)); + }; + + // Reset functionality + const resetAllSettings = () => { + dispatch(resetSettings()); + }; + + // Validation helpers + const isValidExecutionTime = (time: number) => { + return time >= 1000 && time <= 30000; + }; + + const getExecutionTimeDisplay = (time: number) => { + return `${(time / 1000).toFixed(1)}s`; + }; + + // Computed values + const isDarkMode = settings.theme === "dark"; + const isLightMode = settings.theme === "light"; + const isSystemMode = settings.theme === "system"; + const executionTimeInSeconds = settings.maxExecutionTime / 1000; + + return { + // Current settings state + ...settings, + + // Computed values + isDarkMode, + isLightMode, + isSystemMode, + executionTimeInSeconds, + + // Actions + updateSettings: updateAppSettings, + toggleScripts, + updateMaxExecutionTime, + toggleExecutionLogging, + toggleAutoUpdate, + switchTheme, + resetAllSettings, + + // Helpers + isValidExecutionTime, + getExecutionTimeDisplay, + }; +}; diff --git a/src/features/settings/settingsSlice.ts b/src/features/settings/settingsSlice.ts index c46cafa..cf88f49 100644 --- a/src/features/settings/settingsSlice.ts +++ b/src/features/settings/settingsSlice.ts @@ -5,7 +5,7 @@ const initialState: SettingsState = { scriptsEnabled: true, maxExecutionTime: 5000, logExecutions: true, - theme: "light", + theme: "system", autoUpdateScripts: false, }; @@ -29,7 +29,7 @@ const settingsSlice = createSlice({ state.logExecutions = !state.logExecutions; }, - setTheme: (state, action: PayloadAction<"light" | "dark">) => { + setTheme: (state, action: PayloadAction<"light" | "dark" | "system">) => { state.theme = action.payload; }, diff --git a/src/features/settings/types.ts b/src/features/settings/types.ts index fe08929..a06eeb1 100644 --- a/src/features/settings/types.ts +++ b/src/features/settings/types.ts @@ -2,6 +2,6 @@ export interface SettingsState { scriptsEnabled: boolean; maxExecutionTime: number; logExecutions: boolean; - theme: "light" | "dark"; + theme: "light" | "dark" | "system"; autoUpdateScripts: boolean; }