Skip to content

feat(preview): Update the comparison banner on a live preview - #4907

Merged
mergify[bot] merged 2 commits into
box:masterfrom
zhirongwang:comparison-banner-live-update
Oct 22, 2026
Merged

mergify[bot] merged 2 commits into
box:masterfrom
zhirongwang:comparison-banner-live-update

Conversation

@zhirongwang

@zhirongwang zhirongwang commented Oct 19, 2026 •

Copy link
Copy Markdown
Contributor

Summary

  • Push a changed comparisonBanner into an already-shown Box Content Preview instead of requiring a reload. ContentPreview sets preview.options.comparisonBanner and calls preview.updateComparisonBanner(). It does nothing when the preview is about to reload anyway, or when Box Content Preview has no updateComparisonBanner.
  • comparisonBanner already reaches Box Content Preview at first load, because unknown props are spread into the preview options. A host that learns the banner's contents later (for example, which version actions apply once it has fetched the compared version's permissions) had no way to update it.
  • Add the comparisonBanner prop type.

preview-client uses this to give the Make Current, Download, and Delete handlers to non-markdown comparison panes (PDF, HTML) without depending on the versions sidebar being open.

Test plan

  • Compare two versions of a PDF in a host that sets comparisonBanner after load and confirm the banner menu updates without the preview reloading.
  • Clear comparisonBanner and confirm the banner menu items go away.
  • Confirm a preview with no comparisonBanner behaves as before.
  • yarn test src/elements/content-preview/__tests__/ContentPreview.test.js

Summary by CodeRabbit

  • New Features

    • Preview banners now update in place when their content changes, without reloading the preview. Clearing a banner removes it from the preview.
  • Tests

    • Added coverage for banner updates, clearing banners, and cases where an in-place update is unavailable.

A host can change comparisonBanner after the preview has loaded, for
example once the compared version's actions are known. Push the new
value to Box Content Preview instead of reloading.
@zhirongwang
zhirongwang requested review from a team as code owners October 19, 2026 19:08
@coderabbitai

coderabbitai Bot commented Oct 19, 2026 •

Copy link
Copy Markdown
Contributor

Review in Change Stack →

Important

Review skipped

Review was skipped as selected files did not have any reviewable changes.

⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: d40223a8-f023-4e45-90b5-793070d40da0
📥 Commits

Reviewing files that changed from the base of the PR and between 71a549c and c69c3f3.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: ed6af7ab-ec71-4e68-8202-770c1c95af74
📥 Commits

Reviewing files that changed from the base of the PR and between 6309491 and 71a549c.

📒 Files selected for processing: 2
  • src/elements/content-preview/ContentPreview.js
  • src/elements/content-preview/__tests__/ContentPreview.test.js

Included review availability: This review used your included allowance. Your plan provides up to 4 included reviews per hour; 3 remain after this review.

Walkthrough

ContentPreview accepts an optional comparisonBanner prop. When it changes and the preview can update without reloading, the component stores the banner in preview options and calls updateComparisonBanner. Tests cover update and skip conditions.

Changes

Comparison banner synchronization

Layer / File(s) Summary
Live preview banner synchronization
src/elements/content-preview/ContentPreview.js, src/elements/content-preview/__tests__/ContentPreview.test.js
ContentPreview updates the live preview when the banner changes and the preview does not need to reload. Tests cover clearing the banner and conditions that skip the update.

Priority: ➖ Normal

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Feature

Suggested reviewers: ahorowitz123

Merge Risk: ⚪ Minimal · up to 71a54

This adds an optional way to update the comparison banner on a live preview without reloading. Behavior is unchanged when no banner is supplied, and I found no merge-blocking risk.

Pre-merge checks: Passed 5
Check name Status Explanation
Title check Passed The title clearly and concisely describes the main change: updating the comparison banner on a live preview.
Description check Passed The description includes a clear summary and a relevant test plan. It explains the behavior, use case, and test command. The listed checks are marked as planned rather than completed, but the descript…
Docstring Coverage Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 2…
Linked Issues check Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check Passed Check skipped because no linked issues were found for this pull request.
Full details: Description check

Explanation

The description includes a clear summary and a relevant test plan. It explains the behavior, use case, and test command. The listed checks are marked as planned rather than completed, but the description is otherwise complete.

Full details: Docstring Coverage

Explanation

No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 2 files.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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

A rabbit watched the banner glow
It changed, and onward updates flow
If reloads call, it waits instead
An empty shape appears when cleared
The preview keeps its options neat
Then hops away on quiet feet

Comment @coderabbitai help to get the list of available commands.

@zhirongwang zhirongwang self-assigned this Oct 21, 2026
@mergify mergify Bot added the queued label Oct 22, 2026
@mergify

mergify Bot commented Oct 22, 2026 •

Copy link
Copy Markdown
Contributor

Merge Queue Status

  • ✅ Entered queue — 2026-10-22 00:27 UTC · Rule: Automatic strict merge · triggered by rule Automatic merge queue
  • ✅ Checks passed · in-place
  • ✅ Merged — 2026-10-22 00:38 UTC · at a0ac01ff2f726baa7bec1f4c7301a627f65d8d0d · squash

This pull request spent 11 minutes 4 seconds in the queue, including 10 minutes 12 seconds running CI.

Required conditions to merge
  • github-review-approved [🛡 GitHub branch protection]
  • any of [🛡 GitHub branch protection]:
    • check-success = Summary
    • check-neutral = Summary
    • check-skipped = Summary
  • any of [🛡 GitHub branch protection]:
    • check-success = lint_test_build
    • check-neutral = lint_test_build
    • check-skipped = lint_test_build
  • any of [🛡 GitHub branch protection]:
    • check-success = license/cla
    • check-neutral = license/cla
    • check-skipped = license/cla
  • any of [🛡 GitHub branch protection]:
    • check-success = lint_pull_request
    • check-neutral = lint_pull_request
    • check-skipped = lint_pull_request

@mergify
mergify Bot merged commit a0ac01f into box:master Oct 22, 2026
9 of 10 checks passed
@mergify mergify Bot removed the queued label Oct 22, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants