Move settings to route instead of modal

src/renderer/features/titlebar/components/app-menu.tsx

@@ -9,10 +9,10 @@ import {
   RiWindowFill,
 } from 'react-icons/ri';
 import { useNavigate } from 'react-router';
-import { DropdownMenu, Text } from '/@/renderer/components';
+import { Link } from 'react-router-dom';
+import { DropdownMenu } from '/@/renderer/components';
 import { ServerList } from '/@/renderer/features/servers';
 import { EditServerForm } from '/@/renderer/features/servers/components/edit-server-form';
-import { Settings } from '/@/renderer/features/settings';
 import { AppRoute } from '/@/renderer/router/routes';
 import { useCurrentServer, useServerList, useAuthStoreActions } from '/@/renderer/store';
 import { ServerListItem, ServerType } from '/@/renderer/types';
@@ -51,19 +51,6 @@ export const AppMenu = () => {
     });
   };
 
-  const handleSettingsModal = () => {
-    openModal({
-      children: <Settings />,
-      size: 'xl',
-      title: (
-        <Group position="center">
-          <RiSettings3Fill size={20} />
-          <Text>Settings</Text>
-        </Group>
-      ),
-    });
-  };
-
   const handleBrowserDevTools = () => {
     browser?.devtools();
   };
@@ -100,8 +87,9 @@ export const AppMenu = () => {
         Manage servers
       </DropdownMenu.Item>
       <DropdownMenu.Item
+        component={Link}
         icon={<RiSettings3Fill />}
-        onClick={handleSettingsModal}
+        to={AppRoute.SETTINGS}
       >
         Settings
       </DropdownMenu.Item>