Localize activity heatmap (except tooltip) (go-gitea#24131)

The calculation of the total sum is moved to the backend so a full HTML
string could be sent.


![image](https://user-images.githubusercontent.com/20454870/232112381-c11d896b-ba47-40f8-b2a3-71cf4b3208de.png)

- Closes go-gitea#10669
- 2nd attempt (the first was in go-gitea#21570)

---------

Signed-off-by: Yarden Shoham <[email protected]>
Co-authored-by: Giteabot <[email protected]>

Author: yardenshoham

models/activities/user_heatmap.go

@@ -69,3 +69,12 @@ func getUserHeatmapData(user *user_model.User, team *organization.Team, doer *us
 		OrderBy("timestamp").
 		Find(&hdata)
 }
+
+// GetTotalContributionsInHeatmap returns the total number of contributions in a heatmap
+func GetTotalContributionsInHeatmap(hdata []*UserHeatmapData) int64 {
+	var total int64
+	for _, v := range hdata {
+		total += v.Contributions
+	}
+	return total
+}

options/locale/locale_en-US.ini

@@ -118,6 +118,12 @@ footer = Footer
 footer.software = About Software
 footer.links = Links
 
+[heatmap]
+number_of_contributions_in_the_last_12_months = %s contributions in the last 12 months
+no_contributions = No contributions
+less = Less
+more = More
+
 [editor]
 buttons.heading.tooltip = Add heading
 buttons.bold.tooltip = Add bold text

routers/web/user/home.go

@@ -107,6 +107,7 @@ func Dashboard(ctx *context.Context) {
 			return
 		}
 		ctx.Data["HeatmapData"] = data
+		ctx.Data["HeatmapTotalContributions"] = activities_model.GetTotalContributionsInHeatmap(data)
 	}
 
 	feeds, count, err := activities_model.GetFeeds(ctx, activities_model.GetFeedsOptions{

routers/web/user/profile.go

@@ -74,6 +74,7 @@ func Profile(ctx *context.Context) {
 			return
 		}
 		ctx.Data["HeatmapData"] = data
+		ctx.Data["HeatmapTotalContributions"] = activities_model.GetTotalContributionsInHeatmap(data)
 	}
 
 	if len(ctx.ContextUser.Description) != 0 {

templates/user/heatmap.tmpl

@@ -1,5 +1,11 @@
 {{if .HeatmapData}}
-	<div id="user-heatmap" data-heatmap-data="{{Json .HeatmapData}}">
+	<div id="user-heatmap"
+		data-heatmap-data="{{Json .HeatmapData}}"
+		data-locale-total-contributions="{{$.locale.Tr "heatmap.number_of_contributions_in_the_last_12_months" ($.locale.PrettyNumber .HeatmapTotalContributions)}}"
+		data-locale-no-contributions="{{.locale.Tr "heatmap.no_contributions"}}"
+		data-locale-more="{{.locale.Tr "heatmap.more"}}"
+		data-locale-less="{{.locale.Tr "heatmap.less"}}"
+	>
 		<div slot="loading">
 			<div class="ui active centered inline indeterminate text loader" id="loading-heatmap">{{.locale.Tr "user.heatmap.loading"}}</div>
 		</div>

web_src/js/components/ActivityHeatmap.vue

@@ -1,7 +1,7 @@
 <template>
   <div id="user-heatmap">
     <div class="total-contributions">
-      {{ sum }} contributions in the last 12 months
+      {{ locale.contributions_in_the_last_12_months }}
     </div>
     <calendar-heatmap
       :locale="locale"
@@ -41,15 +41,6 @@ export default {
     ],
     endDate: new Date(),
   }),
-  computed: {
-    sum() {
-      let s = 0;
-      for (let i = 0; i < this.values.length; i++) {
-        s += this.values[i].count;
-      }
-      return s;
-    }
-  },
   mounted() {
     // work around issue with first legend color being rendered twice and legend cut off
     const legend = document.querySelector('.vch__external-legend-wrapper');

web_src/js/features/heatmap.js

@@ -18,11 +18,15 @@ export function initHeatmap() {
       return {date: new Date(v), count: heatmap[v]};
     });
 
+    // last heatmap tooltip localization attempt https://github.com/go-gitea/gitea/pull/24131/commits/a83761cbbae3c2e3b4bced71e680f44432073ac8
     const locale = {
       months: new Array(12).fill().map((_, idx) => translateMonth(idx)),
       days: new Array(7).fill().map((_, idx) => translateDay(idx)),
       contributions: 'contributions',
-      no_contributions: 'No contributions',
+      contributions_in_the_last_12_months: el.getAttribute('data-locale-total-contributions'),
+      no_contributions: el.getAttribute('data-locale-no-contributions'),
+      more: el.getAttribute('data-locale-more'),
+      less: el.getAttribute('data-locale-less'),
     };
 
     const View = createApp(ActivityHeatmap, {values, locale});