Code cleanup

src/App.tsx

@@ -3,7 +3,6 @@ import InitialView from "./components/InitialView";
 import GameView from "./components/GameView";
 import AppContextProvider from "./context/AppContextProvider";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import GameContextProvider from "./context/GameContextProvider";
 
 const queryClient = new QueryClient();
 
@@ -18,13 +17,7 @@ export default function App() {
   return (
     <QueryClientProvider client={queryClient}>
       <AppContextProvider>
-        {isGameStarted ? (
-          <GameContextProvider>
-            <GameView />
-          </GameContextProvider>
-        ) : (
-          <InitialView startGame={startGame} />
-        )}
+        {isGameStarted ? <GameView /> : <InitialView startGame={startGame} />}
       </AppContextProvider>
     </QueryClientProvider>
   );

src/components/DoomCanvas/DoomCanvas.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useRef } from "react";
-import { EmscriptenModule, NewGameResponse } from "../../types";
+import { EGameType, EmscriptenModule, NewGameResponse } from "../../types";
 import { useAppContext } from "../../context/useAppContext";
 import { HydraMultiplayer } from "../../utils/hydra-multiplayer";
 import useKeys from "../../hooks/useKeys";
@@ -15,7 +15,7 @@ const DoomCanvas: React.FC = () => {
   } = useAppContext();
   const keys = useKeys();
   const url =
