Feature/keyboard shortcuts

[Daksh7785]

✨ feat: Interactive Keyboard Shortcuts for Rapid Admin Dashboard Navigation

Closes #640

---

🎯 Overview

This PR implements global keyboard shortcuts for the HELPDESK.AI dashboard, enabling support team leads, admins, and users to navigate rapidly between major modules without touching the mouse — inspired by Gmail-style hotkey sequences.

---

🛠️ What's Changed

1. Frontend/src/hooks/useKeyboardShortcuts.js (New File)

• Custom React hook that registers a global keydown listener on window
• Implements Gmail-style sequential key detection (G → key within 1 second)
• Role-aware routing — redirects to the correct path based on the logged-in user's role (admin, super_admin, master_admin, or standard user)
• Typing protection — shortcuts are automatically suppressed when the user is focused inside any <input>, <textarea>, or contentEditable element to prevent accidental navigation
• Cleans up event listeners on component unmount

2. Frontend/src/App.jsx (Modified)

• Imports and calls useKeyboardShortcuts() inside AppLayout
• Hook is active globally across all authenticated routes (user, admin, master admin portals)

3. Frontend/src/user/pages/Help.jsx (Modified)

• Adds a "Keyboard Shortcuts" sidebar card with a trigger button
• Adds a premium modal overlay listing all available shortcuts with styled <kbd> keycap indicators
• Modal is dismissible via the × button or the "Got it" button

---

⌨️ Available Shortcuts

Shortcut	Action	Role Routing
G → D	Go to Dashboard	Admin → /admin/dashboard · User → /dashboard
G → T	Go to Tickets	Admin → /admin/tickets · User → /my-tickets
G → H	Go to Help	All roles → /help
Ctrl + F / ⌘ F	Focus Search Input	Focuses & selects the nearest search field

---

✅ Testing

• Build passes with zero errors (vite build — 3660 modules transformed)
• G + D navigates correctly for admin and user roles
• G + T navigates correctly for admin and user roles
• G + H navigates to /help for all roles
• Ctrl + F focuses the visible search input without triggering browser native search
• Shortcuts are not triggered while typing inside form inputs or textareas
• Shortcuts modal renders and dismisses correctly on the Help page

[coderabbitai]

Warning

Review limit reached

@Daksh7785, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 20 minutes and 25 seconds. Learn how PR review limits work.

Your organization has run out of usage credits. Purchase more in the billing tab.

⌛ How to resolve this issue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available.

Please see our Fair Usage Limits Policy for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 894be811-accc-430a-ae23-d05275ee97a3

📥 Commits

Reviewing files that changed from the base of the PR and between da8faf2 and 27bab53.

⛔ Files ignored due to path filters (6)

• Frontend/package-lock.json is excluded by !**/package-lock.json
• MobileApp/assets/adaptive-icon.png is excluded by !**/*.png
• MobileApp/assets/icon.png is excluded by !**/*.png
• MobileApp/assets/logo_v1.png is excluded by !**/*.png
• MobileApp/assets/splash-icon.png is excluded by !**/*.png
• MobileApp/package-lock.json is excluded by !**/package-lock.json

📒 Files selected for processing (86)

• .easignore
• .github/workflows/hf_sync.yml
• .github/workflows/sync_to_hf.yml
• .gitignore
• Frontend/package.json
• Frontend/src/App.jsx
• Frontend/src/admin/components/SLABadge.jsx
• Frontend/src/admin/layout/AdminLayout.jsx
• Frontend/src/admin/pages/AdminDashboard.jsx
• Frontend/src/admin/pages/AdminTicketDetail.jsx
• Frontend/src/admin/pages/AdminTickets.jsx
• Frontend/src/components/shared/BackToTop.jsx
• Frontend/src/components/shared/BugReportWidget.jsx
• Frontend/src/components/shared/ProtectedRoute.jsx
• Frontend/src/components/shared/TicketChat.jsx
• Frontend/src/data/ticketTemplates.js
• Frontend/src/hooks/useKeyboardShortcuts.js
• Frontend/src/index.css
• Frontend/src/legacy_ui/Dashboard.jsx
• Frontend/src/master-admin/layout/MasterAdminLayout.jsx
• Frontend/src/pages/Changelog.jsx
• Frontend/src/pages/LandingPage.jsx
• Frontend/src/pages/Login.jsx
• Frontend/src/services/aiAssistant.js
• Frontend/src/services/api.js
• Frontend/src/store/authStore.js
• Frontend/src/user/components/QuickActions.jsx
• Frontend/src/user/components/TemplateForm.jsx
• Frontend/src/user/components/TemplateSelector.jsx
• Frontend/src/user/components/TopNav.jsx
• Frontend/src/user/pages/AIProcessing.jsx
• Frontend/src/user/pages/CreateTicket.jsx
• Frontend/src/user/pages/DuplicateDetection.jsx
• Frontend/src/user/pages/Help.jsx
• Frontend/src/user/pages/TicketTracking.jsx
• MobileApp/.easignore
• MobileApp/App.js
• MobileApp/app.json
• MobileApp/package.json
• MobileApp/src/components/NotificationProvider.js
• MobileApp/src/data/youtubeResources.js
• MobileApp/src/screens/admin/AdminDashboardScreen.js
• MobileApp/src/screens/admin/AdminSettingsScreen.js
• MobileApp/src/screens/admin/AdminTicketDetailScreen.js
• MobileApp/src/screens/admin/AdminTicketsScreen.js
• MobileApp/src/screens/admin/AdminUsersScreen.js
• MobileApp/src/screens/auth/LoginScreen.js
• MobileApp/src/screens/auth/OnboardingScreen.js
• MobileApp/src/screens/user/AIProcessingScreen.js
• MobileApp/src/screens/user/CreateTicketScreen.js
• MobileApp/src/screens/user/DashboardScreen.js
• MobileApp/src/screens/user/KnowledgeBaseScreen.js
• MobileApp/src/screens/user/NotificationsScreen.js
• MobileApp/src/screens/user/ProfileScreen.js
• MobileApp/src/screens/user/TicketDetailScreen.js
• PLATFORM_MAP.md
• README.md
• backend/auth/crypto.py
• backend/main.py
• backend/requirements.txt
• backend/services/classifier_service.py
• backend/services/duplicate_service.py
• backend/services/sla_service.py
• backend/services/spam_detector_service.py
• backend/tests/__init__.py
• backend/tests/test_crypto.py
• backend/tests/test_sla_service.py
• backend/tests/test_spam_detector.py
• deploy/monitoring/grafana_dashboard.json
• docs/handoff/01_project_overview.md
• docs/handoff/02_database_schema.md
• docs/handoff/03_backend_api.md
• docs/handoff/04_mobile_app.md
• docs/handoff/05_frontend_web.md
• docs/handoff/06_technical_debt_and_bugs.md
• docs/handoff/07_claude_code_transition_guide.md
• issue_tracker_state.json
• scripts/triage_issues_prs.py
• supabase/functions/email-notifier/index.ts
• supabase/functions/sla-breach-monitor/index.ts
• supabase/migrations/20260332000000_semantic_duplicate_detection.sql
• supabase/migrations/20260522000000_add_ticket_search_indexes.sql
• supabase/migrations/20260522080000_add_sla_escalation.sql
• supabase/migrations/20260531_add_company_settings.sql
• supabase/migrations/20260602000000_add_sla_escalations.sql
• templates/owner_reply.txt

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

[vercel]

@Daksh7785 is attempting to deploy a commit to the ritesh Team on Vercel.

A member of the Team first needs to authorize it.