use new api structure

src/components/GameComponent.tsx

@@ -23,8 +23,8 @@ export default function GameComponent() {
       if (response.ok) {
         const data = await response.json();
 
-        if (data.data) {
-          setGame(data.data as GameObject);
+        if (data) {
+          setGame(data as GameObject);
         }
       }
     }

src/components/Layout.tsx

@@ -2,7 +2,7 @@ import type { ReactNode } from "react";
 
 export default function Layout({ children }: { children: ReactNode }) {
   return (
-    <div className="bg-black text-white min-h-screen flex flex-col items-center mx-auto select-none">
+    <div className="bg-black text-white min-h-screen flex flex-col items-center sm:justify-center mx-auto select-none">
       <div className="w-full sm:w-[500px] relative">{children}</div>
     </div>
   );

src/components/MusicComponent.tsx

@@ -12,7 +12,7 @@ export default function MusicComponent() {
         const response = await fetch("https://api.alexav.gg/v4/social/music");
         if (response.ok) {
           const data = await response.json();
-          setMusic(data.data as LastFMMusicObject);
+          setMusic(data as LastFMMusicObject);
         } else setFailedFetch(true);
       } catch (e) {
         console.error("Failed to fetch music!", e);

src/components/TVComponent.tsx

@@ -27,9 +27,9 @@ export default function TVComponent() {
       );
       if (response.ok) {
         const data = await response.json();
-        if (data.data && data.data.length <= 0) {
+        if (data && data.length <= 0) {
           setFailedFetch(true);
-        } else setShow(data.data[0] as TVObject);
+        } else setShow(data[0] as TVObject);
       } else setFailedFetch(true);
     }