Skip to content

Implement webview localization for date/time formatting#7802

Closed
Copilot wants to merge 1 commit intomainfrom
copilot/fix-0ec4a392-717f-4eb9-83a7-c43ef096709f
Closed

Implement webview localization for date/time formatting#7802
Copilot wants to merge 1 commit intomainfrom
copilot/fix-0ec4a392-717f-4eb9-83a7-c43ef096709f

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Sep 11, 2025

This PR addresses the TODO comment in src/common/utils.ts by implementing comprehensive localization support for date/time formatting in all webviews.

Problem

Previously, dayjs was configured with hardcoded English strings for relative time formatting:

dayjs.updateLocale('en', {
  relativeTime: {
    future: 'in %s',
    past: '%s ago',
    s: 'seconds',
    m: 'a minute',
    // ... more hardcoded English strings
  },
});

This prevented proper localization for non-English VS Code users, as webviews would always display timestamps like "2 hours ago" or "a minute ago" in English regardless of the user's locale setting.

Solution

The implementation provides a complete localization pipeline:

  1. Localization Keys: Added 15 new keys to package.nls.json for all dayjs relative time strings using VS Code's standard {0} placeholder syntax.

  2. Dynamic Configuration: Created createLocalizedRelativeTimeConfig() that uses vscode.l10n.t() to retrieve localized strings based on the user's VS Code language setting.

  3. Webview Integration:

    • Extended Issue and CreateParamsNew interfaces with relativeTimeConfig field
    • Updated all webview providers to pass locale configuration during initialization
    • Modified webview contexts to apply the configuration when receiving data
  4. Runtime Application: The setLocalizedRelativeTimeConfig() function dynamically updates dayjs configuration, allowing the existing dateFromNow() function to work seamlessly with localized strings.

Key Features

  • Universal Coverage: Works across all webviews (PR view, issue view, create PR view)
  • Seamless Integration: No changes required to existing dateFromNow() usage or Timestamp component
  • Robust Fallback: Gracefully falls back to English strings if localization fails
  • VS Code Native: Uses the official vscode.l10n.t() API for consistency with VS Code's localization system

Example

With this change, users with VS Code set to French will now see "il y a 2 heures" instead of "2 hours ago" in webview timestamps, while maintaining full compatibility with all existing functionality.

Created from VS Code via the GitHub Pull Request extension.


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

@alexr00 alexr00 closed this Sep 11, 2025
Copilot AI changed the title [WIP] Work on TODO: localization for webview needed (from src/common/utils.ts) Implement webview localization for date/time formatting Sep 11, 2025
Copilot AI requested a review from alexr00 September 11, 2025 14:38
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