Localize heatmap #7207

New Issue

GiteaMirror · 2025-11-02T07:19:23-06:00

GiteaMirror commented

2025-11-02 07:19:23 -06:00

Originally created by @firesoft-de on GitHub (Apr 19, 2021).

Gitea version (or commit ref): 1.14.0
Git version: not relevant
Operating system: not relevant
Database (use [x]): not relevant
Can you reproduce the bug at https://try.gitea.io:
- Yes (provide example URL)
- No
Log gist: not relevant

Description

On my gitea instance I got a user request about localizing the heatmap. The legend, the months and the days are always in english (screenshot from german instance below).

I inspected the code and identified ce8255fb7b/web_src/js/components/ActivityHeatmap.vue (L6-L14) as the point to adopt this change request.

locale is defined here
ce8255fb7b/web_src/js/components/ActivityHeatmap.vue (L39-L41)

and is used in dependency like this
78963c3b97/src/components/consts.js (L3-L9)

export const DEFAULT_LOCALE = {
  months: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
  days: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
  on: 'on',
  less: 'Less',
  more: 'More'
}

Unfortunatley I'm not that fluent with javascript (and vue) and need a little kick start (example or something else) with importing the localizations from /options/locale/*.ini. Anyone has a tip on how to do this?

Originally created by @firesoft-de on GitHub (Apr 19, 2021).   - Gitea version (or commit ref): 1.14.0 - Git version: not relevant - Operating system: not relevant - Database (use `[x]`): not relevant - Can you reproduce the bug at https://try.gitea.io: - [x] Yes (provide example URL) - [ ] No - Log gist: not relevant ## Description On my gitea instance I got a user request about localizing the heatmap. The legend, the months and the days are always in english (screenshot from german instance below). ![grafik](https://user-images.githubusercontent.com/34716031/115223870-923bbc80-a10c-11eb-8e8f-9ed866241788.png) I inspected the code and identified https://github.com/go-gitea/gitea/blob/ce8255fb7be09b02ca62c1c4835849d75abc3b2f/web_src/js/components/ActivityHeatmap.vue#L6-L14 as the point to adopt this change request. `locale` is defined here https://github.com/go-gitea/gitea/blob/ce8255fb7be09b02ca62c1c4835849d75abc3b2f/web_src/js/components/ActivityHeatmap.vue#L39-L41 and is used in dependency like this https://github.com/julienr114/vue-calendar-heatmap/blob/78963c3b97111b68ba063da631f3d1c2d37af7ec/src/components/consts.js#L3-L9 ``` export const DEFAULT_LOCALE = { months: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], days: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], on: 'on', less: 'Less', more: 'More' } ``` Unfortunatley I'm not that fluent with javascript (and vue) and need a little kick start (example or something else) with importing the localizations from `/options/locale/*.ini`. Anyone has a tip on how to do this?

GiteaMirror added the modifies/translation label 2025-11-02 07:19:23 -06:00

GiteaMirror closed this issue

2025-11-02 07:19:24 -06:00

GiteaMirror commented

2025-11-02 07:19:24 -06:00

@fsologureng commented on GitHub (Nov 21, 2022):

I have an error with this fix because my timezone isn't the expected one:

 FAIL  web_src/js/utils.test.js > translateDay
AssertionError: expected 'dim.' to deeply equal 'lun.'
 ❯ web_src/js/utils.test.js:127:27
    125|   const originalLang = document.documentElement.lang;
    126|   document.documentElement.lang = 'fr-FR';
    127|   expect(translateDay(1)).toEqual('lun.');
       |                           ^
    128|   expect(translateDay(5)).toEqual('ven.');
    129|   document.documentElement.lang = 'pl-PL';

  - Expected   "lun."
  + Received   "dim."

I suggest the fix must considered the same timezone (UTC) for the localised test:

 
 // given a month (0-11), returns it in the documents language
 export function translateMonth(month) {
-  return new Date(Date.UTC(2022, month, 12)).toLocaleString(getCurrentLocale(), {month: 'short'});
+  return new Date(Date.UTC(2022, month, 12)).toLocaleString(getCurrentLocale(), {month: 'short', timeZone: 'UTC'});
 }
 
 // given a weekday (0-6, Sunday to Saturday), returns it in the documents language
 export function translateDay(day) {
-  return new Date(Date.UTC(2022, 7, day)).toLocaleString(getCurrentLocale(), {weekday: 'short'});
+  return new Date(Date.UTC(2022, 7, day)).toLocaleString(getCurrentLocale(), {weekday: 'short', timeZone: 'UTC'});
 }

ping @yardenshoham

@fsologureng commented on GitHub (Nov 21, 2022): I have an error with this fix because my timezone isn't the expected one: ```javascript FAIL web_src/js/utils.test.js > translateDay AssertionError: expected 'dim.' to deeply equal 'lun.' ❯ web_src/js/utils.test.js:127:27 125| const originalLang = document.documentElement.lang; 126| document.documentElement.lang = 'fr-FR'; 127| expect(translateDay(1)).toEqual('lun.'); | ^ 128| expect(translateDay(5)).toEqual('ven.'); 129| document.documentElement.lang = 'pl-PL'; - Expected "lun." + Received "dim." ``` I suggest the fix must considered the same timezone (UTC) for the localised test: ```udiff // given a month (0-11), returns it in the documents language export function translateMonth(month) { - return new Date(Date.UTC(2022, month, 12)).toLocaleString(getCurrentLocale(), {month: 'short'}); + return new Date(Date.UTC(2022, month, 12)).toLocaleString(getCurrentLocale(), {month: 'short', timeZone: 'UTC'}); } // given a weekday (0-6, Sunday to Saturday), returns it in the documents language export function translateDay(day) { - return new Date(Date.UTC(2022, 7, day)).toLocaleString(getCurrentLocale(), {weekday: 'short'}); + return new Date(Date.UTC(2022, 7, day)).toLocaleString(getCurrentLocale(), {weekday: 'short', timeZone: 'UTC'}); } ``` ping @yardenshoham

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github-starred/gitea#7207