Merge branch 'main' into fix-mail-release-msgid

package-lock.json

@@ -14,6 +14,7 @@
         "@github/text-expander-element": "2.6.1",
         "@mcaptcha/vanilla-glue": "0.1.0-alpha-3",
         "@primer/octicons": "19.9.0",
+        "@silverwind/vue3-calendar-heatmap": "2.0.6",
         "add-asset-webpack-plugin": "2.0.1",
         "ansi_up": "6.0.2",
         "asciinema-player": "3.7.1",
@@ -57,7 +58,6 @@
         "vue-bar-graph": "2.0.0",
         "vue-chartjs": "5.3.1",
         "vue-loader": "17.4.2",
-        "vue3-calendar-heatmap": "2.0.5",
         "webpack": "5.91.0",
         "webpack-cli": "5.1.4",
         "wrap-ansi": "9.0.0"
@@ -1626,6 +1626,18 @@
         "win32"
       ]
     },
+    "node_modules/@silverwind/vue3-calendar-heatmap": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/@silverwind/vue3-calendar-heatmap/-/vue3-calendar-heatmap-2.0.6.tgz",
+      "integrity": "sha512-efX+nf2GR7EfA7iNgZDeM9Jue5ksglSXvN0C/ja0M1bTmkCpAxKlGJ3vki7wfTPQgX1O0nCfAM62IKqUUEM0cQ==",
+      "engines": {
+        "node": ">=16"
+      },
+      "peerDependencies": {
+        "tippy.js": "^6.3.7",
+        "vue": "^3.2.29"
+      }
+    },
     "node_modules/@sinclair/typebox": {
       "version": "0.27.8",
       "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.27.8.tgz",
@@ -12200,18 +12212,6 @@
         }
       }
     },
-    "node_modules/vue3-calendar-heatmap": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/vue3-calendar-heatmap/-/vue3-calendar-heatmap-2.0.5.tgz",
-      "integrity": "sha512-qvveNQlTS5Aw7AvRLs0zOyu3uP5iGJlXJAnkrkG2ElDdyQ8H1TJhQ8rL702CROjAg16ezIveUY10nCO7lqZ25w==",
-      "engines": {
-        "node": ">=16"
-      },
-      "peerDependencies": {
-        "tippy.js": "^6.3.7",
-        "vue": "^3.2.29"
-      }
-    },
     "node_modules/watchpack": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.1.tgz",

package.json

@@ -13,6 +13,7 @@
     "@github/text-expander-element": "2.6.1",
     "@mcaptcha/vanilla-glue": "0.1.0-alpha-3",
     "@primer/octicons": "19.9.0",
+    "@silverwind/vue3-calendar-heatmap": "2.0.6",
     "add-asset-webpack-plugin": "2.0.1",
     "ansi_up": "6.0.2",
     "asciinema-player": "3.7.1",
@@ -56,7 +57,6 @@
     "vue-bar-graph": "2.0.0",
     "vue-chartjs": "5.3.1",
     "vue-loader": "17.4.2",
-    "vue3-calendar-heatmap": "2.0.5",
     "webpack": "5.91.0",
     "webpack-cli": "5.1.4",
     "wrap-ansi": "9.0.0"

web_src/js/components/.eslintrc.yaml

@@ -18,4 +18,5 @@ rules:
   vue/attributes-order: [0]
   vue/html-closing-bracket-spacing: [2, {startTag: never, endTag: never, selfClosingTag: never}]
   vue/max-attributes-per-line: [0]
+  vue/singleline-html-element-content-newline: [0]
   vue-scoped-css/enforce-style-type: [0]

web_src/js/components/ActivityHeatmap.vue

@@ -1,5 +1,6 @@
 <script>
-import {CalendarHeatmap} from 'vue3-calendar-heatmap';
+// TODO: Switch to upstream after https://github.com/razorness/vue3-calendar-heatmap/pull/34 is merged
+import {CalendarHeatmap} from '@silverwind/vue3-calendar-heatmap';
 
 export default {
   components: {CalendarHeatmap},
@@ -55,15 +56,16 @@ export default {
 </script>
 <template>
   <div class="total-contributions">
-    {{ locale.contributions_in_the_last_12_months }}
+    {{ locale.textTotalContributions }}
   </div>
   <calendar-heatmap
-    :locale="locale"
+    :locale="locale.heatMapLocale"
-    :no-data-text="locale.no_contributions"
+    :no-data-text="locale.noDataText"
-    :tooltip-unit="locale.contributions"
+    :tooltip-unit="locale.tooltipUnit"
     :end-date="endDate"
     :values="values"
     :range-color="colorRange"
     @day-click="handleDayClick($event)"
+    :tippy-props="{theme: 'tooltip'}"
   />
 </template>

web_src/js/components/ContextPopup.vue

@@ -91,16 +91,22 @@ export default {
 <template>
   <div ref="root">
     <div v-if="loading" class="tw-h-12 tw-w-12 is-loading"/>
-    <div v-if="!loading && issue !== null">
+    <div v-if="!loading && issue !== null" class="tw-flex tw-flex-col tw-gap-2">
-      <p><small>{{ issue.repository.full_name }} on {{ createdAt }}</small></p>
+      <div class="tw-text-12">{{ issue.repository.full_name }} on {{ createdAt }}</div>
-      <p><svg-icon :name="icon" :class="['text', color]"/> <strong>{{ issue.title }}</strong> #{{ issue.number }}</p>
+      <div class="flex-text-block">
-      <p>{{ body }}</p>
+        <svg-icon :name="icon" :class="['text', color]"/>
+        <span class="issue-title tw-font-semibold tw-break-anywhere">
+          {{ issue.title }}
+          <span class="index">#{{ issue.number }}</span>
+        </span>
+      </div>
+      <div v-if="body">{{ body }}</div>
       <!-- eslint-disable-next-line vue/no-v-html -->
-      <div v-html="renderedLabels"/>
+      <div v-if="issue.labels.length" v-html="renderedLabels"/>
     </div>
-    <div v-if="!loading && issue === null">
+    <div class="tw-flex tw-flex-col tw-gap-2" v-if="!loading && issue === null">
-      <p><small>{{ i18nErrorOccurred }}</small></p>
+      <div class="tw-text-12">{{ i18nErrorOccurred }}</div>
-      <p>{{ i18nErrorMessage }}</p>
+      <div>{{ i18nErrorMessage }}</div>
     </div>
   </div>
 </template>

web_src/js/features/heatmap.js

@@ -20,13 +20,16 @@ export function initHeatmap() {
 
     // 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)),
+      heatMapLocale: {
-      days: new Array(7).fill().map((_, idx) => translateDay(idx)),
+        months: new Array(12).fill().map((_, idx) => translateMonth(idx)),
-      contributions: 'contributions',
+        days: new Array(7).fill().map((_, idx) => translateDay(idx)),
-      contributions_in_the_last_12_months: el.getAttribute('data-locale-total-contributions'),
+        on: ' - ', // no correct locale support for it, because in many languages the sentence is not "something on someday"
-      no_contributions: el.getAttribute('data-locale-no-contributions'),
+        more: el.getAttribute('data-locale-more'),
-      more: el.getAttribute('data-locale-more'),
+        less: el.getAttribute('data-locale-less'),
-      less: el.getAttribute('data-locale-less'),
+      },
+      tooltipUnit: 'contributions',
+      textTotalContributions: el.getAttribute('data-locale-total-contributions'),
+      noDataText: el.getAttribute('data-locale-no-contributions'),
     };
 
     const View = createApp(ActivityHeatmap, {values, locale});