feat(dashboard): Steam avatar and a banner from the most played game

src/hooks/useSteamProfile.js

@@ -0,0 +1,35 @@
+import {useEffect, useState} from 'react';
+
+/**
+ * The user's Steam name and avatar from Core, or null while loading, without a Steam ID or on any error. Only
+ * decoration, so a failed call shows the default icon and never ends the session. Loads again for a new token
+ * (new Steam ID or another login) on the next render, e.g. the next navigation.
+ */
+export default function useSteamProfile(enabled) {
+    const [profile, setProfile] = useState(null);
+    const token = localStorage.getItem('tbp_jwt');
+
+    useEffect(() => {
+        if (!enabled || !token) {
+            setProfile(null);
+            return undefined;
+        }
+        let cancelled = false;
+        (async () => {
+            try {
+                const response = await fetch(`${import.meta.env.VITE_CORE_API_URL}/api/library/steam-profile`, {
+                    headers: {'Authorization': `Bearer ${token}`},
+                });
+                const data = response.ok ? await response.json() : null;
+                if (!cancelled) setProfile(data);
+            } catch {
+                if (!cancelled) setProfile(null);
+            }
+        })();
+        return () => {
+            cancelled = true;
+        };
+    }, [enabled, token]);
+
+    return profile;
+}