-    type === "host"
+    type === EGameType.HOST
       ? `${SERVER_URL}new_game?address=${keys.address}`
       : `${SERVER_URL}add_player?address=${keys.address}&id=${code}`;
   const newGameQuery = useQuery<NewGameResponse>({

src/components/GameView/GameView.tsx

@@ -2,7 +2,6 @@ import { MdContentCopy } from "react-icons/md";
 import { ClipboardAPI, useClipboard } from "use-clipboard-copy";
 import Card from "../Card";
 import DoomCanvas from "../DoomCanvas";
-import GlobalTotals from "../GlobalTotals";
 import GlobalTPS from "../GlobalTPS";
 import HydraHeadLiveTxs from "../HydraHeadLiveTxs";
 import Layout from "../Layout";
@@ -13,6 +12,7 @@ import TopLinks from "../TopLinks";
 import { useCallback } from "react";
 import { FaRegCircleCheck } from "react-icons/fa6";
 import { useAppContext } from "../../context/useAppContext";
+import { EGameType } from "../../types";
 
 const GameView = () => {
   const { gameData } = useAppContext();
@@ -34,7 +34,6 @@ const GameView = () => {
       <RestartButton />
       <div className="grid grid-cols-[max-content_1fr_max-content] container gap-16 items-center">
         <div className="w-80 flex flex-col gap-4">
-          {/* <GlobalTotals size="sm" titleAlign="left" /> */}
           <StatsCard
             data={[
               { label: "Transactions:", value: "106,791,272" },
@@ -54,7 +53,7 @@ const GameView = () => {
           <Card className="h-[40rem]">
             <DoomCanvas />
           </Card>
-          {gameData.type === "host" && (
+          {gameData.type === EGameType.HOST && (
             <Card className="px-4 py-2 text-center text-xl text-white flex items-center gap-2 justify-center">
               Share this URL with friends{" "}
               <a

src/components/GlobalLeaderBoard/GlobalLeaderBoard.tsx

@@ -1,31 +1,26 @@
-import { useAppContext } from "../../context/useAppContext";
 import LeaderboardTable from "../LeaderboardTable";
 import Tabs from "../Tabs";
 
 const GlobalLeaderBoard = () => {
-  const { globalQuery } = useAppContext();
-  const kills = globalQuery?.data?.kills_leaderboard;
-  const items = globalQuery?.data?.items_leaderboard;
-  const secrets = globalQuery?.data?.secrets_leaderboard;
+  const kills = undefined;
+  const items = undefined;
+  const secrets = undefined;
 
   const tabs = [
     {
       id: 0,
       title: "Kills",
-      // content: kills && <LeaderboardTable data={kills} />,
-      content: null,
+      content: kills && <LeaderboardTable data={kills} />,
     },
     {
       id: 1,
       title: "Items",
-      // content: items && <LeaderboardTable data={items} />,
-      content: null,
+      content: items && <LeaderboardTable data={items} />,
     },
     {
       id: 2,
       title: "Secret",
-      // content: secrets && <LeaderboardTable data={secrets} />,
-      content: null,
+      content: secrets && <LeaderboardTable data={secrets} />,
     },
   ];
 

src/components/InitialView/InitialView.tsx

@@ -1,14 +1,12 @@
 import { FC, useEffect, useState } from "react";
 import Button from "../Button";
-import GlobalLeaderBoard from "../GlobalLeaderBoard";
-import GlobalTPS from "../GlobalTPS";
 import hydraText from "../../assets/images/hydra-text.png";
 import Modal from "../Modal";
 import SelectContinentDialog from "../SelectContinentDialog";
 import Layout from "../Layout";
-import GlobalTotals from "../GlobalTotals";
 import SetNameModal from "../SetNameModal";
 import { useAppContext } from "../../context/useAppContext";
+import { EGameType } from "../../types";
 
 interface InitialViewProps {
   startGame: () => void;
@@ -25,15 +23,15 @@ const InitialView: FC<InitialViewProps> = ({ startGame }) => {
   });
   const [isWelcomeModalOpen, setIsWelcomeModalOpen] = useState(false);
   const [isNameModalOpen, setIsNameModalOpen] = useState(
-    pathSegments[0] === "join",
+    pathSegments[0] === EGameType.JOIN,
   );
   const [isSelectContinentModalOpen, setIsSelectContinentModalOpen] =
     useState(false);
   const code = pathSegments[1];
 
   useEffect(() => {
     if (code) {
-      setGameData((prev) => ({ ...prev, code: code, type: "join" }));
+      setGameData((prev) => ({ ...prev, code: code, type: EGameType.JOIN }));
     }
   }, [code, setGameData]);
 
@@ -43,7 +41,7 @@ const InitialView: FC<InitialViewProps> = ({ startGame }) => {
       ...prev,
       code: "",
       petName: "",
-      type: "solo",
+      type: EGameType.SOLO,
     }));
   };
 
@@ -55,7 +53,7 @@ const InitialView: FC<InitialViewProps> = ({ startGame }) => {
       },
     });
     setIsNameModalOpen(true);
-    setGameData((prev) => ({ ...prev, type: "host" }));
+    setGameData((prev) => ({ ...prev, type: EGameType.HOST }));
   };
 
   const handleClickJoinMultiplayer = () => {
@@ -65,7 +63,7 @@ const InitialView: FC<InitialViewProps> = ({ startGame }) => {
         startGame();
       },
     });
-    setGameData((prev) => ({ ...prev, type: "join" }));
+    setGameData((prev) => ({ ...prev, type: EGameType.JOIN }));
     setIsNameModalOpen(true);
   };
 
@@ -87,13 +85,6 @@ const InitialView: FC<InitialViewProps> = ({ startGame }) => {
           Join Multiplayer
         </Button>
       </div>
-      <div className="grid grid-cols-2 max-w-6xl w-full mt-32 gap-8 py-6">
-        <div className="flex flex-col gap-4">
-          {/* <GlobalTotals size="lg" /> */}
-          {/* <GlobalTPS size="lg" /> */}
-        </div>
-        <div>{/* <GlobalLeaderBoard /> */}</div>
-      </div>
 
       <Modal
         isOpen={isWelcomeModalOpen}

src/context/AppContextProvider.tsx

@@ -1,35 +1,25 @@
 import { FC, PropsWithChildren, useMemo, useState } from "react";
-import { useQuery } from "@tanstack/react-query";
 import { AppContext } from "./useAppContext";
-import { GameStatistics, Region } from "../types";
 import { REGIONS } from "../constants";
+import { EGameType, Region } from "../types";
 
 const AppContextProvider: FC<PropsWithChildren> = ({ children }) => {
   const [gameData, setGameData] = useState({
-    petName: "",
     code: "",
+    petName: "",
+    type: EGameType.SOLO,
   });
 
   const [region, setRegion] = useState<Region>(REGIONS[0]);
-  const globalQuery = useQuery<GameStatistics>({
-    queryKey: ["global"],
-    queryFn: async () => {
-      return Promise.resolve(undefined as unknown as GameStatistics);
-    },
-    refetchInterval: 1000,
-  });
 
   const value = useMemo(
     () => ({
-      globalQuery,
-      // newGameQuery,
-      // joinGameQuery,
-      region,
-      setRegion,
       gameData,
+      region,
       setGameData,
+      setRegion,
     }),
-    [gameData, globalQuery, region],
+    [gameData, region],
   );
 
   return <AppContext.Provider value={value}>{children}</AppContext.Provider>;

src/context/useAppContext.ts

@@ -1,19 +1,16 @@
 import { createContext, Dispatch, useContext } from "react";
-import { GameData, GameStatistics, Region } from "../types";
-import { UseQueryResult } from "@tanstack/react-query";
+import { EGameType, GameData, Region } from "../types";
 import { REGIONS } from "../constants";
 
 interface AppContextInterface {
   gameData: GameData;
-  globalQuery?: UseQueryResult<GameStatistics, Error>;
   region: Region;
   setGameData: Dispatch<React.SetStateAction<GameData>>;
   setRegion: Dispatch<React.SetStateAction<Region>>;
 }
 
 export const AppContext = createContext<AppContextInterface>({
-  gameData: { petName: "", code: "", type: "solo" },
-  globalQuery: undefined,
+  gameData: { petName: "", code: "", type: EGameType.SOLO },
   region: REGIONS[0],
   setGameData: () => {},
   setRegion: () => {},

src/types.ts

@@ -63,17 +63,21 @@ export interface EmscriptenModule {
   print?: (text: string) => void;
   printErr?: (text: string) => void;
   setStatus?: (text: string) => void;
-
   _malloc?: (size: number) => number;
   _free?: (ptr: number) => void;
-
   _ReceivePacket?: (from: number, buf: number, len: number) => void;
 }
 
+export enum EGameType {
+  SOLO = "solo",
+  HOST = "host",
+  JOIN = "join",
+}
+
 export interface GameData {
   code: string;
   petName: string;
-  type: "host" | "join" | "solo";
+  type: EGameType;
 }
 
 declare global {

src/utils/game.ts

@@ -1,9 +1,9 @@
-import { GameData } from "../types";
+import { EGameType, GameData } from "../types";
 
 export const getArgs = ({ type, code, petName }: GameData) => {
   const args = ["-window", "-nogui", "-nomusic", "-config", "default.cfg"];
 
-  if (type !== "solo") {
+  if (type !== EGameType.SOLO) {
     args.push("-iwad", "freedoom2.wad", "-file", "Cardano.wad", "-deathmatch");
     if (code) {
       args.push("-connect", "1");