Skip to content

Internationalization #193

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open

Internationalization #193

wants to merge 4 commits into from

Conversation

vedansh-5
Copy link
Contributor

@vedansh-5 vedansh-5 commented Jul 10, 2025

πŸ“Œ Fixes

Fixes #159


πŸ“ Summary of Changes

All the labels of extension changes according to the default language set in users' browser.


πŸ“Έ Screenshots / Demo (if UI-related)

image

βœ… Checklist

  • I’ve tested my changes locally
  • I’ve added tests (if applicable)
  • I’ve updated documentation (if applicable)
  • My code follows the project’s code style guidelines

πŸ‘€ Reviewer Notes

Add any special notes for the reviewer here

Summary by Sourcery

Externalize all user-facing text into localized message files and apply internationalization across the extension’s UI based on the user’s browser language.

New Features:

  • Add locale-specific messages.json files and default_locale configuration in manifest.json
  • Implement applyAllTranslations in popup.js to load and insert localized UI strings

Enhancements:

  • Replace all hardcoded labels, placeholders, button texts, and tooltips in popup.html with data-i18n attributes
  • Refactor JS handlers to use chrome.i18n.getMessage for dynamic UI text, placeholders, titles, and status messages

Signed-off-by: Vedansh Saini <77830698+vedansh-5@users.noreply.github.com>
Signed-off-by: Vedansh Saini <77830698+vedansh-5@users.noreply.github.com>
Copy link
Contributor

sourcery-ai bot commented Jul 10, 2025

Reviewer's Guide

This PR implements internationalization by annotating UI elements in popup.html with data-i18n attributes, introducing locale JSON files under src/_locales, and wiring up translation logic in popup.js using the chrome.i18n API, along with updating manifest.json to specify the default locale.

File-Level Changes

Change Details Files
Annotated UI text in popup.html with i18n attributes
  • Replaced static headings, labels and button texts with data-i18n and data-i18n-placeholder attributes
  • Wrapped dynamic text inside tags and added data-i18n-title for tooltips/titles
  • Converted hardcoded button labels and tooltips to use data-i18n spans
src/popup.html
Added localization resource files and default locale configuration
  • Created locale directories (de, en, es, fr, zh_CN) each containing messages.json
  • Updated manifest.json to include "default_locale": "en"
src/manifest.json
src/_locales/de/messages.json
src/_locales/en/messages.json
src/_locales/es/messages.json
src/_locales/fr/messages.json
src/_locales/zh_CN/messages.json
Implemented translation initialization in popup.js
  • Added applyAllTranslations() to replace texts, placeholders, and titles at startup
  • Invoked applyAllTranslations() on DOMContentLoaded before other logic
  • Replaced inline hardcoded status and button strings with chrome.i18n.getMessage calls
src/scripts/popup.js

Assessment against linked issues

Issue Objective Addressed Explanation

Possibly linked issues


Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

Copy link
Contributor

@sourcery-ai sourcery-ai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @vedansh-5 - I've reviewed your changes and they look great!

Prompt for AI Agents
Please address the comments from this code review:
## Individual Comments

### Comment 1
<location> `src/scripts/popup.js:240` </location>
<code_context>
             // Allow empty org to fetch all GitHub activities
             chrome.storage.local.set({ orgName: org }, () => {
-                generateBtn.innerHTML = '<i class="fa fa-spinner fa-spin"></i> Generating...';
+                generateBtn.innerHTML = `<i class="fa fa-spinner fa-spin"></i> ${chrome.i18n.getMessage('generatingButton')}`;
                 generateBtn.disabled = true;
                 window.generateScrumReport();
</code_context>

<issue_to_address>
No fallback for missing 'generatingButton' i18n key.

If the i18n key is missing, only the spinner appears. Please add a fallback string to improve user experience.
</issue_to_address>

<suggested_fix>
<<<<<<< SEARCH
                generateBtn.innerHTML = `<i class="fa fa-spinner fa-spin"></i> ${chrome.i18n.getMessage('generatingButton')}`;
=======
                const generatingText = chrome.i18n.getMessage('generatingButton') || 'Generating...';
                generateBtn.innerHTML = `<i class="fa fa-spinner fa-spin"></i> ${generatingText}`;
>>>>>>> REPLACE

</suggested_fix>

### Comment 2
<location> `src/scripts/popup.js:458` </location>
<code_context>
                     const scrumReport = document.getElementById('scrumReport');
                     if (scrumReport) {
-                        scrumReport.innerHTML = '<p style="text-align: center; color: #666; padding: 20px;">Organization changed. Click Generate button to fetch the GitHub activities.</p>';
+                        scrumReport.innerHTML = `<p style="text-align: center; color: #666; padding: 20px;">${chrome.i18n.getMessage('orgChangedMessage')}</p>`;
                     }
                     // Clear the githubCache for previous org
</code_context>

<issue_to_address>
No fallback for missing 'orgChangedMessage' i18n key.

Without a fallback, the report may display nothing if the key is missing. Please add a default message to ensure the UI remains informative.
</issue_to_address>

<suggested_fix>
<<<<<<< SEARCH
                    if (scrumReport) {
                        scrumReport.innerHTML = `<p style="text-align: center; color: #666; padding: 20px;">${chrome.i18n.getMessage('orgChangedMessage')}</p>`;
                    }
=======
                    if (scrumReport) {
                        const orgChangedMsg = chrome.i18n.getMessage('orgChangedMessage') || 'Organization changed. Click Generate button to fetch the GitHub activities.';
                        scrumReport.innerHTML = `<p style="text-align: center; color: #666; padding: 20px;">${orgChangedMsg}</p>`;
                    }
>>>>>>> REPLACE

</suggested_fix>

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click πŸ‘ or πŸ‘Ž on each comment and I'll use the feedback to improve your reviews.

Signed-off-by: Vedansh Saini <77830698+vedansh-5@users.noreply.github.com>
@vedansh-5 vedansh-5 self-assigned this Jul 10, 2025
@vedansh-5 vedansh-5 requested review from hpdang and Preeti9764 July 10, 2025 19:42
@hpdang
Copy link
Member

hpdang commented Jul 11, 2025

@vedansh-5 it doesn't work, please see screenshot
Screenshot from 2025-07-11 19-05-11

@vedansh-5
Copy link
Contributor Author

@vedansh-5 it doesn't work, please see screenshot Screenshot from 2025-07-11 19-05-11

That's really weird, because
image
It works on my machine.
Could you please open up your chrome developer tools and check/share the console errors. Thankyou

@vedansh-5
Copy link
Contributor Author

@Preeti9764 Could you also review this and see if the same error persists for you. Thanks

Signed-off-by: Vedansh Saini <77830698+vedansh-5@users.noreply.github.com>
@vedansh-5
Copy link
Contributor Author

@Preeti9764 Please take a look whenever you can, thanks,

@vedansh-5
Copy link
Contributor Author

@Preeti9764 Please review this PR and share your views on this. Thanks!

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.

Add i18n Support for Browser Language-Based Translations
2 participants