feat: add points to achievement list

src/locales/ar/translation.json

@@ -383,7 +383,7 @@
     "achievement_unlocked": "تم فتح الإنجاز",
     "user_achievements": "{{displayName}}إنجازات",
     "your_achievements": "إنجازاتك",
-    "unlocked_at": "مقفلة في:",
+    "unlocked_at": "مقفلة في: {{date}}",
     "subscription_needed": "مطلوب اشتراك Hydra Cloud لرؤية هذا المحتوى",
     "new_achievements_unlocked": "مفتوح {{achievementCount}} انجازات جديدة من {{gameCount}} ألعاب",
     "achievement_progress": "{{unlockedCount}}/{{totalCount}} الإنجازات",

src/locales/bg/translation.json

@@ -362,7 +362,7 @@
     "achievement_unlocked": "Постижението е отключено",
     "user_achievements": "Постиженията на {{displayName}} ",
     "your_achievements": "Вашите Постижения",
-    "unlocked_at": "Отключено на:",
+    "unlocked_at": "Отключено на: {{date}}",
     "subscription_needed": "Необходим е абонамент за Hydra Cloud, за да видите това съдържание",
     "new_achievements_unlocked": "Отключени {{achievementCount}} нови постижения от {{gameCount}} игра",
     "achievement_progress": "{{unlockedCount}}/{{totalCount}} постижения",

src/locales/cs/translation.json

@@ -362,7 +362,7 @@
     "achievement_unlocked": "Achievement odemčen",
     "user_achievements": "Achievementy uživatele {{displayName}}",
     "your_achievements": "Vaše achievementy",
-    "unlocked_at": "Odemčeno:",
+    "unlocked_at": "Odemčeno: {{date}}",
     "subscription_needed": "Je vyžadováno předplatné Hydra Cloud pro zobrazení tohoto obsahu",
     "new_achievements_unlocked": "Odemčeno {{achievementCount}} nových achievementů z {{gameCount}} her",
     "achievement_progress": "{{unlockedCount}}/{{totalCount}} achievementů",

src/locales/en/translation.json

@@ -368,11 +368,12 @@
     "achievement_unlocked": "Achievement unlocked",
     "user_achievements": "{{displayName}}'s Achievements",
     "your_achievements": "Your Achievements",
-    "unlocked_at": "Unlocked at:",
+    "unlocked_at": "Unlocked at: {{date}}",
     "subscription_needed": "A Hydra Cloud subscription is required to see this content",
     "new_achievements_unlocked": "Unlocked {{achievementCount}} new achievements from {{gameCount}} games",
     "achievement_progress": "{{unlockedCount}}/{{totalCount}} achievements",
-    "achievements_unlocked_for_game": "Unlocked {{achievementCount}} new achievements for {{gameTitle}}"
+    "achievements_unlocked_for_game": "Unlocked {{achievementCount}} new achievements for {{gameTitle}}",
+    "hidden_achievement_tooltip": "This is a hidden achievement"
   },
   "tour": {
     "subscription_tour_title": "Hydra Cloud Subscription",

src/locales/es/translation.json

@@ -364,7 +364,7 @@
     "achievement_unlocked": "Logro desbloqueado",
     "user_achievements": "Logros de {{displayName}}",
     "your_achievements": "Tus Logros",
-    "unlocked_at": "Desbloqueado el:",
+    "unlocked_at": "Desbloqueado el: {{date}}",
     "subscription_needed": "Se necesita una suscripción a Hydra Cloud necesita para ver este contenido",
     "new_achievements_unlocked": "Desbloqueados {{achievementCount}} nuevos logros de {{gameCount}} juegos",
     "achievement_progress": "{{unlockedCount}}/{{totalCount}} logros",

src/locales/et/translation.json

@@ -359,7 +359,7 @@
     "achievement_unlocked": "Saavutus avatud",
     "user_achievements": "{{displayName}} saavutused",
     "your_achievements": "Sinu saavutused",
-    "unlocked_at": "Avatud:",
+    "unlocked_at": "Avatud: {{date}}",
     "subscription_needed": "Selle sisu nägemiseks on vaja Hydra Cloud tellimust",
     "new_achievements_unlocked": "Avatud {{achievementCount}} uut saavutust {{gameCount}} mängust"
   },

src/locales/pt-BR/translation.json

@@ -366,11 +366,12 @@
     "achievement_unlocked": "Conquista desbloqueada",
     "your_achievements": "Suas Conquistas",
     "user_achievements": "Conquistas de {{displayName}}",
-    "unlocked_at": "Desbloqueado em:",
+    "unlocked_at": "Desbloqueada em: {{date}}",
     "subscription_needed": "Você precisa de uma assinatura Hydra Cloud para visualizar este conteúdo",
     "new_achievements_unlocked": "{{achievementCount}} novas conquistas de {{gameCount}} jogos",
     "achievement_progress": "{{unlockedCount}}/{{totalCount}} conquistas",
