ENG-1479: Port suggestive mode settings to dual-read (#845)

* ENG-1479: Port suggestive mode settings to dual-read

Add dual-read routing to getFeatureFlag for flags with legacy counterparts.
FEATURE_FLAG_LEGACY_MAP maps "Suggestive mode enabled" and "Enable left
sidebar" to their config tree reads, gated by isNewSettingsStoreEnabled().
Flags without legacy entries go straight to block props (no behavior change).

Migrate value reads from getFormattedConfigTree() / extensionAPI.settings
to accessors:

- index.ts: getUidAndBooleanSetting → getFeatureFlag (accessor handles
  legacy fallback now)
- AdminPanel: suggestiveModeEnabled.value → getFeatureFlag in both
  FeatureFlagsTab and main component. Removed unused useMemo.
- SuggestiveModeSettings: includePageRelations state init →
  getGlobalSetting. Dropped initialValue from both GlobalFlagPanels.
- hyde.ts: orphan extensionAPI.settings.get() reads →
  getGlobalSetting. Fixes bug where sync config toggles had no
  runtime effect (keys were never written by any code).

Structural UIDs remain with getFormattedConfigTree().
pageGroups.groups NOT migrated — type mismatch (legacy PageGroup has
UIDs, Zod PageGroup does not). Deferred to ENG-1470.

* Align hyde.ts fallback defaults with Zod schema

* Fix eslint naming-convention warnings in FEATURE_FLAG_LEGACY_MAP

* Add TODO(ENG-1484) for suggestive mode reactivity

Author: sid597

apps/roam/src/components/settings/AdminPanel.tsx

@@ -360,7 +360,7 @@ const FeatureFlagsTab = (): React.ReactElement => {
   }, []);
 
   const [suggestiveModeEnabled, setSuggestiveModeEnabled] = useState(
-    settings.suggestiveModeEnabled.value || false,
+    getFeatureFlag("Suggestive mode enabled"),
   );
   const [suggestiveModeUid, setSuggestiveModeUid] = useState(
     settings.suggestiveModeEnabled.uid,
@@ -424,6 +424,8 @@ const FeatureFlagsTab = (): React.ReactElement => {
         <p>Are you sure you want to proceed?</p>
       </Alert>
 
+      {/* TODO(ENG-1484): Add pull watcher reactivity so toggling suggestive mode
+          starts/stops sync and shows the tab without requiring a reload. */}
       <Alert
         isOpen={isInstructionOpen}
         onConfirm={() => window.location.reload()}
@@ -498,10 +500,6 @@ const FeatureFlagsTab = (): React.ReactElement => {
 
 const AdminPanel = (): React.ReactElement => {
   const [selectedTabId, setSelectedTabId] = useState<TabId>("admin");
-  const settings = useMemo(() => {
-    refreshConfigTree();
-    return getFormattedConfigTree();
-  }, []);
 
   return (
     <Tabs
@@ -536,7 +534,7 @@ const AdminPanel = (): React.ReactElement => {
           </div>
         }
       />
-      {settings.suggestiveModeEnabled.value && (
+      {getFeatureFlag("Suggestive mode enabled") && (
         <Tab
           id="suggestive-mode-settings"
           title="Suggestive mode"

apps/roam/src/components/settings/SuggestiveModeSettings.tsx

@@ -9,6 +9,7 @@ import { DISCOURSE_CONFIG_PAGE_TITLE } from "~/utils/renderNodeConfigPage";
 import { createOrUpdateDiscourseEmbedding } from "~/utils/syncDgNodesToSupabase";
 import { render as renderToast } from "roamjs-components/components/Toast";
 import { GlobalFlagPanel } from "./components/BlockPropSettingPanels";
+import { getGlobalSetting } from "~/components/settings/utils/accessors";
 import posthog from "posthog-js";
 
 const SuggestiveModeSettings = () => {
@@ -20,7 +21,10 @@ const SuggestiveModeSettings = () => {
   const pageGroupsUid = settings.suggestiveMode.pageGroups.uid;
 
   const [includePageRelations, setIncludePageRelations] = useState(
-    settings.suggestiveMode.includePageRelations.value,
+    getGlobalSetting<boolean>([
+      "Suggestive mode",
+      "Include current page relations",
+    ]) ?? false,
   );
 
   useEffect(() => {
@@ -69,8 +73,9 @@ const SuggestiveModeSettings = () => {
           title="Sync config"
           panel={
             <div className="flex flex-col gap-4 p-1">
-              {/* TODO: Titles kept as Title Case to match legacy readers in getSuggestiveModeConfigSettings.ts.
-                  Update titles to Sentence case once read side is migrated to block props. */}
+              {/* TODO(ENG-1469): Titles kept as Title Case because getSuggestiveModeConfigSettings.ts
+                  still reads from the block tree expecting these strings. Update to Sentence case
+                  once the aggregator is refactored to read from block props. */}
               <div className="sync-config-settings">
                 <GlobalFlagPanel
                   title="Include Current Page Relations"
@@ -79,9 +84,6 @@ const SuggestiveModeSettings = () => {
                     "Suggestive mode",
                     "Include current page relations",
                   ]}
-                  initialValue={
-                    settings.suggestiveMode.includePageRelations.value
-                  }
                   order={0}
                   uid={settings.suggestiveMode.includePageRelations.uid}
                   parentUid={effectiveSuggestiveModeUid}
@@ -99,9 +101,6 @@ const SuggestiveModeSettings = () => {
                     "Suggestive mode",
                     "Include parent and child blocks",
                   ]}
-                  initialValue={
-                    settings.suggestiveMode.includeParentAndChildren.value
-                  }
                   value={includePageRelations ? true : undefined}
                   order={1}
                   uid={settings.suggestiveMode.includeParentAndChildren.uid}

apps/roam/src/components/settings/utils/accessors.ts

@@ -661,9 +661,40 @@ export const getFeatureFlags = (): FeatureFlags => {
   return FeatureFlagsSchema.parse(blockProps || {});
 };
 
+/* eslint-disable @typescript-eslint/naming-convention */
+const FEATURE_FLAG_LEGACY_MAP: Partial<
+  Record<keyof FeatureFlags, () => boolean>
+> = {
+  "Suggestive mode enabled": () =>
+    getFormattedConfigTree().suggestiveModeEnabled.value,
+  "Enable left sidebar": () =>
+    getFormattedConfigTree().leftSidebarEnabled.value,
+};
+/* eslint-enable @typescript-eslint/naming-convention */
+
 export const getFeatureFlag = (key: keyof FeatureFlags): boolean => {
+  const legacyReader = FEATURE_FLAG_LEGACY_MAP[key];
+
+  if (!legacyReader) {
+    // Block-props-only flag (no legacy equivalent)
+    const flags = getFeatureFlags();
+    return flags[key];
+  }
+
+  if (!isNewSettingsStoreEnabled()) {
+    return legacyReader();
+  }
+
   const flags = getFeatureFlags();
-  return flags[key];
+  const blockPropsValue = flags[key];
+  const legacyValue = legacyReader();
+  if (blockPropsValue !== legacyValue) {
+    console.warn(`[DG Dual-Read] Mismatch at Feature Flag > ${key}`, {
+      blockProps: blockPropsValue,
+      legacy: legacyValue,
+    });
+  }
+  return blockPropsValue;
 };
 
 export const isNewSettingsStoreEnabled = (): boolean => {

apps/roam/src/index.ts

@@ -31,13 +31,12 @@ import {
   setSyncActivity,
 } from "./utils/syncDgNodesToSupabase";
 import { initPluginTimer } from "./utils/pluginTimer";
-import { getUidAndBooleanSetting } from "./utils/getExportSettings";
-import getBasicTreeByParentUid from "roamjs-components/queries/getBasicTreeByParentUid";
-import getPageUidByPageTitle from "roamjs-components/queries/getPageUidByPageTitle";
-import { DISCOURSE_CONFIG_PAGE_TITLE } from "./utils/renderNodeConfigPage";
 import { initPostHog } from "./utils/posthog";
 import { initSchema } from "./components/settings/utils/init";
-import { getPersonalSetting } from "./components/settings/utils/accessors";
+import {
+  getFeatureFlag,
+  getPersonalSetting,
+} from "./components/settings/utils/accessors";
 
 export const DEFAULT_CANVAS_PAGE_FORMAT = "Canvas/*";
 
@@ -112,12 +111,7 @@ export default runExtension(async (onloadArgs) => {
   document.addEventListener("input", discourseNodeSearchTriggerListener);
   document.addEventListener("selectionchange", nodeCreationPopoverListener);
 
-  const isSuggestiveModeEnabled = getUidAndBooleanSetting({
-    tree: getBasicTreeByParentUid(
-      getPageUidByPageTitle(DISCOURSE_CONFIG_PAGE_TITLE),
-    ),
-    text: "(BETA) Suggestive Mode Enabled",
-  }).value;
+  const isSuggestiveModeEnabled = getFeatureFlag("Suggestive mode enabled");
 
   if (isSuggestiveModeEnabled) {
     initializeSupabaseSync();

apps/roam/src/utils/hyde.ts

@@ -5,9 +5,9 @@ import { render as renderToast } from "roamjs-components/components/Toast";
 import findDiscourseNode from "./findDiscourseNode";
 import { nextApiRoot } from "@repo/utils/execContext";
 import { DiscourseNode } from "./getDiscourseNodes";
-import getExtensionAPI from "roamjs-components/util/extensionApiContext";
 import { getNodesByType } from "@repo/database/lib/queries";
 import getAllReferencesOnPage from "./getAllReferencesOnPage";
+import { getGlobalSetting } from "~/components/settings/utils/accessors";
 
 type ApiEmbeddingResponse = {
   data: Array<{
@@ -415,15 +415,16 @@ export const performHydeSearch = async ({
     return [];
   }
 
-  const extensionAPI = getExtensionAPI();
   const shouldGrabFromReferencedPages =
-    (extensionAPI.settings.get(
-      "context-grab-from-referenced-pages",
-    ) as boolean) ?? true;
+    getGlobalSetting<boolean>([
+      "Suggestive mode",
+      "Include current page relations",
+    ]) ?? false;
   const shouldGrabParentChildContext =
-    (extensionAPI.settings.get(
-      "context-grab-parent-child-context",
-    ) as boolean) ?? true;
+    getGlobalSetting<boolean>([
+      "Suggestive mode",
+      "Include parent and child blocks",
+    ]) ?? false;
 
   let candidateNodesForHyde: SuggestedNode[] = [];