Skip to content

🎨 Palette: Enhance keyboard discoverability and video interactions#201

Merged
ruhdevops merged 2 commits into
mainfrom
palette-ux-shortcuts-11657743881649904183
Jun 10, 2026
Merged

🎨 Palette: Enhance keyboard discoverability and video interactions#201
ruhdevops merged 2 commits into
mainfrom
palette-ux-shortcuts-11657743881649904183

Conversation

@ruhdevops

Copy link
Copy Markdown
Owner

This PR adds a new micro-UX enhancement focused on keyboard efficiency and discoverability.

💡 What:

  • Added a global B keyboard shortcut to toggle the 'Watch Later' state of the currently playing video.
  • Updated UI tooltips (title attribute) for:
    • Theme Toggle button: "Toggle Theme (T)"
    • Modal Save button: "Save (B)"

🎯 Why:

Users often want to quickly save a video they are watching without moving their mouse. Adding a standard shortcut and making existing ones discoverable via tooltips reduces friction and improves the "premium" feel of the archive.

♿ Accessibility:

  • Keyboard shortcuts are now explicitly mentioned in tooltips, aiding users who rely on keyboard navigation.
  • All interactive elements remain screen-reader accessible with existing aria-label attributes.

✅ Verification:

  • Verified that B key triggers toggleWatchLater in js/app.js.
  • Verified HTML attribute updates in index.html.
  • All 100 unit tests passed via pnpm test:run.
  • Acknowledged pre-existing build failures in js/app.js unrelated to these changes.

PR created automatically by Jules for task 11657743881649904183 started by @ruhdevops

Implemented 'B' keyboard shortcut to toggle 'Watch Later' status for the active video modal.
Updated 'title' attributes for the Theme Toggle and Modal Save button to include keyboard shortcut hints ('T' and 'B' respectively).
This improves power-user efficiency and accessibility through better feature discoverability.

Co-authored-by: ruhdevops <203426218+ruhdevops@users.noreply.github.com>
@google-labs-jules

Copy link
Copy Markdown
Contributor

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request.

When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down.

I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job!

For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

New to Jules? Learn more at jules.google/docs.


For security, I will only act on instructions from the user who triggered this task.

@vercel

vercel Bot commented Jun 4, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
yt-studio Error Error Jun 4, 2026 4:57am
yt-studio-production Error Error Jun 4, 2026 4:57am

@bolt-new-by-stackblitz

Copy link
Copy Markdown

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Jun 4, 2026

Copy link
Copy Markdown
Contributor

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Updated (UTC)
❌ Deployment failed
View logs
ytstudio d0f7cca Jun 04 2026, 04:58 AM

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Jun 4, 2026

Copy link
Copy Markdown
Contributor

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Updated (UTC)
❌ Deployment failed
View logs
ytstudio d0f7cca Jun 04 2026, 04:58 AM

@netlify

netlify Bot commented Jun 4, 2026

Copy link
Copy Markdown

Deploy Preview for ytr-studio failed.

Name Link
🔨 Latest commit d0f7cca
🔍 Latest deploy log https://app.netlify.com/projects/ytr-studio/deploys/6a2105c427d07f0008db95a8

@netlify

netlify Bot commented Jun 4, 2026

Copy link
Copy Markdown

Deploy Preview for elegant-seahorse-d9d460 ready!

Name Link
🔨 Latest commit d0f7cca
🔍 Latest deploy log https://app.netlify.com/projects/elegant-seahorse-d9d460/deploys/6a2105c493f8110008cd4a5d
😎 Deploy Preview https://deploy-preview-201--elegant-seahorse-d9d460.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

- Added 'B' keyboard shortcut to toggle Watch Later status for active videos.
- Updated tooltips with keyboard shortcut hints for Theme Toggle (T) and Save (B).
- Improved search accessibility with explicit aria-label.
- Enhanced navbar reliability by targeting the full Watch Later button instead of just the badge.

Co-authored-by: ruhdevops <203426218+ruhdevops@users.noreply.github.com>
@ruhdevops ruhdevops marked this pull request as ready for review June 10, 2026 16:36
@ruhdevops ruhdevops merged commit 7dbca44 into main Jun 10, 2026
6 of 22 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant