# Redesigned Mail Categories with Label-Based Filtering
## Description
Reimplemented the mail categories feature to use label-based filtering instead of search queries. This change makes it easier for users to customize and manage their inbox views by selecting specific labels rather than writing complex search queries.
The PR enables the categories settings page in the navigation and completely redesigns the UI to focus on label selection. Users can now add, delete, reorder, and set default categories with a more intuitive interface.
## Type of Change
- ✨ New feature (non-breaking change which adds functionality)
- 🎨 UI/UX improvement
## Areas Affected
- [x] User Interface/Experience
- [x] Data Storage/Management
## Testing Done
- [x] Manual testing performed
## Checklist
- [x] I have performed a self-review of my code
- [x] My changes generate no new warnings
- [x] My code follows the project's style guidelines
## Additional Notes
The PR also includes improvements to the thread querying logic in the backend to better support label-based filtering. The categories feature is now called "Views" in the UI to better reflect its purpose.
---
_By submitting this pull request, I confirm that my contribution is made under the terms of the project's license._
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
* **New Features**
* Categories settings page is now accessible from navigation.
* Categories (now called "Views") can be managed with multi-select label filters, drag-and-drop reordering, add/delete actions, and unsaved changes tracking.
* Save and reset options are available for category changes.
* **Improvements**
* Category selection supports multi-label filtering with a dropdown menu.
* UI styling updated for better dark mode support and usability.
* Localization updated to rename "Categories" to "Views".
* Navigation and mail list no longer use category query parameters, simplifying URL handling.
* **Bug Fixes**
* Removed unused and AI-related code for category search queries.
* **Chores**
* Added a pre-commit script to enforce linting before commits.
* Refactored internal logic for category and thread management for better maintainability.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
# Keyboard Layout Detection and Mapping for Shortcuts
## Description
Added keyboard layout detection and mapping to ensure keyboard shortcuts work correctly across different keyboard layouts. The implementation supports QWERTY, Dvorak, Colemak, AZERTY, and QWERTZ layouts, with automatic detection based on browser APIs and fallback methods. Also added a keyboard layout indicator component to show the current detected layout in the UI.
## Type of Change
- ✨ New feature (non-breaking change which adds functionality)
- 🎨 UI/UX improvement
- ⚡ Performance improvement
## Areas Affected
- [x] User Interface/Experience
## Testing Done
- [x] Manual testing performed
- [x] Cross-browser testing (if UI changes)
## Checklist
- [x] I have performed a self-review of my code
- [x] I have commented my code, particularly in complex areas
- [x] My changes generate no new warnings
## Additional Notes
The implementation uses the KeyboardLayoutMap API when available, with fallbacks to language detection and predefined mappings. The keyboard layout indicator only appears when a non-QWERTY layout is detected.
Also includes some code quality improvements:
- Enhanced error handling in Gmail API interactions
- Simplified optimistic action refresh logic
- Improved rate limit handling on the server side
## Screenshots/Recordings
N/A
---
_By submitting this pull request, I confirm that my contribution is made under the terms of the project's license._
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
* **New Features**
* Added dynamic keyboard layout detection and mapping, supporting QWERTY, Dvorak, Colemak, Azerty, and QWERTZ.
* Introduced a keyboard layout indicator to display the current layout in the mail app.
* Enhanced keyboard shortcuts to display and map keys according to the detected keyboard layout.
* Added a utility to convert key names to keyboard event codes for consistent shortcut handling.
* **Refactor**
* Updated keyboard shortcut handling throughout the mail app to use layout-aware shortcuts.
* Simplified optimistic action refresh logic and removed unused parameters.
* Refactored internal retry logic for server-side Gmail API calls.
* Replaced promise handling with Effect abstractions in server thread label modifications.
* **Style**
* Cleaned up whitespace and reordered import statements in several components.
* **Chores**
* Added additional logging for debugging and removed unnecessary log statements.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Ran oxc (https://oxc.rs/docs/guide/usage/linter.html#vscode-extension) and fixed all the issues that came up, set it up to run as a PR check and added steps to the README.md asking users to use it.
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
* **New Features**
* Introduced JavaScript linting using oxlint in development guidelines and CI workflow for improved code quality.
* Added oxlint configuration and dependencies to the project.
* **Bug Fixes**
* Improved error logging in various components and utilities for better debugging.
* Enhanced React list rendering by updating keys to use unique values instead of array indices, reducing rendering issues.
* Replaced browser alerts with toast notifications for a smoother user experience.
* **Refactor**
* Simplified component logic and state management by removing unused code, imports, props, and components across multiple files.
* Updated function and component signatures for clarity and maintainability.
* Improved efficiency of certain operations by switching from arrays to sets for membership checks.
* **Chores**
* Cleaned up and reorganized import statements throughout the codebase.
* Removed deprecated files, components, and middleware to streamline the codebase.
* **Documentation**
* Updated contribution guidelines to include linting requirements for code submissions.
* **Style**
* Minor formatting and readability improvements in JSX and code structure.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
# Refactor Labels API Usage and Optimize Component Performance
## Description
This PR refactors how labels are accessed throughout the application by restructuring the `useLabels` hook to return `userLabels` and `systemLabels` separately. It also adds performance optimizations by memoizing component calculations and action handlers in the thread context menu. Additionally, it introduces a new category dropdown component for better label filtering and temporarily disables the categories settings page.
## Type of Change
- [x] 🐛 Bug fix (non-breaking change which fixes an issue)
- [x] ⚡ Performance improvement
## Areas Affected
- [x] User Interface/Experience
- [x] Data Storage/Management
## Testing Done
- [x] Manual testing performed
## Checklist
- [x] I have performed a self-review of my code
- [x] My changes generate no new warnings
- [x] All tests pass locally
## Additional Notes
The main changes include:
1. Restructured `useLabels` hook to separate user and system labels
2. Updated all components to use the new label structure
3. Added memoization to thread context menu actions and calculations
4. Implemented a new CategoryDropdown component for label filtering
5. Commented out the categories settings page route
6. Fixed spacing and alignment issues in the mail layout
# READ CAREFULLY THEN REMOVE
Remove bullet points that are not relevant.
PLEASE REFRAIN FROM USING AI TO WRITE YOUR CODE AND PR DESCRIPTION. IF YOU DO USE AI TO WRITE YOUR CODE PLEASE PROVIDE A DESCRIPTION AND REVIEW IT CAREFULLY. MAKE SURE YOU UNDERSTAND THE CODE YOU ARE SUBMITTING USING AI.
- Pull requests that do not follow these guidelines will be closed without review or comment.
- If you use AI to write your PR description your pr will be close without review or comment.
- If you are unsure about anything, feel free to ask for clarification.
## Description
Please provide a clear description of your changes.
---
## Type of Change
Please delete options that are not relevant.
- [ ] 🐛 Bug fix (non-breaking change which fixes an issue)
- [ ] ✨ New feature (non-breaking change which adds functionality)
- [ ] 💥 Breaking change (fix or feature with breaking changes)
- [ ] 📝 Documentation update
- [ ] 🎨 UI/UX improvement
- [ ] 🔒 Security enhancement
- [ ] ⚡ Performance improvement
## Areas Affected
Please check all that apply:
- [ ] Email Integration (Gmail, IMAP, etc.)
- [ ] User Interface/Experience
- [ ] Authentication/Authorization
- [ ] Data Storage/Management
- [ ] API Endpoints
- [ ] Documentation
- [ ] Testing Infrastructure
- [ ] Development Workflow
- [ ] Deployment/Infrastructure
## Testing Done
Describe the tests you've done:
- [ ] Unit tests added/updated
- [ ] Integration tests added/updated
- [ ] Manual testing performed
- [ ] Cross-browser testing (if UI changes)
- [ ] Mobile responsiveness verified (if UI changes)
## Security Considerations
For changes involving data or authentication:
- [ ] No sensitive data is exposed
- [ ] Authentication checks are in place
- [ ] Input validation is implemented
- [ ] Rate limiting is considered (if applicable)
## Checklist
- [ ] I have read the [CONTRIBUTING](https://github.com/Mail-0/Zero/blob/staging/.github/CONTRIBUTING.md) document
- [ ] My code follows the project's style guidelines
- [ ] I have performed a self-review of my code
- [ ] I have commented my code, particularly in complex areas
- [ ] I have updated the documentation
- [ ] My changes generate no new warnings
- [ ] I have added tests that prove my fix/feature works
- [ ] All tests pass locally
- [ ] Any dependent changes are merged and published
## Additional Notes
Add any other context about the pull request here.
## Screenshots/Recordings
Add screenshots or recordings here if applicable.
---
_By submitting this pull request, I confirm that my contribution is made under the terms of the project's license._
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
* **New Features**
* Introduced a new localization system replacing translation hooks with direct message function calls.
* Added localization project configuration and Inlang plugins for improved message formatting.
* **Bug Fixes**
* Enhanced pluralization handling across all supported languages for accurate message display.
* **Refactor**
* Unified translation and locale management across components by removing hook-based translations.
* Removed obsolete navigation and email signature settings pages.
* Simplified query and server provider logic, removing connection-specific and internationalization context code.
* Disabled server-side rendering in the mail app.
* Removed Cloudflare Worker request handler and related environment augmentations.
* **Chores**
* Updated dependencies and scripts, adding Inlang CLI and removing unused packages.
* Cleaned up configuration files including Vite, Wrangler, and i18n settings.
* Added `.gitignore` for localization cache.
* Updated static asset handling and environment configurations for Cloudflare deployments.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
# WIP
## Icon Styling and Keyboard Shortcut Improvements
### TL;DR
Improved icon styling and keyboard shortcuts for better user experience in the mail application.
### What changed?
- Fixed icon styling by changing `--icon-color` from `black` to `currentColor` for better theme compatibility
- Enhanced the ExclamationCircle icon appearance with conditional styling based on importance status
- Adjusted Star icon size for better visual consistency
- Moved mouse event handlers from mail-list to mail layout component for proper scope management
- Added Cmd+Z (Ctrl+Z) keyboard shortcut for undoing the last action
- Fixed OldPhone icon SVG formatting
- Implemented the undoLastAction handler in global hotkeys
### How to test?
1. Verify icon appearance in both light and dark themes
2. Check that the ExclamationCircle icon properly changes appearance when marking emails as important
3. Test the new Cmd+Z (Ctrl+Z) keyboard shortcut to undo actions
4. Confirm that keyboard shortcuts work correctly when hovering over the mail list
### Why make this change?
These changes improve the visual consistency of icons across themes and enhance the user experience by adding expected keyboard shortcuts like undo functionality. The refactoring of mouse event handlers ensures proper keyboard shortcut scope management when interacting with the mail list.
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Added global keyboard shortcut (Cmd/Ctrl + Z) to undo the last action in the mail app.
- **Enhancements**
- Improved icon appearance with dynamic color inheritance and updated important/flagged icon styling.
- Adjusted icon sizing for better consistency.
- Hotkey scope for the mail list is now enabled or disabled based on mouse hover over the mail list panel.
- **Style**
- Minor formatting improvements to icon components.
- **Bug Fixes**
- Ensured undo shortcut prevents default browser behavior.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
### TL;DR
Added a new voice assistant feature to the mail app using ElevenLabs integration.
### What changed?
- Created a new voice assistant page at `/mail/voice` with a complete UI for voice interactions
- Added a navigation item for the Voice Assistant under a new "AI & Tools" section
- Updated the ElevenLabs package from `@11labs/react` to `@elevenlabs/react` (version 0.1.5)
- Added localization support for the voice assistant feature
- Implemented email context loading to provide the assistant with recent email information
### How to test?
1. Navigate to `/mail/voice` in the mail app
2. Ensure you're logged in and have granted microphone permissions
3. Click "Start Conversation" to begin interacting with the voice assistant
4. Test the mute/unmute functionality during conversation
5. Verify that recent emails are properly loaded and provided as context
### Why make this change?
This change enhances the mail application with voice interaction capabilities, allowing users to interact with their email through natural language. The voice assistant can access recent emails for context, providing a hands-free way to manage email communications. This feature improves accessibility and offers an alternative interface for users who prefer voice commands over traditional input methods.
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Introduced a voice assistant feature, including a VoiceButton UI for starting and managing voice interactions within the mail app.
- Added a global keyboard shortcut ("v") to quickly open the voice assistant.
- Implemented a new alert component for improved user notifications.
- Added localization for the voice assistant in the navigation sidebar.
- **Enhancements**
- Updated the Sparkles icon with improved color and opacity styling.
- **Bug Fixes**
- Corrected localization string formatting for error messages.
- **Chores**
- Updated and reorganized dependencies to support new voice and AI features.
- Added new context providers for managing voice interactions throughout the app.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
# Add Intercom integration and enhance phishing detection in mail display
## Description
This PR adds Intercom integration for customer support and enhances the phishing detection capabilities in the mail display component. The changes include:
1. Integrating Intercom messenger for user support with secure JWT authentication
2. Enhancing the AI web search query to better identify suspicious domains and potential phishing attempts
3. Reorganizing the help and feedback UI elements in the navigation sidebar
## Type of Change
- ✨ New feature (non-breaking change which adds functionality)
- 🔒 Security enhancement
- 🎨 UI/UX improvement
## Areas Affected
- [x] User Interface/Experience
- [x] Authentication/Authorization
- [x] Security
## Testing Done
- [x] Manual testing performed
## Security Considerations
- [x] No sensitive data is exposed
- [x] Authentication checks are in place
- [x] JWT implementation for secure Intercom authentication
## Checklist
- [x] I have performed a self-review of my code
- [x] My changes generate no new warnings
## Additional Notes
The phishing detection enhancement improves security by adding domain validation to the AI search query, helping users identify suspicious email domains more effectively. The Intercom integration provides a direct support channel for users within the application.
_By submitting this pull request, I confirm that my contribution is made under the terms of the project's license._
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Added Intercom messenger integration, allowing users to access help via a new "Help" button in the sidebar.
- Introduced a "Feedback" navigation item in the sidebar for quick access to external feedback submission.
- **Enhancements**
- Improved person background search to include phishing detection and domain validity context.
- **Chores**
- Updated dependencies to support new features.
- Adjusted navigation configuration for sidebar items.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
### TL;DR
Refactored the command palette to improve the search and filter experience in the mail app.
### What changed?
- Restructured the `CommandPaletteProvider` to wrap the entire mail app layout
- Enhanced the command palette context to expose active filters and a clear filters function
- Replaced the search bar with an improved command palette button that displays active filters
- Added a "Clear" button directly in the search UI to quickly remove all filters
- Added a new keyboard shortcut (Cmd+Shift+F) to clear all filters
- Removed the '/' shortcut for search in favor of using Cmd+K for the command palette
### How to test?
1. Open the mail app and press Cmd+K to open the command palette
2. Apply some filters through the command palette
3. Verify that active filters appear in the search bar
4. Test clearing filters using:
- The "Clear" button next to the filters
- The Cmd+Shift+F keyboard shortcut
5. Verify that the command palette opens correctly with Cmd+K
### Why make this change?
This change improves the user experience by:
- Making active filters more visible in the UI
- Providing multiple ways to clear filters
- Streamlining the search and filter workflow
- Creating a more consistent command interface throughout the application
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **New Features**
- Added a global keyboard shortcut (Cmd+Shift+F) to clear all active filters in the mail app.
- **Refactor**
- Streamlined the command palette and its provider for improved context management and simplified state handling.
- Updated the mail layout to use a button for opening the command palette, displaying active filters and providing quick access to clearing filters.
- Wrapped the entire mail layout with the command palette context provider for consistent state access.
- **Style**
- Improved button and filter UI styling for better clarity and usability.
- **Bug Fixes**
- Removed the single-key '/' search shortcut to prevent accidental activation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
- Update deps
- Fix i8n issues where it tries to translate hardcoded strings
<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit
- **Bug Fixes**
- Improved translation handling for navigation titles in the command palette, ensuring titles are translated only once and displayed correctly.
- **Chores**
- Removed unnecessary 'use client' directives from several UI components.
- Updated and cleaned up dependencies across the workspace, including removal of unused packages and bumping versions.
- Simplified and reorganized script commands for development and database operations.
- Adjusted configuration files for improved client/server build warmup and removed obsolete Turbo tasks.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->