Электрон проверка

FRONT/DEV/src/components/settings/Settings.tsx

@@ -1,12 +1,13 @@
 import { ModalContainer, ModalTitle, ModalContent, ButtonContainer } from "../modalwindows/style";
 import { MainButton } from "../UI/buttons/mainButton";
 import {useCallback, useEffect, useMemo, useState} from "react";
-import styled from "styled-components";
+import styled, {useTheme} from "styled-components";
 import {Setting, useSettingsStore} from "../../store/settings/settingsStore";
 import {SettingItem} from "./SettingItem";
 import {IconComponent} from "../../const/buttons/icons";
 import {buttonNames} from "../../const/buttons/names";
 
+
 interface Props {
     onClose: () => void;
 }
@@ -47,6 +48,16 @@ const SectionLine = styled.span`
 const CloseBtn = styled.span`
     cursor: pointer;
 `
+const SettingsButtons = styled.div`
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    span{
+        display: flex;
+        gap: 12px;
+    }
+`
 export const Settings = ({ onClose }: Props) => {
     const settingsConfig = useSettingsStore(state => state.settingsConfig);
     const settingsValues = useSettingsStore(state => state.settingsValues);
@@ -57,10 +68,13 @@ export const Settings = ({ onClose }: Props) => {
     const applyChanges = useSettingsStore(state => state.applyChanges);
     const discardChanges = useSettingsStore(state => state.discardChanges);
     const getSetting = useSettingsStore(state => state.getSetting);
+    const resetToDefaults = useSettingsStore(state => state.resetToDefaults);
     const initializeSettings = useSettingsStore(state => state.initializeSettings);
 
+    const theme = useTheme()
     const [fieldErrors, setFieldErrors] = useState<Record<string, string>>({});
 
+    // Проверка действий
     const handleValidationError = useCallback((fieldId: string, error: string | null) => {
         setFieldErrors(prev => {
             const newErrors = { ...prev };
@@ -126,6 +140,12 @@ export const Settings = ({ onClose }: Props) => {
         onClose();
     }, [discardChanges, onClose]);
 
+    const handleReset = () => {
+        if (window.confirm('Вы уверены, что хотите сбросить все настройки к значениям по умолчанию?')) {
+            resetToDefaults();
+        }
+    };
+
     return (
         <ModalContainer style={{ height: '60vh', width: '50vw', minWidth: "800px" }}>
             <ModalTitle>
@@ -166,20 +186,32 @@ export const Settings = ({ onClose }: Props) => {
             </ModalContent>
 
             <ButtonContainer>
-                <MainButton
-                    type="button"
-                    size="small"
-                    title='Отменить'
-                    onClick={handleCancel}
-
-                />
-                <MainButton
-                    type="button"
-                    size="small"
-                    title='Сохранить'
-                    onClick={handleSave}
-
-                />
+                <SettingsButtons>
+                    <MainButton
+                        type="button"
+                        size="small"
+                        title='Сбросить настройки'
+                        onClick={handleReset}
+                        color={theme.offlineColor}
+                        hoverColor={theme.borderColor}
+                    />
+                    <span>
+                        <MainButton
+                            type="button"
+                            size="small"
+                            title='Отменить'
+                            onClick={handleCancel}
+                            color={theme.offlineColor}
+                            hoverColor={theme.borderColor}
+                        />
+                        <MainButton
+                            type="button"
+                            size="small"
+                            title='Сохранить'
+                            onClick={handleSave}
+                        />
+                    </span>
+                </SettingsButtons>
             </ButtonContainer>
         </ModalContainer>
     );