-    "achievements_unlocked_for_game": "Desbloqueadas {{achievementCount}} novas conquistas em {{gameTitle}}"
+    "achievements_unlocked_for_game": "Desbloqueadas {{achievementCount}} novas conquistas em {{gameTitle}}",
+    "hidden_achievement_tooltip": "Está é uma conquista oculta"
   },
   "tour": {
     "subscription_tour_title": "Assinatura Hydra Cloud",

src/locales/pt-PT/translation.json

@@ -356,7 +356,7 @@
     "achievement_unlocked": "Conquista desbloqueada",
     "your_achievements": "As tuas Conquistas",
     "user_achievements": "Conquistas de {{displayName}}",
-    "unlocked_at": "Desbloqueada em:",
+    "unlocked_at": "Desbloqueada em: {{date}}",
     "subscription_needed": "Precisas de uma subscrição Hydra Cloud para visualizar este conteúdo",
     "new_achievements_unlocked": "{{achievementCount}} novas conquistas de {{gameCount}} jogos"
   },

src/locales/ru/translation.json

@@ -358,7 +358,7 @@
     "achievement_unlocked": "Достижение разблокировано",
     "user_achievements": "Достижения {{displayName}}",
     "your_achievements": "Ваши достижения",
-    "unlocked_at": "Разблокировано:",
+    "unlocked_at": "Разблокировано: {{date}}",
     "subscription_needed": "Для просмотра этого содержимого необходима подписка на Hydra Cloud",
     "new_achievements_unlocked": "Разблокировано {{achievementCount}} новых достижений из {{gameCount}} игр",
     "achievement_progress": "{{unlockedCount}}/{{totalCount}} достижений",

src/locales/zh/translation.json

@@ -359,7 +359,7 @@
     "achievement_unlocked": "成就已解锁",
     "user_achievements": "{{displayName}}的成就",
     "your_achievements": "你的成就",
-    "unlocked_at": "解锁于:",
+    "unlocked_at": "解锁于: {{date}}",
     "subscription_needed": "需要订阅 Hydra Cloud 才能看到此内容",
     "new_achievements_unlocked": "从 {{gameCount}} 游戏中解锁 {{achievementCount}} 新成就"
   },

src/renderer/src/assets/icons/hydra.svg

@@ -0,0 +1,13 @@
+<svg width="55" height="49" viewBox="0 0 55 49" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17.8501 29.1176L19.9196 28.3235L20.6957 25.6764L20.437 24.8823L18.1088 25.9411L14.487 24.3528L10.0891 23.0293L5.69128 23.5587L3.10431 25.6764L2.58691 29.1176L4.1391 33.6177L5.69128 36.7942L8.53695 38.9118L10.8652 38.3824L13.9696 34.9412V31.5L12.9348 29.1176V32.2941L10.8652 34.9412H7.50216L4.91519 32.2941L5.69128 28.3235L9.57174 26.4705L13.9696 27.5294L17.8501 29.1176Z" fill="white"/>
+<path d="M36.9585 29.1176L34.889 28.3235L34.1129 25.6764L34.3716 24.8823L36.6998 25.9411L40.3216 24.3528L44.7195 23.0293L49.1173 23.5587L51.7043 25.6764L52.2217 29.1176L50.6695 33.6177L49.1173 36.7942L46.2716 38.9118L43.9434 38.3824L40.839 34.9412V31.5L41.8738 29.1176V32.2941L43.9434 34.9412H47.3064L49.8934 32.2941L49.1173 28.3235L45.2369 26.4705L40.839 27.5294L36.9585 29.1176Z" fill="white"/>
+<path d="M40.3873 19.4005L38.8784 19.9071L38.7685 19.0593L38.5553 17.7049L39.811 14.777L41.6564 11.5721L44.483 9.44001L47.1023 9.23162L49.2244 10.9371L50.7089 14.4032L51.4925 17.1031L50.9665 19.9071L49.3381 20.8916L45.7182 20.6206L43.8957 18.6282L43.2332 16.675L44.9154 18.5142L47.5156 18.8992L49.4627 17.0344L49.5586 14.0673L47.0064 12.1987L43.7784 13.2776L41.7929 16.3293L40.3873 19.4005Z" fill="white"/>
+<path d="M14.0238 19.4005L15.5327 19.9071L15.6426 19.0593L15.8559 17.7049L14.6001 14.777L12.7548 11.5721L9.92812 9.44001L7.30879 9.23162L5.18676 10.9371L3.70221 14.4032L2.91861 17.1031L3.44468 19.9071L5.07308 20.8916L8.69292 20.6206L10.5154 18.6282L11.178 16.675L9.4957 18.5142L6.89555 18.8992L4.94841 17.0344L4.8525 14.0673L7.4047 12.1987L10.6327 13.2776L12.6182 16.3293L14.0238 19.4005Z" fill="white"/>
+<path d="M19.9494 36.4343L22.554 34.3372L21.9876 34.0884L20.9528 31.9707L19.9494 32.5001L17.5898 34.0884L15.3904 37.377L14.744 40.4414L15.2615 43.0885L17.0724 45.4709L20.9528 47.3238L23.6932 46.5297L25.435 44.7653L26.0028 42.9192L25.6093 39.0508L25.0919 37.7913L23.6932 37.0002L24.3158 39.105L24.3158 42.0296L22.3597 43.9181L19.9494 43.9181L18.0225 42.0296L17.4949 39.105L19.9494 36.4343Z" fill="white"/>
+<path d="M35.0955 36.4343L32.4909 34.3372L33.0573 34.0884L34.0921 31.9707L35.0955 32.5001L37.4552 34.0884L39.6545 37.377L40.3009 40.4414L39.7834 43.0885L37.9725 45.4709L34.0921 47.3238L31.3518 46.5297L29.6099 44.7653L29.0421 42.9192L29.4356 39.0508L29.953 37.7913L31.3518 37.0002L30.7291 39.105L30.7291 42.0296L32.6852 43.9181L35.0955 43.9181L37.0224 42.0296L37.55 39.105L35.0955 36.4343Z" fill="white"/>
+<path d="M18.8447 8.70593V5.79413L20.1382 5H22.9839L27.3817 5.79413L31.7796 5H34.6252L35.9187 5.79413V8.70593L38.7644 11.353L37.2122 15.0589L37.9883 20.8825L35.9187 23.0002L33.3317 23.7943L32.8144 26.1767L33.3317 28.8238L32.8144 30.9415L31.7796 33.0591L30.2274 33.8533H27.3817H24.536L22.9839 33.0591L21.9491 30.9415L21.4317 28.8238L21.9491 26.1767L21.4317 23.7943L18.8447 23.0002L16.7751 20.8825L17.5512 15.0589L15.999 11.353L18.8447 8.70593Z" fill="white"/>
+<path d="M15.5205 6.88232L16.2966 8.73528L17.5901 7.67645V4.76465L15.5205 6.88232Z" fill="white"/>
+<path d="M39.2861 6.88232L38.51 8.73528L37.2166 7.67645V4.76465L39.2861 6.88232Z" fill="white"/>
+<path d="M18.3667 2.11767L18.6254 4.23534L19.4015 3.70593H20.9537L20.4363 2.11767L17.0732 0L18.3667 2.11767Z" fill="white"/>
+<path d="M35.6997 2.11767L35.441 4.23534L34.6649 3.70593H33.1127L33.6301 2.11767L36.9932 0L35.6997 2.11767Z" fill="white"/>
+</svg>

