Move theme settings in the account

Signed-off-by: Quentin Guidée <[email protected]>
vertex-center · Feb 19, 2024 · 1b30f15 · 1b30f15
1 parent 5258e07
commit 1b30f15
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 19 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -12,7 +12,6 @@ import ContainerLogs from "./apps/Containers/pages/ContainerLogs/ContainerLogs";
 import ContainerEnv from "./apps/Containers/pages/ContainerEnv/ContainerEnv";
 import ContainerHome from "./apps/Containers/pages/ContainerHome/ContainerHome";
 import SettingsApp from "./apps/AdminSettings/SettingsApp/SettingsApp";
-import SettingsTheme from "./apps/AdminSettings/SettingsTheme/SettingsTheme";
 import { Fragment, useContext } from "react";
 import { ThemeContext } from "./main";
 import classNames from "classnames";
@@ -49,6 +48,7 @@ import AccountSecurity from "./apps/Auth/pages/Account/AccountSecurity";
 import useUser from "./apps/Auth/hooks/useUser";
 import AccountEmails from "./apps/Auth/pages/Account/AccountEmails";
 import { getAuthToken } from "./backend/server";
+import AccountTheme from "./apps/Auth/pages/Account/AccountTheme";
 
 const queryClient = new QueryClient();
 
@@ -109,6 +109,10 @@ function AllRoutes() {
                                 path="/account/emails"
                                 element={<AccountEmails />}
                             />
+                            <Route
+                                path="/account/theme"
+                                element={<AccountTheme />}
+                            />
                         </Route>
                         <Route
                             path="/"
@@ -189,10 +193,6 @@ function AllRoutes() {
                             />
                         </Route>
                         <Route path="/admin" element={<SettingsApp />}>
-                            <Route
-                                path="/admin/theme"
-                                element={<SettingsTheme />}
-                            />
                             <Route
                                 path="/admin/notifications"
                                 element={<SettingsNotifications />}

diff --git a/src/apps/AdminSettings/SettingsApp/SettingsApp.tsx b/src/apps/AdminSettings/SettingsApp/SettingsApp.tsx
@@ -7,21 +7,13 @@ import {
     Info,
     ListChecks,
     Notification,
-    Palette,
 } from "@phosphor-icons/react";
 
 export default function SettingsApp() {
     useTitle("Settings");
 
     let sidebar = useSidebar(
         <Sidebar>
-            <Sidebar.Group title="Settings">
-                <Sidebar.Item
-                    label="Theme"
-                    icon={<Palette />}
-                    link={l("/admin/theme")}
-                />
-            </Sidebar.Group>
             <Sidebar.Group title="Administration">
                 <Sidebar.Item
                     label="Notifications"

diff --git a/src/apps/Auth/pages/Account/Account.tsx b/src/apps/Auth/pages/Account/Account.tsx
@@ -2,6 +2,7 @@ import PageWithSidebar from "../../../../components/PageWithSidebar/PageWithSide
 import { useSidebar } from "../../../../hooks/useSidebar";
 import { MaterialIcon, Sidebar, useTitle } from "@vertex-center/components";
 import l from "../../../../components/NavLink/navlink";
+import { Palette } from "@phosphor-icons/react";
 
 export default function Account() {
     useTitle("My Account");
@@ -25,6 +26,13 @@ export default function Account() {
                     link={l("/account/emails")}
                 />
             </Sidebar.Group>
+            <Sidebar.Group title="Appearance">
+                <Sidebar.Item
+                    label="Theme"
+                    icon={<Palette />}
+                    link={l("/account/theme")}
+                />
+            </Sidebar.Group>
         </Sidebar>
     );
 

diff --git a/...nSettings/SettingsTheme/SettingsTheme.tsx → src/apps/Auth/pages/Account/AccountTheme.tsx b/...nSettings/SettingsTheme/SettingsTheme.tsx → src/apps/Auth/pages/Account/AccountTheme.tsx
@@ -1,12 +1,11 @@
 import { useContext } from "react";
-import { Button, Title } from "@vertex-center/components";
-import { Vertical } from "../../../components/Layouts/Layouts";
-import { ThemeContext } from "../../../main";
-import { themes } from "../../../models/theme";
-import Content from "../../../components/Content/Content";
+import { Button, Title, Vertical } from "@vertex-center/components";
+import { ThemeContext } from "../../../../main";
+import { themes } from "../../../../models/theme";
+import Content from "../../../../components/Content/Content";
 import { RadioButton } from "@phosphor-icons/react";
 
-export default function SettingsTheme() {
+export default function AccountTheme() {
     const { theme, setTheme } = useContext(ThemeContext);
 
     return (