feat: send schema preview to storm

[benlife5]

Sends/receives iframe messages to resolve schema for the Schema Drawer preview in storm

Also moves the advanced settings override to it's own file and switches to usePuck to fix some issues with the schema drawer re-mounting and then not saving properly

[coderabbitai]

Walkthrough

The changes wire a StreamDocument through the Editor component hierarchy to LayoutEditor and into useLayoutMessageReceivers to enable schema resolution based on document metadata. A new FieldsOverride component is introduced to handle Advanced Settings panel rendering with custom schema markup field handling and navigation. The getSchema utility is simplified by removing conditional path computation logic and now accepts pre-computed paths directly. These modifications establish an end-to-end flow for resolving and communicating schemas to parent contexts.

Sequence Diagram

sequenceDiagram
    participant Parent
    participant Editor
    participant LayoutEditor
    participant useLayoutMessageReceivers
    
    Editor->>LayoutEditor: Pass streamDocument prop
    
    Parent->>LayoutEditor: Send "resolveSchema" message
    
    LayoutEditor->>useLayoutMessageReceivers: Invoke with streamDocument
    
    useLayoutMessageReceivers->>useLayoutMessageReceivers: Extract path from streamDocument.metadata<br/>(locator/dm_ vs other)
    
    useLayoutMessageReceivers->>useLayoutMessageReceivers: Augment streamDocument with path<br/>and fallback siteDomain
    
    useLayoutMessageReceivers->>useLayoutMessageReceivers: Resolve schema via resolveSchemaJson
    
    useLayoutMessageReceivers->>Parent: Send resolved schema via "resolveSchema" channel

Loading

Possibly related PRs

• fix: schema resolution for special cases #862 — Introduces and rewrites resolveSchemaJson and related schema resolution helpers that are now called by the new message receiver logic
• fix: language picker when url templates are in use #840 — Wires StreamDocument through the editor component hierarchy and modifies the same URL-template and schema resolution code paths
• feat: remove empty values from schema #850 — Modifies schema utilities including getSchema and resolveSchemaJson that are central to the schema resolution flow introduced in this PR

Suggested reviewers

• briantstephan
• colton-demetriou
• mkilpatrick
• asanehisa

Pre-merge checks and finishing touches

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'feat: send schema preview to storm' accurately describes the main objective of the changeset, which is to send schema preview messages to storm via iframe communication.
Description check	✅ Passed	The description is related to the changeset, mentioning the iframe message resolution for schema preview and the refactoring of advanced settings override.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch schema-preview

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between ecf2edc and 42510ee.

📒 Files selected for processing (6)

• packages/visual-editor/src/editor/Editor.tsx (1 hunks)
• packages/visual-editor/src/internal/components/InternalLayoutEditor.tsx (2 hunks)
• packages/visual-editor/src/internal/components/LayoutEditor.tsx (4 hunks)
• packages/visual-editor/src/internal/hooks/layout/useMessageReceivers.ts (2 hunks)
• packages/visual-editor/src/internal/puck/components/FieldsOverride.tsx (1 hunks)
• packages/visual-editor/src/utils/schema/getSchema.ts (1 hunks)

🧰 Additional context used

🧠 Learnings (2)

📚 Learning: 2025-11-06T14:55:12.385Z

Learnt from: benlife5
Repo: yext/visual-editor PR: 862
File: packages/visual-editor/src/utils/schema/resolveSchema.ts:118-135
Timestamp: 2025-11-06T14:55:12.385Z
Learning: In `packages/visual-editor/src/utils/schema/resolveSchema.ts`, the `OpeningHoursSchema` and `PhotoGallerySchema` functions from `yext/pages-components` contain internal type validation and handle invalid inputs gracefully (returning empty objects or undefined) rather than throwing TypeErrors, so no pre-validation guards are needed before calling them.

Applied to files:

• packages/visual-editor/src/internal/hooks/layout/useMessageReceivers.ts
• packages/visual-editor/src/utils/schema/getSchema.ts

📚 Learning: 2025-11-04T21:23:36.061Z