src/renderer/src/pages/achievements/achievement-list.tsx

@@ -2,6 +2,8 @@ import { useDate } from "@renderer/hooks";
 import type { UserAchievement } from "@types";
 import { useTranslation } from "react-i18next";
 import * as styles from "./achievements.css";
+import { CalendarIcon, EyeClosedIcon } from "@primer/octicons-react";
+import HydraIcon from "@renderer/assets/icons/hydra.svg?react";
 
 interface AchievementListProps {
   achievements: UserAchievement[];
@@ -23,16 +25,42 @@ export function AchievementList({ achievements }: AchievementListProps) {
             alt={achievement.displayName}
             loading="lazy"
           />
+
           <div style={{ flex: 1 }}>
-            <h4>{achievement.displayName}</h4>
+            <h4 style={{ display: "flex", alignItems: "center", gap: "4px" }}>
+              {achievement.hidden && (
+                <span
+                  style={{ display: "flex" }}
+                  title={t("hidden_achievement_tooltip")}
+                >
+                  <EyeClosedIcon size={12} />
+                </span>
+              )}
+              {achievement.displayName}
+            </h4>
             <p>{achievement.description}</p>
           </div>
-          {achievement.unlockTime && (
+          <div style={{ display: "flex", flexDirection: "column", gap: "8px" }}>
-            <div style={{ whiteSpace: "nowrap" }}>
+            {achievement.points && (
-              <small>{t("unlocked_at")}</small>
+              <div
-              <p>{formatDateTime(achievement.unlockTime)}</p>
+                style={{ display: "flex", alignItems: "center", gap: "4px" }}
-            </div>
+                title="This achievement is worth 69 H-points"
-          )}
+              >
+                <HydraIcon width={20} height={20} />
+                <p style={{ fontSize: "1.1em" }}>{achievement.points}</p>
+              </div>
+            )}
+            {achievement.unlockTime && (
+              <div
+                title={t("unlocked_at", {
+                  date: formatDateTime(achievement.unlockTime),
+                })}
+                style={{ whiteSpace: "nowrap", gap: "4px", display: "flex" }}
+              >
+                <small>{formatDateTime(achievement.unlockTime)}</small>
+              </div>
+            )}
+          </div>
         </li>
       ))}
     </ul>

src/types/index.ts

@@ -362,12 +362,14 @@ export interface ComparedAchievements {
   owner: {
     totalAchievementCount: number;
     unlockedAchievementCount: number;
+    achievementsPointsEarnedSum?: number;
   };
   target: {
     displayName: string;
     profileImageUrl: string;
     totalAchievementCount: number;
     unlockedAchievementCount: number;
+    achievementsPointsEarnedSum: number;
   };
   achievements: {
     hidden: boolean;