Skip to content

Conversation

@Cinzya
Copy link

@Cinzya Cinzya commented Jun 8, 2025

Summary ✨

  • Add comprehensive internationalization (i18n) support for all user-facing components
  • Implement English and German translations across the entire Taska application πŸ‡ΊπŸ‡ΈπŸ‡©πŸ‡ͺ

Changes Made πŸ“

Translation Infrastructure πŸ—‚οΈ

  • Added translation keys to messages/en.json and messages/de.json

Component Updates πŸ”§

Integrated useTranslations hook in all user-facing components:

  • InfoSection: Time display labels and accessibility text ⏰
  • TaskModal: Task creation/editing form with parameterized text πŸ“‹
  • TaskStats: Statistics labels and section titles πŸ“Š
  • TimezoneModal: Timezone management interface with ARIA labels 🌐
  • UserGreeting: Personalized greeting messages with name interpolation πŸ‘‹
  • UserNameModal: Name editing form interface ✏️

Locale Support 🎯

  • Full German translation coverage alongside existing English

Technical Details πŸ”§

  • Uses next-intl for robust internationalization
  • Maintains existing component functionality while adding translation support
  • Implements proper parameter substitution for dynamic content (user names, counts)
  • Includes accessibility (ARIA) label translations for better screen reader support β™Ώ

Test Plan βœ…

  • Verify English translations display correctly
  • Verify German translations display correctly
  • Test language switching functionality
  • Confirm all user-facing text is properly internationalized
  • Validate parameterized translations work with dynamic content

This PR makes Taska accessible to German-speaking users while maintaining the existing English
experience and establishing a foundation for future language additions! πŸŽ‰

Cinzya and others added 14 commits June 8, 2025 11:47
- Integrate next-intl plugin with existing PWA setup
- Chain plugins properly: PWA(nextIntl(config))
- Maintain static export compatibility

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Add i18n request configuration for static export
- Create locale config with English and German support
- Add comprehensive English and German translations for task interface
- Support client-side locale detection and switching

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Implement getUserLocale() with browser language detection
- Add setUserLocale() with localStorage persistence
- Support automatic German detection from browser language
- Compatible with static export (no server-side cookies)

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Add LocaleProvider for dynamic locale switching
- Integrate with getUserLocale() for browser detection
- Pass locale-specific messages to NextIntlClientProvider
- Enable client-side internationalization without routing

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Replace NextIntlClientProvider with custom LocaleProvider
- Load all messages at build time for client-side switching
- Remove server-side locale detection for static export compatibility
- Pass messages to LocaleProvider for dynamic locale switching

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Replace hardcoded strings with useTranslations('Tasks')
- Add translation keys for search, filters, and task actions
- Support multilingual task management interface
- Include aria-label translations for accessibility

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Add DeleteModal translation keys for English and German
- Include title, confirmation message, warning text, and button labels
- Update delete-confirm-modal component to use useTranslations
- Support multilingual delete confirmation dialog

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Add English and German translations for time display labels and aria-labels in the info-section component including Time, Day, Date, Timezone labels and accessibility text for manage timezones and toggle theme buttons.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Add English and German translations for task creation and editing modal including modal titles, form labels, placeholder text, and button labels for both create and edit modes.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Add English and German translations for task statistics display including section title and all stat labels (overdue, not completed, completed, total tasks).

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Add English and German translations for timezone management modal including modal title, section headings, form placeholders, accessibility labels for timezone controls, and action buttons.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Add English and German translations for user greeting messages including default fallback name and parameterized greeting messages for new and returning users.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Add English and German translations for user name editing modal including modal title, form labels, placeholder text, and action buttons.

πŸ€– Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
@ShadowArcanist
Copy link
Member

ShadowArcanist commented Jun 8, 2025

Hey @Cinzya !!

I just ran the dev server (bun run dev) and I am seeing the following errors
image

I also built the app (bun run build) and I am not seeing any difference of language in the UI on the build output.
Got this error during build:
image

I also changed my timezone to Europe/Berlin on my mac to see if it changes the language on the site but it didn't.

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.

2 participants