Learnt from: benlife5
Repo: yext/visual-editor PR: 862
File: packages/visual-editor/src/utils/schema/resolveSchema.ts:17-21
Timestamp: 2025-11-04T21:23:36.061Z
Learning: In `packages/visual-editor/src/utils/schema/resolveSchema.ts`, the `stringifyResolvedField` function returns string values directly without JSON escaping because the resolved values are placed into a structured object that is later serialized via `JSON.stringify()`. Pre-escaping would cause double-escaping in the final JSON output.

Applied to files:

• packages/visual-editor/src/utils/schema/getSchema.ts

🧬 Code graph analysis (4)

packages/visual-editor/src/internal/puck/components/FieldsOverride.tsx (1)

packages/visual-editor/src/internal/components/AdvancedSettings.tsx (1)

• AdvancedSettings (127-140)

packages/visual-editor/src/internal/hooks/layout/useMessageReceivers.ts (3)

packages/visual-editor/src/utils/applyTheme.ts (1)

• StreamDocument (19-37)

packages/visual-editor/src/internal/hooks/useMessage.ts (3)

• useSendMessageToParent (100-123)
• TARGET_ORIGINS (42-50)
• useReceiveMessage (135-162)

packages/visual-editor/src/utils/schema/resolveSchema.ts (1)

• resolveSchemaJson (55-64)

packages/visual-editor/src/internal/components/InternalLayoutEditor.tsx (1)

packages/visual-editor/src/internal/puck/components/FieldsOverride.tsx (1)

• fieldsOverride (10-85)

packages/visual-editor/src/internal/components/LayoutEditor.tsx (1)

packages/visual-editor/src/utils/index.ts (1)

• StreamDocument (8-8)

🔇 Additional comments (3)

packages/visual-editor/src/utils/schema/getSchema.ts (1)

23-24: Confirm fallback when path is absent.

By assigning document.path = data.path unconditionally we no longer synthesize a path when data.path is missing. In the new Storm schema preview flow (useLayoutMessageReceivers → getSchema) we don’t appear to invoke the template’s getPath, so data.path remains undefined; resolveSchemaString(document, "[[siteDomain]]/[[path]]") will then emit …/undefined, which breaks breadcrumbs and the aggregate rating block. Please either reinstate the old fallback (e.g., via resolveUrlTemplateOfChild / resolvePageSetUrlTemplate) or ensure every caller populates data.path before calling getSchema. Can you double-check this scenario?

packages/visual-editor/src/internal/puck/components/FieldsOverride.tsx (1)

18-80: Nice extraction of the Advanced Settings override.

Encapsulating the schema editor override here keeps InternalLayoutEditor lean while reusing the existing custom field renderer without duplicating logic. Looks good.

packages/visual-editor/src/internal/hooks/layout/useMessageReceivers.ts (1)

68-92: Guard against missing/invalid schema payload before resolving

payload?.schema comes directly from the parent frame. When it’s undefined, null, or any non-object, resolveSchemaJson throws (it expects a Record<string, any>), which bounces the entire message handler and leaves the parent without a response. We should short-circuit on invalid payloads and reply (or at least log) instead of attempting to resolve the schema. A quick guard right after reading payload?.schema would keep the iframe stable and avoid crashing the drawer flow.

   const schema = payload?.schema;
+  if (!schema || typeof schema !== "object") {
+    devLogger.logData("RESOLVE_SCHEMA_INVALID_PAYLOAD", payload);
+    sendResolvedSchemaToParent({
+      payload: { error: "Schema payload missing or invalid" },
+    });
+    return;
+  }
 
   // Resolve the url path
   let path = "";

⛔ Skipped due to learnings

Learnt from: benlife5
Repo: yext/visual-editor PR: 862
File: packages/visual-editor/src/utils/schema/resolveSchema.ts:118-135
Timestamp: 2025-11-06T14:55:12.385Z
Learning: In `packages/visual-editor/src/utils/schema/resolveSchema.ts`, the `OpeningHoursSchema` and `PhotoGallerySchema` functions from `yext/pages-components` contain internal type validation and handle invalid inputs gracefully (returning empty objects or undefined) rather than throwing TypeErrors, so no pre-validation guards are needed before calling them.

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}