Skip to content

🎨 Palette: Add Watch Later shortcut and discoverability hints#202

Draft
ruhdevops wants to merge 3 commits into
mainfrom
palette-watch-later-shortcut-13753985726831852616
Draft

🎨 Palette: Add Watch Later shortcut and discoverability hints#202
ruhdevops wants to merge 3 commits into
mainfrom
palette-watch-later-shortcut-13753985726831852616

Conversation

@ruhdevops
Copy link
Copy Markdown
Owner

This micro-UX improvement enhances the accessibility and power-user experience of the Ruh Al Tarikh archive.

💡 What:

  • Added a new keyboard shortcut: B toggles the Watch Later status of a video if the modal is open, or toggles the Watch Later panel if no video is active.
  • Enhanced tooltips: Added (B) and (T) hints to the "Watch Later" and "Toggle Theme" buttons in the navbar and modal.
  • Improved video card accessibility: Added descriptive title attributes to the Watch Later bookmark icons on all video cards.

🎯 Why:

  • Power users benefit from keyboard shortcuts for frequent actions like saving videos or switching themes.
  • Tooltip hints improve the discoverability of these shortcuts, which were previously hidden.
  • Icon-only buttons on cards lacked visual tooltips for mouse users, which is now resolved.

♿ Accessibility:

  • Added title attributes to complement existing aria-label attributes on icon-only buttons, providing both screen reader context and visual tooltips.
  • Implemented a focus-check guard in the global keydown listener to prevent shortcut collisions while typing in search or other input fields.
  • Verified focus trapping and keyboard navigation flow remains intact.

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

- Implement 'B' keyboard shortcut to toggle Watch Later status for active videos or toggle the Watch Later panel.
- Add discoverability hints to tooltips for Watch Later (B) and Theme (T) buttons.
- Ensure keyboard shortcuts are disabled when typing in input/textarea elements to avoid collisions.
- Improve accessibility by adding title attributes to icon-only buttons in video cards.

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
Copy link
Copy Markdown

vercel Bot commented Jun 6, 2026

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

Project Deployment Actions Updated (UTC)
yt-studio Error Error Jun 6, 2026 2:17am
yt-studio-production Error Error Jun 6, 2026 2:17am

@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
Copy link
Copy Markdown
Contributor

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

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 8334621 Jun 06 2026, 02:17 AM

@cloudflare-workers-and-pages
Copy link
Copy Markdown
Contributor

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

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 8334621 Jun 06 2026, 02:18 AM

@netlify
Copy link
Copy Markdown

netlify Bot commented Jun 6, 2026

Deploy Preview for ytr-studio failed.

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

@netlify
Copy link
Copy Markdown

netlify Bot commented Jun 6, 2026

Deploy Preview for elegant-seahorse-d9d460 ready!

Name Link
🔨 Latest commit 8334621
🔍 Latest deploy log https://app.netlify.com/projects/elegant-seahorse-d9d460/deploys/6a238325fc52c60008e2edb4
😎 Deploy Preview https://deploy-preview-202--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.

- Implement 'B' keyboard shortcut to toggle Watch Later status for active videos or toggle the Watch Later panel.
- Add discoverability hints to tooltips for Watch Later (B) and Theme (T) buttons.
- Ensure keyboard shortcuts are disabled when typing in input/textarea elements to avoid collisions.
- Improve accessibility by adding title attributes to icon-only buttons in video cards.

Note: Pre-existing build failures in js/app.js due to a truncated minified artifact on line 1 are acknowledged and left untouched per UX agent directives.

Co-authored-by: ruhdevops <203426218+ruhdevops@users.noreply.github.com>
- Implement 'B' keyboard shortcut to toggle Watch Later status or panel.
- Add discoverability hints (B) and (T) to tooltips.
- Add title attributes to video card bookmark buttons for better UX/a11y.
- Fix pre-existing syntax error in js/app.js by removing truncated minified artifact on line 1.
- Ensure keyboard shortcuts are disabled when typing in inputs.

Co-authored-by: ruhdevops <203426218+ruhdevops@users.noreply.github.com>
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