Feature/settings logic

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<SettingsState>) => {
+    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,
+  };
+};

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;
     },
 

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;
 }