fix(otterware): module settings use one frame, Mail/Calendar/Drive pages match Otter Mail

apps/web/src/components/settings/ProjectDefaultsSettings.tsx

@@ -9,6 +9,7 @@ import { resolveProjectSettings } from "@t3tools/shared/projectSettings";
 import { useNavigate } from "@tanstack/react-router";
 
 import { mergeEnvironmentSettings } from "../../hooks/useSettings";
+import { isProfileSettingVisible } from "../../otterware/settingsRegistry";
 import { getCustomModelOptionsByInstance } from "../../modelSelection";
 import {
   applyProviderInstanceSettings,
@@ -213,6 +214,7 @@ export function ProjectDefaultsSettings({ category }: { category: ProjectSetting
       settingKeys={["defaultThreadEnvMode"]}
       mixed={mixedWorkspace}
       id={searchableSetting("new-threads").id}
+      hidden={!isProfileSettingVisible("new-threads")}
       title="Workspace"
       description={
         isProjectScope
@@ -347,6 +349,7 @@ export function ProjectDefaultsSettings({ category }: { category: ProjectSetting
             settingKeys={["worktreeSubmodules"]}
             mixed={mixedSubmodules}
             {...searchableSetting("worktree-submodules")}
+            hidden={!isProfileSettingVisible("worktree-submodules")}
             description={
               isProjectScope
                 ? "How new worktrees in this project populate git submodules."

apps/web/src/components/settings/SettingsPanels.tsx

@@ -1,4 +1,5 @@
 import { ProfileWordmark } from "../../otterware/ProfileLogo";
+import { isProfileSettingVisible } from "../../otterware/settingsRegistry";
 import { SettingsGroup } from "./SettingsGroup";
 import { useScopedSettingsWriteAllowed } from "./useScopedSettings";
 import { Spinner } from "~/components/ui/spinner";
@@ -600,7 +601,7 @@
       DEFAULT_UNIFIED_SETTINGS.persistComposerContextStrip
         ? ["Composer context"]
         : []),
       ...getChangedTypographySettingLabels(settings),
       ...(settings.diffFilesCollapsed !== DEFAULT_UNIFIED_SETTINGS.diffFilesCollapsed
         ? ["Default diff file state"]
         : []),
@@ -869,7 +870,7 @@
     setTheme,
     setThemeHalf,
     theme,
     themeHalves,
     updateSettings,
   ]);
 
@@ -1888,12 +1889,12 @@
   const [draftSettled, setDraftSettled] = useState(true);
   const commitTimerRef = useRef<number | null>(null);
   const lastValueRef = useRef(value);
   if (lastValueRef.current !== value) {
     // The committed value changed externally (hydration, reset, picker
     // selection); adopt it and drop any pending commit of a stale draft.
     lastValueRef.current = value;
     if (commitTimerRef.current !== null) {
       window.clearTimeout(commitTimerRef.current);
       commitTimerRef.current = null;
     }
     setDraft(value);
@@ -2057,7 +2058,7 @@
   // on valid input and snaps back to the persisted value on blur.
   const [draft, setDraft] = useState(String(value));
   useEffect(() => {
     setDraft(String(value));
   }, [value]);
 
   return (
@@ -2124,7 +2125,13 @@
   }, [searchTargetId]);
 
   return (
-    <section id="legacy-features" ref={targetRef} tabIndex={-1} className="space-y-2.5">
+    <section
+      id="legacy-features"
+      ref={targetRef}
+      tabIndex={-1}
+      hidden={!isProfileSettingVisible("legacy-features")}
+      className="space-y-2.5"
+    >
       <Collapsible open={open} onOpenChange={setOpen}>
         <CollapsibleTrigger className="group flex min-h-8 w-full items-center gap-2 px-3 sm:px-4">
           <h2 className="text-sm font-normal text-foreground/70 transition-colors group-hover:text-foreground">
@@ -2277,7 +2284,11 @@
   return (
     <SettingsPageContainer>
       <ProjectDefaultsSettings category="general" />
-      <SettingsSection id="organization" title="Organization">
+      <SettingsSection
+        id="organization"
+        title="Organization"
+        hidden={!isProfileSettingVisible("organization")}
+      >
         <SettingsRow
           {...searchableSetting("project-grouping")}
           description="Combine matching repositories across environments."
@@ -2618,6 +2629,7 @@
         />
         <SettingsRow
           {...searchableSetting("hide-whitespace-changes")}
+          hidden={!isProfileSettingVisible("hide-whitespace-changes")}
           description="Set whether the diff panel ignores whitespace-only edits by default."
           resetAction={
             settings.diffIgnoreWhitespace !== DEFAULT_UNIFIED_SETTINGS.diffIgnoreWhitespace ? (
@@ -2643,6 +2655,7 @@
         />
         <SettingsRow
           {...searchableSetting("default-diff-file-state")}
+          hidden={!isProfileSettingVisible("default-diff-file-state")}
           description="Start with files expanded or collapsed when opening diffs or a pull request's Code tab."
           resetAction={
             settings.diffFilesCollapsed !== DEFAULT_UNIFIED_SETTINGS.diffFilesCollapsed ? (
@@ -2685,6 +2698,7 @@
         />
         <SettingsRow
           {...searchableSetting("diff-layout")}
+          hidden={!isProfileSettingVisible("diff-layout")}
           description="Show diffs stacked or side by side. The toggle in the diff toolbar changes this too."
           resetAction={
             settings.diffLayout !== DEFAULT_UNIFIED_SETTINGS.diffLayout ? (
@@ -2720,6 +2734,7 @@
 
         <SettingsRow
           {...searchableSetting("proactive-panels")}
+          hidden={!isProfileSettingVisible("proactive-panels")}
           description="Open linked pull requests first. Otherwise, open Changes for edits to at least 3 files or 50 lines."
           resetAction={
             settings.proactivePanelsEnabled !== DEFAULT_UNIFIED_SETTINGS.proactivePanelsEnabled ? (
@@ -3075,7 +3090,11 @@
         />
       </SettingsSection>
 
-      <SettingsSection id="projects-and-threads" title="Projects & threads">
+      <SettingsSection
+        id="projects-and-threads"
+        title="Projects & threads"
+        hidden={!isProfileSettingVisible("projects-and-threads")}
+      >
         <SettingsRow
           serverScoped
           settingKeys={["newWorktreesStartFromOrigin"]}
@@ -3260,7 +3279,11 @@
         ) : null}
       </SettingsSection>
 
-      <SettingsSection id="text-generation" title="Text generation">
+      <SettingsSection
+        id="text-generation"
+        title="Text generation"
+        hidden={!isProfileSettingVisible("text-generation")}
+      >
         <SettingsRow
           serverScoped
           settingKeys={["textGenerationModelSelection"]}

apps/web/src/components/settings/SettingsSidebarNav.tsx

@@ -80,6 +80,7 @@ const T3ConnectSidebarAvatar = lazy(() =>
 // Otterware seam: module pages, their icons, grouping and profile visibility
 // follow the registry (docs/internals/modules.md).
 import {
+  OTTERWARE_SETTINGS_NAV_LABELS,
   OTTERWARE_SETTINGS_SECTION_ICONS,
   isProfileSettingsPathVisible,
   settingsNavLayout,
@@ -123,7 +124,7 @@ const UPSTREAM_SETTINGS_ORDER = (Object.keys(SETTINGS_SECTION_LABELS) as Setting
 
 const navItem = (to: SettingsPath): SettingsNavItem => ({
   to,
-  label: SETTINGS_SECTION_LABELS[to],
+  label: OTTERWARE_SETTINGS_NAV_LABELS[to] ?? SETTINGS_SECTION_LABELS[to],
   icon: SETTINGS_SECTION_ICONS[to],
 });
 

apps/web/src/components/settings/settingsLayout.tsx

@@ -41,6 +41,7 @@ import {
   type SettingOverridingProject,
 } from "./SettingInheritance";
 import { ModuleSettingsMerges } from "../../otterware/ModuleSettingsMerges";
+import { showsSettingsScopeSentence } from "../../otterware/settingsRegistry";
 
 const EMPTY_SETTING_KEYS: readonly (keyof ServerSettings)[] = [];
 
@@ -551,6 +552,8 @@ export function SettingsPageContainer({
 }) {
   const navigate = useNavigate();
   const hash = useLocation({ select: (location) => location.hash });
+  const pathname = useLocation({ select: (location) => location.pathname });
+  const scopeSearch = useOptionalSettingsScope()?.search;
   const highlightTarget = useLocation({
     select: (location) => location.state.settingsTargetHighlight !== false,
   });
@@ -576,7 +579,10 @@ export function SettingsPageContainer({
         data-settings-page-scroll
       >
         <WorkspacePageContainer width={width} className={cn("gap-8", className)}>
-          <SettingsScopeSentence />
+          {/* Otterware seam: module pages name their own scope. */}
+          {showsSettingsScopeSentence(pathname, scopeSearch ?? {}) ? (
+            <SettingsScopeSentence />
+          ) : null}
           {children}
           {/* Otterware seam: module settings pages merged into this host page. */}
           <ModuleSettingsMerges />

apps/web/src/components/settings/settingsSearch.ts

@@ -19,6 +19,7 @@ import {
   OTTERWARE_SETTINGS_LABEL_OVERRIDES,
   OTTERWARE_SETTINGS_CATEGORY_SCOPES,
   OTTERWARE_SETTINGS_SEARCH_ITEMS,
+  isProfileSettingVisible,
   isProfileSettingsPathVisible,
   type OtterwareSettingsPath,
 } from "../../otterware/settingsRegistry";
@@ -1218,6 +1219,7 @@ export function filterAvailableSettingsSearchItems(
   return items.filter(
     (item) =>
       isProfileSettingsPathVisible(item.to) &&
+      isProfileSettingVisible(item.targetId ?? item.id) &&
       (!item.cloudOnly || availability.hasCloudPublicConfig) &&
       (!item.environmentOnly || availability.hasEnvironment) &&
       (!item.providerSettingsOnly || availability.hasProviderSettingsEnvironment) &&

apps/web/src/otterware/ModuleSettingsMerges.tsx

@@ -1,14 +1,14 @@
 import { ProviderConnections } from "./account/ProviderConnections";
 /**
  * Module settings pages whose placement merges them into the host page being
- * shown (ADR 0011): each renders as one section, titled with the page's label,
- * below the host page's own rows. `SettingsPageContainer` renders this once
- * per page through its seam; module pages themselves add nothing here.
+ * shown (ADR 0011), below the host page's own sections. A module page draws
+ * its own titled sections, as on its own page, so nothing wraps it here.
+ * `SettingsPageContainer` renders this once per page through its seam.
  */
 import { useLocation } from "@tanstack/react-router";
 import { Suspense } from "react";
 
-import { SettingsSection } from "../components/settings/settingsLayout";
+import { SettingsSearchTarget, SettingsSection } from "../components/settings/settingsLayout";
 import { mergedModuleSettingsPages } from "./settingsRegistry";
 
 export function ModuleSettingsMerges() {
@@ -23,11 +23,15 @@ export function ModuleSettingsMerges() {
       {mergedModuleSettingsPages(pathname).map((entry) => {
         const Page = entry.page.component;
         return (
-          <SettingsSection key={entry.sectionId} id={entry.sectionId} title={entry.page.label}>
+          <SettingsSearchTarget
+            key={entry.sectionId}
+            id={entry.sectionId}
+            className="flex flex-col gap-8 outline-none"
+          >
             <Suspense fallback={null}>
               <Page />
             </Suspense>
-          </SettingsSection>
+          </SettingsSearchTarget>
         );
       })}
     </>

apps/web/src/otterware/calendar/CalendarWebModule.tsx

@@ -25,18 +25,18 @@ import { toastManager } from "../../components/ui/toast";
 
 const settingsPages = [
   {
-    id: "calendar",
-    label: "Calendar",
+    id: "general",
+    label: "General",
     placement: "page",
     rows: [
-      "Week start",
-      "Time zone",
+      "Week starts on",
+      "Show weekends",
+      "Custom view",
       "Working hours",
       "Default length",
-      "Custom-view days",
-      "Weekends",
-      "Declined",
       "New events go to",
+      "Show declined events",
+      "Time zone",
       "Reminders",
     ],
   },
@@ -52,7 +52,7 @@ const settingsPages = [
     placement: "connections",
     rows: ["Google sign-in", "OAuth client", "Demo accounts"],
   },
-  { id: "general", label: "Time", placement: "general", rows: ["Time format"] },
+  { id: "time", label: "Time", placement: "general", rows: ["Time format"] },
 ] as const;
 
 const commands: WebModuleCommand[] = [
@@ -246,8 +246,12 @@ export const CalendarWebModule = createCalendarWebModule({
       id:
         (
           {
-            "Custom-view days": "calendar-custom-days",
+            "Week starts on": "calendar-week-start",
+            "Show weekends": "calendar-weekends",
+            "Custom view": "calendar-custom-days",
+            "Default length": "calendar-default-length",
             "New events go to": "calendar-default-calendar",
+            "Show declined events": "calendar-declined",
             "Time format": "calendar-hour-format",
           } as Record<string, string>
         )[title] ?? `calendar-${title.toLowerCase().replaceAll(" ", "-")}`,