feat(achievements): dashboard card, library badge, 100 % hint and profile stats

src/pages/Dashboard.jsx

@@ -8,6 +8,7 @@ import {Badge} from '@/components/ui/badge';
 import {Button} from '@/components/ui/button';
 import {Card} from '@/components/ui/card';
 import {Skeleton} from '@/components/ui/skeleton';
+import AchievementsCard from '../components/AchievementsCard.jsx';
 import ActivityCard from '../components/ActivityCard.jsx';
 import CurrentlyPlayingCard from '../components/CurrentlyPlayingCard.jsx';
 import GameCover from '../components/GameCover.jsx';
@@ -46,6 +47,7 @@ const Dashboard = () => {
     const [playing, setPlaying] = useState([]);
     const [summary, setSummary] = useState(null);
     const [activity, setActivity] = useState(null);
+    const [achievements, setAchievements] = useState(null);
     const [summaryFailed, setSummaryFailed] = useState(false);
     const [shuffling, setShuffling] = useState(false);
     const [isLoading, setIsLoading] = useState(true);
@@ -137,6 +139,21 @@ const Dashboard = () => {
         }
     }, [expireSession]);
 
+    const fetchAchievements = useCallback(async () => {
+        try {
+            const r = await fetch(`${import.meta.env.VITE_CORE_API_URL}/api/library/achievements/summary`, {headers: authHeaders()});
+            if (r.status === 401) {
+                expireSession();
+                return;
+            }
+            if (r.ok) {
+                setAchievements(await r.json());
+            }
+        } catch (err) {
+            console.error('Error fetching achievements:', err);
+        }
+    }, [expireSession]);
+
     const shuffleSuggestion = async () => {
         setShuffling(true);
         if (!await fetchSummary(summary?.suggestion?.appid)) {
@@ -151,7 +168,8 @@ const Dashboard = () => {
         fetchPlaying();
         fetchSummary();
         fetchActivity();
-    }, [fetchSteamCount, fetchTopGames, fetchPlaying, fetchSummary, fetchActivity]);
+        fetchAchievements();
+    }, [fetchSteamCount, fetchTopGames, fetchPlaying, fetchSummary, fetchActivity, fetchAchievements]);
 
     useEffect(() => {
         const fetchUserData = async () => {
@@ -171,7 +189,7 @@ const Dashboard = () => {
                     setUserData(data);
 
                     if (data.steamId) {
-                        await Promise.all([fetchSteamCount(), fetchTopGames(), fetchPlaying(), fetchSummary(), fetchActivity()]);
+                        await Promise.all([fetchSteamCount(), fetchTopGames(), fetchPlaying(), fetchSummary(), fetchActivity(), fetchAchievements()]);
                     }
                 } else if (profileResponse.status === 401) {
                     expireSession();
@@ -187,7 +205,7 @@ const Dashboard = () => {
         };
 
         fetchUserData();
-    }, [navigate, expireSession, t, fetchSteamCount, fetchTopGames, fetchPlaying, fetchSummary, fetchActivity]);
+    }, [navigate, expireSession, t, fetchSteamCount, fetchTopGames, fetchPlaying, fetchSummary, fetchActivity, fetchAchievements]);
 
     const hasSteamId = !!userData?.steamId;
     const {appearance} = usePreferences();
@@ -340,6 +358,7 @@ const Dashboard = () => {
             )}
 
             {hasSteamId && activity && <ActivityCard activity={activity}/>}
+            {hasSteamId && achievements && <AchievementsCard summary={achievements}/>}
         </PageContainer>
     );
 };