From 1b5231ae72f16e7a80d09d00d6abc15a57411d28 Mon Sep 17 00:00:00 2001
From: Pas <74743263+Pasithea0@users.noreply.github.com>
Date: Sun, 19 Oct 2025 19:14:01 -0600
Subject: [PATCH] Move admin link (panel) to settings sidebar

---
 src/assets/locales/en.json               |  3 +--
 src/pages/Settings.tsx                   |  4 ----
 src/pages/parts/settings/AdminPanel.tsx  | 30 ------------------------
 src/pages/parts/settings/SidebarPart.tsx | 16 +++++++++++++
 4 files changed, 17 insertions(+), 36 deletions(-)
 delete mode 100644 src/pages/parts/settings/AdminPanel.tsx

diff --git a/src/assets/locales/en.json b/src/assets/locales/en.json
index 0e280b55..afc3dc9b 100644
--- a/src/assets/locales/en.json
+++ b/src/assets/locales/en.json
@@ -891,8 +891,7 @@
       },
       "admin": {
         "title": "Admin panel",
-        "text": "Utilize tools made for testing P-Stream's condition.",
-        "button": "Check it out"
+        "text": "Test P-Stream's condition."
       },
       "actions": {
         "delete": {
diff --git a/src/pages/Settings.tsx b/src/pages/Settings.tsx
index 67589f00..c0ad1750 100644
--- a/src/pages/Settings.tsx
+++ b/src/pages/Settings.tsx
@@ -37,7 +37,6 @@ import { useSubtitleStore } from "@/stores/subtitles";
 import { usePreviewThemeStore, useThemeStore } from "@/stores/theme";
 
 import { SubPageLayout } from "./layouts/SubPageLayout";
-import { AdminPanelPart } from "./parts/settings/AdminPanel";
 import { PreferencesPart } from "./parts/settings/PreferencesPart";
 
 function SettingsLayout(props: { children: React.ReactNode }) {
@@ -504,9 +503,6 @@ export function SettingsPage() {
             <RegisterCalloutPart />
           )}
         </div>
-        <div className="mt-10">
-          <AdminPanelPart />
-        </div>
         <div id="settings-preferences" className="mt-28">
           <PreferencesPart
             language={state.appLanguage.state}
diff --git a/src/pages/parts/settings/AdminPanel.tsx b/src/pages/parts/settings/AdminPanel.tsx
deleted file mode 100644
index 1f656439..00000000
--- a/src/pages/parts/settings/AdminPanel.tsx
+++ /dev/null
@@ -1,30 +0,0 @@
-import { useTranslation } from "react-i18next";
-import { useNavigate } from "react-router-dom";
-
-import { Button } from "@/components/buttons/Button";
-import { SolidSettingsCard } from "@/components/layout/SettingsCard";
-import { Heading3 } from "@/components/utils/Text";
-
-export function AdminPanelPart() {
-  const { t } = useTranslation();
-  const navigate = useNavigate();
-
-  return (
-    <div>
-      <SolidSettingsCard
-        paddingClass="px-6 py-12"
-        className="grid grid-cols-2 gap-12 mt-5"
-      >
-        <div>
-          <Heading3>{t("settings.account.admin.title")}</Heading3>
-          <p className="text-type-text">{t("settings.account.admin.text")}</p>
-        </div>
-        <div className="flex justify-end items-center">
-          <Button theme="purple" onClick={() => navigate("/admin")}>
-            {t("settings.account.admin.button")}
-          </Button>
-        </div>
-      </SolidSettingsCard>
-    </div>
-  );
-}
diff --git a/src/pages/parts/settings/SidebarPart.tsx b/src/pages/parts/settings/SidebarPart.tsx
index 98404c84..36b496a6 100644
--- a/src/pages/parts/settings/SidebarPart.tsx
+++ b/src/pages/parts/settings/SidebarPart.tsx
@@ -1,9 +1,11 @@
 import { useCallback, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
+import { useNavigate } from "react-router-dom";
 import Sticky from "react-sticky-el";
 import { useAsync } from "react-use";
 
 import { getBackendMeta } from "@/backend/accounts/meta";
+import { Button } from "@/components/buttons/Button";
 import { Icon, Icons } from "@/components/Icon";
 import { SidebarLink, SidebarSection } from "@/components/layout/Sidebar";
 import { Divider } from "@/components/utils/Divider";
@@ -36,6 +38,7 @@ export function SidebarPart() {
   // eslint-disable-next-line no-restricted-globals
   const hostname = location.hostname;
   const [activeLink, setActiveLink] = useState("");
+  const navigate = useNavigate();
 
   const settingLinks = [
     {
@@ -204,6 +207,19 @@ export function SidebarPart() {
                 )}
               </p>
             </div>
+
+            <div className="col-span-2 space-y-1">
+              <p className="text-type-dimmed font-medium">
+                {t("settings.account.admin.title")}
+              </p>
+              <Button
+                theme="secondary"
+                onClick={() => navigate("/admin")}
+                className="w-full !p-2 text-xs"
+              >
+                {t("settings.account.admin.text")}
+              </Button>
+            </div>
           </div>
         </SidebarSection>
       </Sticky>