update game module to new endpoint

src/components/GameComponent.tsx

@@ -1,8 +1,10 @@
 import { useState, useEffect } from "react";
 
 type GameObject = {
-  gameextrainfo?: string;
-  gameid?: string;
+  game: string;
+  startedOn: number;
+  finishedAt?: number;
+  finished: boolean;
 };
 
 export default function GameComponent() {
@@ -11,10 +13,12 @@ export default function GameComponent() {
 
   useEffect(() => {
     async function fetchGame() {
-      const response = await fetch("https://api.alexav.gg/v4/social/steam");
+      const response = await fetch(
+        "https://api.alexav.gg/v4/tracker/latestGame"
+      );
       if (response.ok) {
         const data = await response.json();
-        if (data.data && data.data.gameextrainfo) {
+        if (data.data && data.data.game) {
           setGame(data.data as GameObject);
         } else setFailedFetch(true);
       } else setFailedFetch(true);
@@ -27,6 +31,23 @@ export default function GameComponent() {
   }, []);
 
   if (game) {
+    const dateOrTime = () => {
+      if (game.finished && game.finishedAt) {
+        const currentDate = new Date();
+        const finishedDate = new Date(game.finishedAt);
+
+        if (
+          currentDate.toLocaleDateString() === finishedDate.toLocaleDateString()
+        ) {
+          return `last played ${game.game} at ${finishedDate.toLocaleTimeString()}`;
+        } else {
+          return `last played ${game.game} on ${finishedDate.toLocaleDateString()}`;
+        }
+      } else {
+        return `playing ${game.game}`;
+      }
+    };
+
     return (
       <div className="flex align-middle">
         <a
@@ -34,7 +55,7 @@ export default function GameComponent() {
           href={`https://medal.tv/u/alexav`}
           target="_blank"
         >
-          <h1 className="lowercase">playing {game.gameextrainfo}</h1>
+          <h1 className="lowercase">{dateOrTime()}</h1>
         </a>
       </div>
     );