fix: added min-height for logo slot

[rkeerthient]

Ticket - OPAQF-57

• Added a min-height when there is no image in header logo.
• Updated test classes.

Screen.Recording.2026-01-02.at.5.21.16.PM.mov

[github-actions]

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.

[coderabbitai]

Walkthrough

The PR adds a test "version 50 props - no logo" for ExpandedHeader and updates PrimaryHeaderSlot to detect and propagate a new conditionalRender.hasLogoImage flag. resolveData inspects the LogoSlot for image data and sets hasLogoImage. The PrimaryHeaderSlot uses that flag to wrap the LogoSlot in a container that applies min-height: 100px when no logo image is present; otherwise the logo container height remains automatic. A new prop hasLogoImage?: boolean was added to PrimaryHeaderSlotProps.

Sequence Diagram(s)

sequenceDiagram
    participant Client as Client/Renderer
    participant Resolver as resolveData
    participant Primary as PrimaryHeaderSlot
    participant Logo as LogoSlot
    rect rgb(242,248,255)
      Note over Client,Resolver: Page render starts
    end
    Client->>Resolver: request resolved header data
    Resolver-->>Client: resolved data (includes slots)
    Client->>Primary: render with resolved data
    Primary->>Resolver: derive hasLogoImage from LogoSlot data
    Resolver-->>Primary: conditionalRender.hasLogoImage
    alt hasLogoImage == true
        Primary->>Logo: render LogoSlot (auto height)
        Logo-->>Primary: image rendered
    else hasLogoImage == false
        Primary->>Logo: render LogoSlot inside wrapper (min-height:100px)
        Logo-->>Primary: placeholder/empty rendered
    end
    Primary-->>Client: composed header DOM

Loading

Possibly related PRs

• feat: placeholder image for header/footer logo #949: Modifies PrimaryHeaderSlot.tsx (changes default LogoSlot image URL and aspectRatio), which is directly related to logo rendering and layout logic.

Suggested reviewers

• briantstephan
• asanehisa
• colton-demetriou

Pre-merge checks

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately summarizes the main change: adding min-height for the logo slot when no image is present.
Description check	✅ Passed	The description is directly related to the changeset, referencing the ticket, explaining the min-height fix, and mentioning test updates.

---

📜 Recent review details

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 20c270a and aca4a73.

📒 Files selected for processing (2)

• package.json
• starter/package.json

✅ Files skipped from review due to trivial changes (2)

• package.json
• starter/package.json

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)

• GitHub Check: call_unit_test / unit_tests (24.x)
• GitHub Check: call_unit_test / unit_tests (22.x)
• GitHub Check: call_unit_test / unit_tests (20.x)
• GitHub Check: semgrep/ci

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[coderabbitai]

Actionable comments posted: 2

📜 Review details

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 2c4682d and d9b0191.

⛔ Files ignored due to path filters (29)

• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] default props.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] version 10 props - secondary header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] version 10 props.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] version 11 props - secondary header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] version 15 props - fixed header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] version 15 props - sticky header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] version 20 props.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] version 41 props - no secondary header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] version 41 props - with secondary header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] version 48 props.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[desktop] version 50 props - no logo.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[mobile] default props (after interactions).png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[mobile] version 10 props (after interactions).png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[mobile] version 10 props - secondary header (after interactions).png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[mobile] version 11 props - secondary header (after interactions).png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[mobile] version 15 props - fixed header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[mobile] version 15 props - sticky header (after interactions).png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[mobile] version 20 props.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[mobile] version 50 props - no logo.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[tablet] default props.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[tablet] version 10 props - secondary header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[tablet] version 11 props - secondary header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[tablet] version 15 props - fixed header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[tablet] version 15 props - sticky header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[tablet] version 20 props.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[tablet] version 41 props - no secondary header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[tablet] version 41 props - with secondary header.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[tablet] version 48 props.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**
• packages/visual-editor/src/components/testing/screenshots/ExpandedHeader/[tablet] version 50 props - no logo.png is excluded by !**/*.png, !packages/visual-editor/src/components/testing/screenshots/**

📒 Files selected for processing (2)

• packages/visual-editor/src/components/header/ExpandedHeader.test.tsx
• packages/visual-editor/src/components/header/PrimaryHeaderSlot.tsx

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)

• GitHub Check: call_unit_test / unit_tests (24.x)
• GitHub Check: call_unit_test / unit_tests (22.x)
• GitHub Check: call_unit_test / unit_tests (20.x)
• GitHub Check: semgrep/ci

🔇 Additional comments (2)

packages/visual-editor/src/components/header/PrimaryHeaderSlot.tsx (1)

110-118: Verify the logic after refactoring the image detection.

The wrapper structure and conditional minHeight logic align with the PR objectives. However, the effectiveness depends on correctly detecting image presence. Once the image detection approach is refactored (see comments on lines 91-92 and 97-105), verify that:

1. The 100px minHeight is applied only when LogoSlot is empty or contains no image.
2. No layout shift occurs during the initial render.

packages/visual-editor/src/components/header/ExpandedHeader.test.tsx (1)

943-1088: LGTM! Test case properly covers the no-logo scenario.

The new test case follows the established pattern of existing version tests and correctly validates the header behavior when LogoSlot is empty (line 960). This should exercise the conditional minHeight logic added in PrimaryHeaderSlot.tsx and ensure consistent spacing when no logo is present.