feat: use breadcrumbPrefix for breadcrumb urls by briantstephan · Pull Request #1006 · yext/visual-editor

briantstephan · 2026-01-28T22:01:24Z

This updates breadcrumbs to use the new pathInfo.breadcrumbPrefix field as the prefix before the directory parent slug.

Feel free to test it here: https://dev.yext.com/s/1000167375/yextsites/66601/pagesets

github-actions · 2026-01-28T22:01:51Z

Warning: Component files have been updated but no migrations have been added. See https://github.com/yext/visual-editor/blob/main/packages/visual-editor/src/components/migrations/README.md for more information.

pkg-pr-new · 2026-01-28T22:03:45Z

pages-visual-editor-starter

npm i https://pkg.pr.new/yext/visual-editor/@yext/visual-editor@1006

commit: 3ce2e6b

…isual-editor into breadcrumbs-url-templates

coderabbitai · 2026-02-13T17:31:00Z

Walkthrough

This PR refactors the breadcrumb resolution logic in the visual editor by introducing a new multi-strategy resolver pattern. The Breadcrumbs component is updated to use a new resolveBreadcrumbs function instead of directly calling getDirectoryParents. The StreamDocument type is modified to replace the breadcrumbTemplates field with breadcrumbPrefix (changing from an optional array to an optional string). New utility functions resolveBreadcrumbsFromPathInfo and buildBreadcrumbsFromDirectory implement resolution strategies that attempt pathInfo-based breadcrumbs first, then fall back to directory-parent-based construction. Comprehensive test coverage is added for both resolution approaches and the orchestrating resolver.

Sequence Diagram

sequenceDiagram
    participant BC as Breadcrumbs Component
    participant RB as resolveBreadcrumbs
    participant RPI as resolveBreadcrumbsFromPathInfo
    participant BD as buildBreadcrumbsFromDirectory
    participant DP as getDirectoryParents
    participant SD as StreamDocument

    BC->>RB: resolveBreadcrumbs(streamDocument)
    
    RB->>RPI: Strategy 1: resolveBreadcrumbsFromPathInfo
    activate RPI
    RPI->>SD: Read breadcrumbPrefix from pathInfo
    RPI->>SD: Read directoryParents array
    alt Valid breadcrumbPrefix and directoryParents
        RPI->>RPI: Build breadcrumbs with locale prefix
        RPI-->>RB: Return BreadcrumbLink[]
    else Missing data
        RPI-->>RB: Return undefined
    end
    deactivate RPI
    
    alt Non-empty breadcrumbs from pathInfo
        RB-->>BC: Return breadcrumbs
    else Empty or undefined
        RB->>BD: Strategy 2: buildBreadcrumbsFromDirectory
        activate BD
        BD->>DP: getDirectoryParents(streamDocument)
        DP-->>BD: Return parent array
        alt Valid parents found
            BD->>BD: Build breadcrumbs from parents + document name
            BD-->>RB: Return BreadcrumbLink[]
        else No parents
            BD-->>RB: Return undefined
        end
        deactivate BD
        RB-->>BC: Return breadcrumbs or empty array
    end

Possibly related PRs

feat: add breadcrumbs and reviews schema #843: Directly overlaps with this PR as it modifies the same breadcrumb-resolution codepaths by replacing getDirectoryParents usage in Breadcrumbs.tsx with the new resolveBreadcrumbs flow.
feat: remove empty values from schema #850: Related through modifications and relocation of directory-parents and breadcrumb-building utilities that both PRs interact with.
feat: adjust url logic and fallbacks #998: Connected through modifications to PathInfoShape and breadcrumb/pathInfo handling; previous PR introduced breadcrumbTemplates which this PR renames to breadcrumbPrefix.

Suggested reviewers

mkilpatrick
benlife5
asanehisa

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main change: transitioning breadcrumb generation to use the new pathInfo.breadcrumbPrefix field.
Description check	✅ Passed	The description is directly related to the changeset, explaining that breadcrumbs now use pathInfo.breadcrumbPrefix as a prefix for directory parent slugs.
Merge Conflict Detection	✅ Passed	✅ No merge conflicts detected when merging into `main`

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ 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 breadcrumbs-url-templates

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

coderabbitai

Actionable comments posted: 1

🤖 Fix all issues with AI agents

In `@packages/visual-editor/src/utils/urls/resolveBreadcrumbsFromPathInfo.ts`:
- Line 77: The final crumb push in resolveBreadcrumbsFromPathInfo.ts currently
always appends { name: streamDocument.name ?? "", slug: "" } which can produce
an empty breadcrumb label; change this to either skip pushing when
streamDocument.name is falsy (check streamDocument.name before crumbs.push) or
provide a fallback label (e.g., use a defaultTitle or derive from path) so the
breadcrumb list never contains an empty name—align behavior with the filtering
used in resolveBreadcrumbs.ts by applying the same truthy-name check or fallback
logic when adding the final crumb.

