feat(App): add settings page and integrate into navigation; update command palette with settings option

frontend/src/App.jsx

@@ -40,9 +40,9 @@ import Dashboard from './Dashboard';
 import TrafficDashboard from './TrafficDashboard.jsx';
 import MikrotikBackupsManager from './MikrotikBackupsManager.jsx';
 import PingServicesManager from './PingServicesManager.jsx';
+import SettingsPage from './SettingsPage.jsx';
 import './App.css';
 import { NotifyProvider } from './components/NotifyProvider.jsx';
-import SettingsModal from './components/SettingsModal.jsx';
 import ToastContainer from './components/ToastContainer.jsx';
 import CommandPalette, { KeyboardShortcutsButton } from './components/CommandPalette.jsx';
 import ErrorBoundary from './components/ErrorBoundary.jsx';
@@ -136,7 +136,6 @@ function MainLayout() {
   const location = useLocation();
   const { lang, setLang, t } = useContext(LanguageContext);
   const { theme, setTheme } = useContext(ThemeContext);
-  const [settingsOpen, setSettingsOpen] = useState(false);
   const [layout, setLayout] = useState(() => localStorage.getItem('layout') || LAYOUT_FLUID);
 
   useEffect(() => {
@@ -230,7 +229,13 @@ function MainLayout() {
         { id: 'ping-services', title: t('pingServices'), path: '/ping-services', icon: IconNetwork }
       ]
     },
-    // Убрали неиспользуемые/неработающие разделы
+    {
+      id: 'settings',
+      title: 'Настройки',
+      icon: IconSettings,
+      single: true,
+      path: '/settings'
+    }
   ];
 
   // Определяем активную вкладку по адресу
@@ -364,9 +369,9 @@ function MainLayout() {
                 <KeyboardShortcutsButton className="nav-link px-2" />
               </div>
               <div className="nav-item">
-                <a href="#" className="nav-link px-2" onClick={(e) => { e.preventDefault(); setSettingsOpen(true); }} title="Настройки">
+                <Link to="/settings" className="nav-link px-2" title="Настройки">
                   <IconSettings size={20} />
-                </a>
+                </Link>
               </div>
             </div>
           </div>
@@ -388,13 +393,13 @@ function MainLayout() {
             <Route path="/mikrotik-backups" element={<MikrotikBackupsManager />} />
             <Route path="/mikrotik-tools" element={<MikrotikTools />} />
             <Route path="/ping-services" element={<PingServicesManager />} />
+            <Route path="/settings" element={<SettingsPage />} />
             <Route path="/" element={<Navigate to="/dashboard" replace />} />
           </Routes>
         </main>
         <footer className="footer mt-auto py-2">
           <div className="container-xl text-muted small">Версия UI: {import.meta?.env?.VITE_APP_VERSION || 'dev'}</div>
         </footer>
-        <SettingsModal open={settingsOpen} onClose={() => setSettingsOpen(false)} />
         <CommandPalette />
       </div>
     );
@@ -515,7 +520,7 @@ function MainLayout() {
                   <KeyboardShortcutsButton className="nav-link btn-icon rounded" title="Горячие клавиши" />
                 </div>
                 <div className="nav-item">
-                  <a href="#" className="nav-link btn-icon rounded" onClick={(e) => { e.preventDefault(); setSettingsOpen(true); }} title="Настройки">
+                  <Link to="/settings" className="nav-link btn-icon rounded" title="Настройки">
                     <IconSettings size={20} />
                   </a>
                 </div>
@@ -545,6 +550,7 @@ function MainLayout() {
                 <Route path="/mikrotik-backups" element={<MikrotikBackupsManager />} />
                 <Route path="/mikrotik-tools" element={<MikrotikTools />} />
                 <Route path="/ping-services" element={<PingServicesManager />} />
+                <Route path="/settings" element={<SettingsPage />} />
                 <Route path="/" element={<Navigate to="/dashboard" replace />} />
               </Routes>
             </main>
@@ -558,7 +564,6 @@ function MainLayout() {
           </div>
         </footer>
       </div>
-      <SettingsModal open={settingsOpen} onClose={() => setSettingsOpen(false)} />
       <CommandPalette />
     </div>
   );