feat(content-preview): forward clientName prop to Preview options

[ahorowitz123]

Summary

Accepts a new optional clientName prop on <ContentPreview> and threads it into previewOptions so the underlying box-content-preview library can tag emitted preview_metric / preview_error events with the host application name. Lets monitoring dashboards split traffic by host (EUA vs preview-client).

This is a Phase 2 follow-up to #4542 which added the four other monitoring-dimension props (accessPattern, previewMode, sharedLinkAuth, preloadStatus). Same forwarding pattern, just one more prop.

Why

EUA and preview-client both render <ContentPreview>. Without clientName, the underlying preview library can't distinguish which app called it. This unblocks "EUA vs preview-client" panels in the Preview Performance Monitoring dashboards

Implementation

• src/elements/content-preview/ContentPreview.js:
  • Added clientName?: string to the Props type
  • Destructured clientName in loadPreview
  • Passed it through to previewOptions alongside the existing four monitoring dimensions
• src/elements/content-preview/__tests__/ContentPreview.test.js: extended the existing monitoring-dimensions tests to cover clientName (forwarded when supplied, undefined when omitted)

Test plan

• Unit test: clientName forwards to preview.show() options when supplied — passes
• Unit test: option is undefined when prop omitted — passes
• Full ContentPreview test suite passes (149 tests)
• ESLint clean on touched files
• No changes to existing behavior when host omits the prop

🤖 Generated with Claude Code

Summary by CodeRabbit

Release Notes

• New Features

  • ContentPreview accepts an optional client name parameter to include host-supplied monitoring info in previews.

• Tests

  • Unit tests updated to verify the client name is forwarded when provided and omitted when not supplied.

[coderabbitai]

Walkthrough

The PR adds an optional clientName prop to ContentPreview and forwards it into the previewOptions passed to Box.Preview().show() during initialization. Unit tests are updated to assert the prop is forwarded when present and undefined when omitted.

Changes

Add clientName monitoring dimension to ContentPreview

Layer / File(s)	Summary
Add clientName prop and forward to preview options src/elements/content-preview/ContentPreview.js, src/elements/content-preview/__tests__/ContentPreview.test.js	Props type gains optional clientName?: string field; loadPreview destructures and forwards clientName into previewOptions passed to Box.Preview().show(); tests verify the prop is included in preview options when provided and undefined when omitted.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Possibly related PRs

• box/box-ui-elements#4542: Adds clientName as a monitoring dimension to preview options in loadPreview, directly aligned with this PR's prop forwarding pattern.
• box/box-ui-elements#4452: Modifies preview initialization timing for loadPreview/preview.show, intersecting with this PR's changes to preview options.

Suggested labels

ready-to-merge

Suggested reviewers

• jackiejou
• jmcbgaston

Poem

🐰 Through props and options the client name hops in,
Carried to preview where monitoring begins.
Tests nod and check each pathway and bend,
A tiny prop journey, from start to end.
✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately and concisely describes the main change: adding a clientName prop and forwarding it to Preview options.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
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.
Description check	✅ Passed	The PR description comprehensively covers all required sections: summary, rationale, implementation details, and test plan with verification checkmarks.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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.}

[mergify]

Merge Queue Status

• ✅ Entered queue — 2026-05-22 19:24 UTC · Rule: Automatic strict merge
• ✅ Checks passed · in-place
• ✅ Merged — 2026-05-22 19:37 UTC · at 1fbdb458239e4a2642651f6e704572dd71b1e008 · squash

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

Required conditions to merge

• #approved-reviews-by >= 1 [🛡 GitHub branch protection]
  • feat(content-preview): forward clientName prop to Preview options #4586
• #changes-requested-reviews-by = 0 [🛡 GitHub branch protection]
  • feat(content-preview): forward clientName prop to Preview options #4586
• #review-threads-unresolved = 0 [🛡 GitHub branch protection]
  • feat(content-preview): forward clientName prop to Preview options #4586
• github-review-decision = APPROVED [🛡 GitHub branch protection]
  • feat(content-preview): forward clientName prop to Preview options #4586
• 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