From 54896560162b671ff10719c4550c7778a0dab764 Mon Sep 17 00:00:00 2001
From: Oliver <oliver.henry.walters@gmail.com>
Date: Fri, 22 May 2026 15:19:01 +1000
Subject: [PATCH] [UI] Fix settings rendering (#11987)

- Do not duplicate global plugin settings
---
 .../Index/Settings/PluginSettingsGroup.tsx    | 24 +++++++++++--------
 .../pages/Index/Settings/SystemSettings.tsx   | 12 ++++------
 .../src/pages/Index/Settings/UserSettings.tsx | 12 ++++------
 3 files changed, 24 insertions(+), 24 deletions(-)

diff --git a/src/frontend/src/pages/Index/Settings/PluginSettingsGroup.tsx b/src/frontend/src/pages/Index/Settings/PluginSettingsGroup.tsx
index 79f470498f..5b07a0601b 100644
--- a/src/frontend/src/pages/Index/Settings/PluginSettingsGroup.tsx
+++ b/src/frontend/src/pages/Index/Settings/PluginSettingsGroup.tsx
@@ -70,10 +70,12 @@ function PluginSettingGroupItem({
 export default function PluginSettingsGroup({
   mixin,
   message,
+  includeBaseSettings,
   global
 }: {
   global: boolean;
   message?: string;
+  includeBaseSettings?: boolean;
   mixin?: string;
 }) {
   const mixins: string = useMemo(() => {
@@ -99,16 +101,18 @@ export default function PluginSettingsGroup({
 
   return (
     <Stack gap='xs'>
-      <Accordion defaultValue='plugin-settings'>
-        <Accordion.Item value='plugin-settings'>
-          <Accordion.Control>
-            <StylishText size='lg'>{t`Plugin Settings`}</StylishText>
-          </Accordion.Control>
-          <Accordion.Panel>
-            <GlobalSettingList keys={PLUGIN_SETTINGS_KEYS} />
-          </Accordion.Panel>
-        </Accordion.Item>
-      </Accordion>
+      {includeBaseSettings == true && (
+        <Accordion defaultValue='plugin-settings'>
+          <Accordion.Item value='plugin-settings'>
+            <Accordion.Control>
+              <StylishText size='lg'>{t`Plugin Settings`}</StylishText>
+            </Accordion.Control>
+            <Accordion.Panel>
+              <GlobalSettingList keys={PLUGIN_SETTINGS_KEYS} />
+            </Accordion.Panel>
+          </Accordion.Item>
+        </Accordion>
+      )}
       <Alert color='blue' icon={<IconInfoCircle />}>
         <Text>
           {message ??
diff --git a/src/frontend/src/pages/Index/Settings/SystemSettings.tsx b/src/frontend/src/pages/Index/Settings/SystemSettings.tsx
index a79d501087..bd5c368b8f 100644
--- a/src/frontend/src/pages/Index/Settings/SystemSettings.tsx
+++ b/src/frontend/src/pages/Index/Settings/SystemSettings.tsx
@@ -15,7 +15,7 @@ import {
   IconShoppingCart,
   IconTruckDelivery
 } from '@tabler/icons-react';
-import { lazy, useMemo } from 'react';
+import { useMemo } from 'react';
 
 import { PluginPanelKey } from '@lib/enums/ModelType';
 import type { PanelType } from '@lib/types/Panel';
@@ -25,13 +25,9 @@ import PageTitle from '../../../components/nav/PageTitle';
 import { SettingsHeader } from '../../../components/nav/SettingsHeader';
 import { PanelGroup } from '../../../components/panels/PanelGroup';
 import { GlobalSettingList } from '../../../components/settings/SettingList';
-import { Loadable } from '../../../functions/loading';
 import { useServerApiState } from '../../../states/ServerApiState';
 import { useUserState } from '../../../states/UserState';
-
-const PluginSettingsGroup = Loadable(
-  lazy(() => import('./PluginSettingsGroup'))
-);
+import PluginSettingsGroup from './PluginSettingsGroup';
 
 /**
  * System settings page
@@ -371,7 +367,9 @@ export default function SystemSettings() {
         name: 'plugins',
         label: t`Plugins`,
         icon: <IconPlugConnected />,
-        content: <PluginSettingsGroup global={true} />
+        content: (
+          <PluginSettingsGroup global={true} includeBaseSettings={true} />
+        )
       }
     ];
   }, []);
diff --git a/src/frontend/src/pages/Index/Settings/UserSettings.tsx b/src/frontend/src/pages/Index/Settings/UserSettings.tsx
index 5d6b435fd1..88dfbcfdb0 100644
--- a/src/frontend/src/pages/Index/Settings/UserSettings.tsx
+++ b/src/frontend/src/pages/Index/Settings/UserSettings.tsx
@@ -9,7 +9,7 @@ import {
   IconSearch,
   IconUserCircle
 } from '@tabler/icons-react';
-import { lazy, useMemo } from 'react';
+import { useMemo } from 'react';
 
 import { PluginPanelKey } from '@lib/enums/ModelType';
 import type { PanelType } from '@lib/types/Panel';
@@ -18,14 +18,10 @@ import PageTitle from '../../../components/nav/PageTitle';
 import { SettingsHeader } from '../../../components/nav/SettingsHeader';
 import { PanelGroup } from '../../../components/panels/PanelGroup';
 import { UserSettingList } from '../../../components/settings/SettingList';
-import { Loadable } from '../../../functions/loading';
 import { useUserState } from '../../../states/UserState';
 import { SecurityContent } from './AccountSettings/SecurityContent';
 import { AccountContent } from './AccountSettings/UserPanel';
-
-const PluginSettingsGroup = Loadable(
-  lazy(() => import('./PluginSettingsGroup'))
-);
+import PluginSettingsGroup from './PluginSettingsGroup';
 
 /**
  * User settings page
@@ -130,7 +126,9 @@ export default function UserSettings() {
         name: 'plugins',
         label: t`Plugin Settings`,
         icon: <IconPlugConnected />,
-        content: <PluginSettingsGroup global={false} />
+        content: (
+          <PluginSettingsGroup global={false} includeBaseSettings={true} />
+        )
       }
     ];
   }, []);