Shorts playlist button

[keikari]

Summary by CodeRabbit

• New Features

  • Added a save-to-collection button in the shorts player actions with contextual "Save"/"Saved" labeling for quick collection adds.

• Bug Fixes / UI Improvements

  • Shorts pages use a compact description view: the More/Less toggle is hidden and description expansion initializes appropriately for shorts, improving readability and consistency.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

📝 Walkthrough

Walkthrough

Adds shorts-aware UI: a compact collection-add button for shorts pages; FileDescription gains an isShort prop to initialize/hide its expand toggle; shortsActions injects the ClaimCollectionAddButton into the shorts actions area; selector wiring provides isShort from redux.

Changes

Cohort / File(s)	Summary
Claim collection button ui/component/claimCollectionAddButton/view.jsx	Adds optional isShortsPage?: boolean prop, computes label ("Save"/"Saved"), and renders a compact FileActionButton + <p> label for shorts pages; still opens COLLECTION_ADD modal on click.
File description (props & behavior) ui/component/fileDescription/view.jsx, ui/component/fileDescription/index.js	Adds isShort: boolean prop (wired from selectIsShortForUri in index.js), initializes expanded from isShort, and hides the More/Less expansion control when isShort is true.
Shorts actions integration ui/component/shortsActions/view.jsx	Imports and inserts ClaimCollectionAddButton into the shorts actions block (passes uri and isShortsPage), adding the collection-add control to the shorts action menu.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

• Short player: Fit to content on desktop + some minor stuff #3394 — touches isShort/isShortsPage flow and the selectIsShortForUri selector logic; strongly related to short-detection wiring.

Poem

🐰 I nudged a button, quick and spry,
Shorts now sparkle in my eye,
Save or Saved — a tiny cheer,
Collections hop and appear,
Hooray for tiny UI delight! 🥕

🚥 Pre-merge checks | ✅ 1 | ❌ 2

❌ Failed checks (1 warning, 1 inconclusive)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.
Title check	❓ Inconclusive	The title 'Shorts playlist button' is partially related to the changeset but does not capture the main changes accurately.	The PR adds a 'Save to Collection' button for shorts content, not a 'playlist button'. Consider a more accurate title like 'Add Save to Collection button for shorts' to better reflect the actual changes.

✅ Passed checks (1 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

_{✏️ 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 shorts-playlist-button

---

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: 1

🤖 Fix all issues with AI agents

In `@ui/component/fileDescription/view.jsx`:
- Around line 32-35: The component seeds expanded with isShortsPage but never
updates when the location changes; add a React.useEffect that watches
isShortsPage (derived from useHistory().location.search) and calls
setExpanded(isShortsPage) to sync the state whenever the query changes so
expanded matches the current shorts view; update references: useHistory,
location, isShortsPage, expanded, setExpanded.