fix: add hint tooltips for quadrant axes

app/components/Compare/FacetQuadrantChart.vue

@@ -383,6 +383,53 @@ const config = computed<VueUiQuadrantConfig>(() => {
               })
             "
           />
+
+          <foreignObject :x="0" :y="30" style="overflow: visible" :width="svg.width" :height="12">
+            <div class="flex items-center justify-center gap-2">
+              <TooltipApp
+                :aria-label="$t('compare.quadrant_chart.explanation.tooltip_help_efficiency')"
+              >
+                <span
+                  data-dom-to-png-ignore
+                  class="i-lucide:info w-3.5 h-3.5 text-fg-muted cursor-help"
+                  aria-hidden="true"
+                />
+                <template #content>
+                  <div class="flex flex-col gap-3">
+                    <p class="text-xs text-fg-muted">
+                      {{ $t('compare.quadrant_chart.explanation.efficiency') }}
+                    </p>
+                  </div>
+                </template>
+              </TooltipApp>
+            </div>
+          </foreignObject>
+
+          <foreignObject
+            :x="svg.width - 40"
+            :y="svg.height / 2 - 8"
+            style="overflow: visible"
+            :width="20"
+            :height="12"
+          >
+            <div class="flex items-center justify-center gap-2">
+              <TooltipApp>
+                <span
+                  data-dom-to-png-ignore
+                  type="button"
+                  class="i-lucide:info w-3.5 h-3.5 text-fg-muted cursor-help"
+                  :aria-label="$t('compare.quadrant_chart.explanation.tooltip_help_adoption')"
+                />
+                <template #content>
+                  <div class="flex flex-col gap-3">
+                    <p class="text-xs text-fg-muted">
+                      {{ $t('compare.quadrant_chart.explanation.adoption') }}
+                    </p>
+                  </div>
+                </template>
+              </TooltipApp>
+            </div>
+          </foreignObject>
         </template>
 
         <template #menuIcon="{ isOpen }">

i18n/locales/en.json

@@ -1255,6 +1255,8 @@
       },
       "explanation": {
         "tooltip_help": "Show scoring explanation",
+        "tooltip_help_adoption": "Show traction scoring explanation",
+        "tooltip_help_efficiency": "Show ergonomics scoring explanation",
         "introduction": "The score is calculated by combining multiple signals into two axes:",
         "adoption": "Traction: reflects usage and activity (downloads, freshness, likes)",
         "efficiency": "Ergonomics: reflects footprint and quality (install size, dependencies, vulnerabilities, type support)",

i18n/locales/fr-FR.json

@@ -1248,6 +1248,8 @@
       },
       "explanation": {
         "tooltip_help": "Afficher l’explication du score",
+        "tooltip_help_adoption": "Afficher l'explication du score de popularité",
+        "tooltip_help_efficiency": "Afficher l'explication du score d'ergonomie",
         "introduction": "Le score est calculé en combinant plusieurs signaux sur deux axes :",
         "adoption": "Popularité : reflète l’utilisation et l’activité (téléchargements, fraîcheur, mentions)",
         "efficiency": "Ergonomie : reflète l’empreinte et la qualité (taille d’installation, dépendances, vulnérabilités, support des types)",

i18n/schema.json

@@ -3769,6 +3769,12 @@
                 "tooltip_help": {
                   "type": "string"
                 },
+                "tooltip_help_adoption": {
+                  "type": "string"
+                },
+                "tooltip_help_efficiency": {
+                  "type": "string"
+                },
                 "introduction": {
                   "type": "string"
                 },