From 04c9139ca645d8a46cec15e74b790337f6a7de9c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marc-Andr=C3=A9=20Bombeck?= <mbombeck@gmail.com>
Date: Thu, 22 Oct 2026 01:36:06 +0200
Subject: [PATCH] perf(settings): load only the link card on the arrangement
 pages

The arrangement page imported its link to the module's own page from the
module pages file, which also holds the labs, mood and injection-site
settings, so every arrangement page shipped all three. The card lives in
its own module.
---
 src/app/settings/layout/[module]/page.tsx     |  2 +-
 .../settings/module-settings-link-card.tsx    | 43 +++++++++++++++++++
 .../settings/module-settings-pages.tsx        | 29 +------------
 3 files changed, 45 insertions(+), 29 deletions(-)
 create mode 100644 src/components/settings/module-settings-link-card.tsx

diff --git a/src/app/settings/layout/[module]/page.tsx b/src/app/settings/layout/[module]/page.tsx
index a220b1265..1eabf8bdc 100644
--- a/src/app/settings/layout/[module]/page.tsx
+++ b/src/app/settings/layout/[module]/page.tsx
@@ -9,7 +9,7 @@ import {
   isLayoutGroupId,
 } from "@/components/settings/layout-groups";
 import { SettingsShell } from "@/components/settings/settings-shell";
-import { ModuleSettingsLinkCard } from "@/components/settings/module-settings-pages";
+import { ModuleSettingsLinkCard } from "@/components/settings/module-settings-link-card";
 import { isModuleSettingsPageId } from "@/components/settings/module-settings-page-ids";
 import { SettingsHubBackLink } from "@/components/settings/settings-hub-back-link";
 import { resolveServerLocale } from "@/lib/i18n/server-locale";
diff --git a/src/components/settings/module-settings-link-card.tsx b/src/components/settings/module-settings-link-card.tsx
new file mode 100644
index 000000000..380c1c275
--- /dev/null
+++ b/src/components/settings/module-settings-link-card.tsx
@@ -0,0 +1,43 @@
+"use client";
+
+/**
+ * The way from a module's arrangement page (`/settings/layout/<id>`) to its
+ * own page under Modules, for the modules that have one.
+ *
+ * Kept apart from `module-settings-pages.tsx` so the arrangement route ships
+ * the card it renders, not the labs, mood and injection-site settings that
+ * module holds.
+ */
+
+import Link from "next/link";
+import { ChevronRight, SlidersHorizontal } from "lucide-react";
+
+import { SettingsCard } from "@/components/settings/settings-card";
+import { SettingsCardHeader } from "@/components/settings/_card-header";
+import { SettingsCardActions } from "@/components/settings/_card-actions";
+import { Button } from "@/components/ui/button";
+import { useTranslations } from "@/lib/i18n/context";
+import type { ModuleSettingsPageId } from "./module-settings-page-ids";
+
+export function ModuleSettingsLinkCard({ id }: { id: ModuleSettingsPageId }) {
+  const { t } = useTranslations();
+  return (
+    <SettingsCard data-slot="arrangement-module-settings-link">
+      <SettingsCardHeader
+        icon={SlidersHorizontal}
+        title={t("settings.sections.modules.pages.moduleSettingsTitle")}
+        description={t(
+          "settings.sections.modules.pages.moduleSettingsDescription",
+        )}
+      />
+      <SettingsCardActions align="start">
+        <Button asChild variant="outline" size="sm" className="min-h-11">
+          <Link href={`/settings/modules/${id}`}>
+            {t("settings.sections.modules.openModuleSettings")}
+            <ChevronRight className="size-4" aria-hidden="true" />
+          </Link>
+        </Button>
+      </SettingsCardActions>
+    </SettingsCard>
+  );
+}
diff --git a/src/components/settings/module-settings-pages.tsx b/src/components/settings/module-settings-pages.tsx
index 4447a344c..bd06c6f9c 100644
--- a/src/components/settings/module-settings-pages.tsx
+++ b/src/components/settings/module-settings-pages.tsx
@@ -15,7 +15,7 @@
  */
 
 import Link from "next/link";
-import { ArrowUpDown, ChevronRight, SlidersHorizontal } from "lucide-react";
+import { ArrowUpDown, ChevronRight } from "lucide-react";
 
 import { LabsModuleSettings } from "@/components/labs/labs-settings";
 import { InjectionSitesCard } from "@/components/settings/injection-sites-card";
@@ -88,30 +88,3 @@ export function ModuleSettingsPageBody({ id }: { id: ModuleSettingsPageId }) {
   const Body = MODULE_SETTINGS_PAGE_BODIES[id];
   return <Body />;
 }
-
-/**
- * The way from a module's arrangement page to its own page under Modules,
- * for the modules that have one.
- */
-export function ModuleSettingsLinkCard({ id }: { id: ModuleSettingsPageId }) {
-  const { t } = useTranslations();
-  return (
-    <SettingsCard data-slot="arrangement-module-settings-link">
-      <SettingsCardHeader
-        icon={SlidersHorizontal}
-        title={t("settings.sections.modules.pages.moduleSettingsTitle")}
-        description={t(
-          "settings.sections.modules.pages.moduleSettingsDescription",
-        )}
-      />
-      <SettingsCardActions align="start">
-        <Button asChild variant="outline" size="sm" className="min-h-11">
-          <Link href={`/settings/modules/${id}`}>
-            {t("settings.sections.modules.openModuleSettings")}
-            <ChevronRight className="size-4" aria-hidden="true" />
-          </Link>
-        </Button>
-      </SettingsCardActions>
-    </SettingsCard>
-  );
-}