🧹 Nitpick comments (5)

packages/visual-editor/src/utils/resolveYextEntityField.ts (1)
1-1: Prefer import type since YextEntityField is only used as a type here.

YextEntityField appears solely in type positions (lines 7 and 57). Switching from import type to a value import means the module won't be elided by TypeScript, which can matter under verbatimModuleSyntax. Consider keeping the type-only import:
Suggested fix
-import { YextEntityField } from "../editor/YextEntityFieldSelector.tsx";
+import type { YextEntityField } from "../editor/YextEntityFieldSelector.tsx";
packages/visual-editor/src/utils/urls/resolveBreadcrumbsFromPathInfo.ts (2)

22-25: Locale requirement is undocumented and may surprise callers.

The function silently returns undefined when locale is missing. The JSDoc (lines 10-13) only mentions breadcrumbPrefix and dm_directoryParents_* as prerequisites but doesn't mention locale is also required. Consider adding locale to the doc, or logging a warning, so debugging is easier when breadcrumbs unexpectedly disappear.

35-42: Dynamic field lookup is pragmatic but fragile if multiple dm_directoryParents_* keys exist.

Object.entries(...).find(...) returns the first match. If a document ever contains more than one dm_directoryParents_* field (e.g., from multiple entity types), the selected one is nondeterministic due to object key ordering. This is likely fine for current usage, but worth a brief comment noting the assumption of a single match.
packages/visual-editor/src/utils/urls/resolveBreadcrumbs.ts (1)
17-31: Silent error swallowing in the catch block.

The bare catch discards all errors, including unexpected ones (e.g., TypeError from a bug). Consider logging at debug/warn level so issues don't silently vanish during development.
💡 Suggestion
     } catch {
-      // continue to next resolver
+      // continue to next resolver
+      // Consider: console.warn("Breadcrumb resolver failed", e);
     }
packages/visual-editor/src/utils/urls/resolveBreadcrumbsFromPathInfo.test.ts (1)

29-76: Good core coverage; consider adding edge-case tests.

The three scenarios (primary locale, non-primary locale, empty prefix) cover the main paths well. Missing coverage for:

breadcrumbPrefix being undefined (expected: returns undefined)

Missing locale (expected: returns undefined)

includeLocalePrefixForPrimaryLocale: true with the primary locale

Directory parents with missing/malformed entries

These are optional additions for robustness but not blocking.

packages/visual-editor/src/utils/urls/resolveBreadcrumbsFromPathInfo.ts

asanehisa · 2026-02-13T17:40:47Z

packages/visual-editor/src/utils/urls/resolveBreadcrumbs.test.ts

