Added counter for steam game counts

src/pages/Dashboard.jsx

@@ -1,11 +1,13 @@
 import React, {useEffect, useState} from 'react';
 import {Link, useNavigate} from 'react-router-dom';
 import {useTranslation} from 'react-i18next';
+import SteamGameCount from '../components/SteamGameCount';
 
 const Dashboard = () => {
     const {t} = useTranslation();
     const navigate = useNavigate();
     const [userData, setUserData] = useState(null);
+    const [steamData, setSteamData] = useState({count: 0, hasSteamId: false});
     const [isLoading, setIsLoading] = useState(true);
     const [error, setError] = useState(null);
 
@@ -19,7 +21,7 @@ const Dashboard = () => {
             }
 
             try {
-                const response = await fetch(`${import.meta.env.VITE_API_URL}/api/users/me?v=1`, {
+                const profileResponse = await fetch(`${import.meta.env.VITE_API_URL}/api/users/me?v=1`, {
                     method: 'GET',
                     headers: {
                         'Authorization': `Bearer ${token}`,
@@ -27,10 +29,29 @@ const Dashboard = () => {
                     }
                 });
 
-                if (response.ok) {
-                    const data = await response.json();
+                if (profileResponse.ok) {
+                    const data = await profileResponse.json();
                     setUserData(data);
-                } else if (response.status === 401) {
+
+                    // If user has a steamId, fetch game count from Core Service
+                    if (data.steamId) {
+                        try {
+                            const steamResponse = await fetch(`${import.meta.env.VITE_CORE_API_URL}/api/steam/games-count`, {
+                                method: 'GET',
+                                headers: {
+                                    'Authorization': `Bearer ${token}`,
+                                    'Content-Type': 'application/json'
+                                }
+                            });
+                            if (steamResponse.ok) {
+                                const steamJson = await steamResponse.json();
+                                setSteamData(steamJson);
+                            }
+                        } catch (steamErr) {
+                            console.error('Error fetching steam data:', steamErr);
+                        }
+                    }
+                } else if (profileResponse.status === 401) {
                     localStorage.removeItem('tbp_jwt');
                     navigate('/login');
                 } else {
@@ -45,7 +66,7 @@ const Dashboard = () => {
         };
 
         fetchUserData();
-    }, [navigate]);
+    }, [navigate, t]);
 
     if (isLoading) {
         return (
@@ -77,12 +98,17 @@ const Dashboard = () => {
                 </div>
 
                 <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+                    {steamData.hasSteamId && (
+                        <SteamGameCount targetCount={steamData.count} />
+                    )}
                     <div className="bg-white dark:bg-slate-800 h-40 rounded-xl shadow-sm border border-slate-200 dark:border-slate-700 flex items-center justify-center">
                         <span className="text-slate-400 dark:text-slate-500">Tile 1 (Coming soon)</span>
                     </div>
-                    <div className="bg-white dark:bg-slate-800 h-40 rounded-xl shadow-sm border border-slate-200 dark:border-slate-700 flex items-center justify-center">
-                        <span className="text-slate-400 dark:text-slate-500">Tile 2 (Coming soon)</span>
-                    </div>
+                    {!steamData.hasSteamId && (
+                        <div className="bg-white dark:bg-slate-800 h-40 rounded-xl shadow-sm border border-slate-200 dark:border-slate-700 flex items-center justify-center">
+                            <span className="text-slate-400 dark:text-slate-500">Tile 2 (Coming soon)</span>
+                        </div>
+                    )}
                     <Link
                         to="/settings"
                         className="bg-white dark:bg-slate-800 h-40 rounded-xl shadow-sm border border-slate-200 dark:border-slate-700 flex flex-col items-center justify-center hover:border-blue-500 dark:hover:border-blue-500 transition-colors"