+});
+
+describe("resolveBreadcrumbs", () => {
+  it("prefers pathInfo breadcrumbs over directory parents", () => {


interesting wording, more like uses pathInfo breadcrumbsPrefix if exists?

asanehisa · 2026-02-13T17:43:49Z

packages/visual-editor/src/utils/urls/resolveBreadcrumbsFromPathInfo.ts

+    .replace(/\/+/g, "/")
+    .replace(/^\/+|\/+$/g, "");
+
+  const directoryParentsEntry = Object.entries(streamDocument).find(


Can this use the same getDirectoryParents as the other function?

asanehisa · 2026-02-13T17:44:18Z

packages/visual-editor/src/utils/resolveYextEntityField.ts

@@ -1,4 +1,4 @@
-import { type YextEntityField } from "../editor/YextEntityFieldSelector.tsx";
+import { YextEntityField } from "../editor/YextEntityFieldSelector.tsx";


any reason for this?

mkilpatrick · 2026-02-13T17:35:47Z

packages/visual-editor/src/utils/urls/resolveBreadcrumbs.ts

+  return [];
+};
+
+const buildBreadcrumbsFromDirectory = (


Why is this one in this file but resolveBreadcrumbsFromPathInfo in its own file?

mkilpatrick · 2026-02-13T17:38:21Z

packages/visual-editor/src/utils/urls/resolveBreadcrumbs.ts

+) => BreadcrumbLink[] | undefined;
+
+const resolvers: BreadcrumbResolver[] = [
+  (streamDocument) => resolveBreadcrumbsFromPathInfo(streamDocument),


One is called resolve and one is called build. Should we keep it consistent?

mkilpatrick · 2026-02-13T17:39:17Z

packages/visual-editor/src/utils/urls/resolveBreadcrumbsFromPathInfo.ts

+): BreadcrumbLink[] | undefined => {
+  const breadcrumbPrefix = streamDocument.__?.pathInfo?.breadcrumbPrefix;
+  if (typeof breadcrumbPrefix !== "string") {
+    return undefined;


You can just return (without undefined)

mkilpatrick · 2026-02-13T17:41:30Z

packages/visual-editor/src/utils/urls/resolveBreadcrumbsFromPathInfo.ts

+    return undefined;
+  }
+
+  const includeLocalePrefix =


I don't think we want to do the same locale prefix logic. It depends on if Spruce has changed the DM config to have the same urlTemplate across all slug values of the DM or if they have the normal DM config to handle locale.

mkilpatrick · 2026-02-13T17:45:10Z

packages/visual-editor/src/utils/urls/resolveBreadcrumbsFromPathInfo.ts

+    .replace(/\/+/g, "/")
+    .replace(/^\/+|\/+$/g, "");
+
+  const directoryParentsEntry = Object.entries(streamDocument).find(


Can't you just call getDirectoryParents, iterate through it, and apply the prefix?

feat: use breadcrumbTemplates for breadcrumb urls

729bfd4

briantstephan self-assigned this Jan 28, 2026

briantstephan added the create-dev-release Triggers dev release workflow label Jan 28, 2026

github-actions bot and others added 20 commits January 28, 2026 22:06

Update component screenshots for visual-editor

b1e02e9

add logging

739b872

Merge branch 'breadcrumbs-url-templates' of https://github.com/yext/v…

94e1f3c

…isual-editor into breadcrumbs-url-templates

fixed conflicts

12ecd47

fixed build

f67ebf8

fix breadcrumbs labels

0e0b558

updated test

7ef8406

updated tests

74874ef

fix tests

98fcb28

updated imports

3bc6161

updated to use breadcrumbPrefix

91b3ac1

Update component screenshots for visual-editor

c118129

Merge branch 'main' into breadcrumbs-url-templates

320cb45

fixed conflicts

99deab4

Update component screenshots for visual-editor

d836dc8

Update component screenshots for visual-editor

8eed9e2

Update component screenshots for visual-editor

3baad99

Update component screenshots for visual-editor

c2bc029

remove streamDocument name fallback

efa4de5

Merge branch 'breadcrumbs-url-templates' of https://github.com/yext/v…

42d5146

…isual-editor into breadcrumbs-url-templates

briantstephan changed the title ~~feat: use breadcrumbTemplates for breadcrumb urls~~ feat: use breadcrumbPrefix for breadcrumb urls Feb 13, 2026

briantstephan marked this pull request as ready for review February 13, 2026 17:28

briantstephan requested review from asanehisa, benlife5 and mkilpatrick February 13, 2026 17:28

briantstephan requested a review from jwartofsky-yext February 13, 2026 17:28

Update component screenshots for visual-editor

55a8b96

Update component screenshots for visual-editor

3ce2e6b

coderabbitai bot reviewed Feb 13, 2026

View reviewed changes

packages/visual-editor/src/utils/urls/resolveBreadcrumbsFromPathInfo.ts Show resolved Hide resolved

asanehisa approved these changes Feb 13, 2026

View reviewed changes

mkilpatrick reviewed Feb 13, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: use breadcrumbPrefix for breadcrumb urls#1006

feat: use breadcrumbPrefix for breadcrumb urls#1006
briantstephan wants to merge 23 commits intomainfrom
breadcrumbs-url-templates

briantstephan commented Jan 28, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Jan 28, 2026

Uh oh!

pkg-pr-new bot commented Jan 28, 2026 •

edited

Loading

Uh oh!

coderabbitai bot commented Feb 13, 2026 •

edited

Loading

Uh oh!

coderabbitai bot left a comment

Uh oh!

Uh oh!

asanehisa Feb 13, 2026

Uh oh!

asanehisa Feb 13, 2026

Uh oh!

asanehisa Feb 13, 2026

Uh oh!

mkilpatrick Feb 13, 2026

Uh oh!

mkilpatrick Feb 13, 2026

Uh oh!

mkilpatrick Feb 13, 2026

Uh oh!

mkilpatrick Feb 13, 2026

Uh oh!

mkilpatrick Feb 13, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

		@@ -1,4 +1,4 @@
		import { type YextEntityField } from "../editor/YextEntityFieldSelector.tsx";
		import { YextEntityField } from "../editor/YextEntityFieldSelector.tsx";

Conversation

briantstephan commented Jan 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jan 28, 2026

Uh oh!

pkg-pr-new bot commented Jan 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai bot commented Feb 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Sequence Diagram

Possibly related PRs

Suggested reviewers

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

briantstephan commented Jan 28, 2026 •

edited

Loading

pkg-pr-new bot commented Jan 28, 2026 •

edited

Loading

coderabbitai bot commented Feb 13, 2026 •

edited

Loading