From 8f80d3c098b2b6740d1b74d37a7bc2bfb75a34ea Mon Sep 17 00:00:00 2001
From: warlock <Sewmina Arch>
Date: Thu, 3 Apr 2025 04:45:57 +0530
Subject: [PATCH] more refactor

---
 src/components/GameModal.tsx |  12 +--
 src/components/Home.tsx      | 189 -----------------------------------
 src/data/games.ts            |   6 --
 src/shared/solana_helpers.ts |   2 +-
 src/types/Game.ts            |   6 ++
 5 files changed, 11 insertions(+), 204 deletions(-)
 delete mode 100644 src/components/Home.tsx
 create mode 100644 src/types/Game.ts

diff --git a/src/components/GameModal.tsx b/src/components/GameModal.tsx
index 692eb28..fda9399 100644
--- a/src/components/GameModal.tsx
+++ b/src/components/GameModal.tsx
@@ -1,17 +1,13 @@
 "use client";
 
-import { useEffect, useState } from "react";
-import { ConnectedSolanaWallet, usePrivy, useSolanaWallets } from "@privy-io/react-auth";
-import { Connection, PublicKey } from "@solana/web3.js";
-import { AnchorProvider, Program, BN } from "@coral-xyz/anchor";
-import idl from "../idl/bets_idl.json"; // Ensure this is the correct IDL path
+import { useState } from "react";
+import { usePrivy, useSolanaWallets } from "@privy-io/react-auth";
 import { toast } from "sonner";
-import { Bets } from "@/idl/bets";
-import { Game, games } from "../data/games"; // Assuming you have a games data file
+import { games } from "../data/games"; // Assuming you have a games data file
 import { PriceSelection } from "./PriceSelection";
 import { GameSelection } from "./GameSelection";
-import { CLUSTER_URL } from "@/data/shared";
 import { createBet } from "@/shared/solana_helpers";
+import { Game } from "@/types/Game";
 
  // Change to Mainnet when deploying
 
diff --git a/src/components/Home.tsx b/src/components/Home.tsx
deleted file mode 100644
index d2df02d..0000000
--- a/src/components/Home.tsx
+++ /dev/null
@@ -1,189 +0,0 @@
-"use client";
-
-import { useState } from "react";
-import Image from "next/image";
-import OpenGames from "./OpenGames";
-import { Game, games } from "../data/games";
-import { usePrivy } from "@privy-io/react-auth";
-import { toast } from "react-toastify";
-
-export default function HeroSection() {
-  const {  authenticated } = usePrivy();
-  const [isModalOpen, setIsModalOpen] = useState(false);
-  const [isGameModalOpen, setIsGameModalOpen] = useState(false);
-  const [selectedGame, setSelectedGame] = useState<Game | null>(null);
-  const [selectedPrice, setSelectedPrice] = useState<number | null>(null);
-
-  const prices = [0.2, 0.5, 0.8];
-
-  const handleGameSelect = (game: Game) => setSelectedGame(game);
-  const handlePriceSelect = (price: number) => setSelectedPrice(price);
-
-  const handleCreateGame = () => {
-    if (!authenticated) return; // Don't proceed if not signed in
-
-    if (selectedGame && selectedPrice !== null) {
-      console.log(`Creating game: ${selectedGame.name} with price ${selectedPrice} SOL`);
-      setIsGameModalOpen(false);
-    } else {
-      toast.warn("Please select a game and a price.");
-    }
-  };
-
-  const closeModals = () => {
-    setIsModalOpen(false);
-    setIsGameModalOpen(false);
-  };
-
-  return (
-    <>
-      <section className="flex flex-col items-center text-center py-16">
-        <Image
-          src="/duelfiassets/Playing on Arcade Machine no BG.png"
-          alt="DuelFi Hero"
-          width={150}
-          height={50}
-          className="mb-6"
-        />
-
-        <h1 className="text-4xl font-bold text-white">
-          Instant <span className="text-[rgb(248,144,22)]">Duels</span>, Instant{" "}
-          <span className="text-[rgb(248,144,22)]">Wins</span>
-        </h1>
-
-        <button
-          className="mt-12 px-12 py-4 bg-[rgb(248,144,22)] hover:bg-white text-black text-sm font-semibold rounded-xl flex items-center gap-2 transition duration-300 hover:scale-110"
-          onClick={() => setIsGameModalOpen(true)}
-        >
-          Create a Game
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            className="w-5 h-5"
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            strokeWidth="2"
-            strokeLinecap="round"
-            strokeLinejoin="round"
-          >
-            <path d="M7 7h10v10" />
-            <path d="M7 17 17 7" />
-          </svg>
-        </button>
-
-        <p
-          className="mt-4 text-gray-400 cursor-pointer hover:underline font-mono"
-          onClick={() => setIsModalOpen(true)}
-        >
-          How it works?..
-        </p>
-
-        <OpenGames />
-      </section>
-
-      {/* Game Modal */}
-      {isGameModalOpen && (
-        <div className="fixed inset-0 bg-black/70 flex justify-center items-start pt-10 z-50" onClick={closeModals}>
-          <div
-            className="bg-[rgb(30,30,30)] text-white w-full max-w-lg p-6 rounded-2xl shadow-lg transform transition-transform duration-300 animate-slide-down"
-            onClick={(e) => e.stopPropagation()}
-          >
-            <h2 className="text-xl font-bold mb-4">Create Game</h2>
-
-            {/* Game Selection */}
-            <div className="grid grid-cols-3 gap-4 mb-6">
-              {games.map((game) => (
-                <div
-                  key={game.id}
-                  className={`p-4 cursor-pointer rounded-xl border-2 transform transition-transform duration-500
-                  ${selectedGame?.id === game.id ? "scale-110 border-orange-500" : "scale-100 border-transparent"}
-                  hover:scale-105 hover:translate-y-[-5px] hover:border-orange-500`}
-                  onClick={() => handleGameSelect(game)}
-                >
-                  <Image
-                    src={game.thumbnail}
-                    alt={game.name}
-                    width={100}
-                    height={100}
-                    className="mb-2 rounded-md"
-                  />
-                  <h3 className="text-center text-sm">{game.name}</h3>
-                </div>
-              ))}
-            </div>
-
-            {/* Price Selection */}
-            <div className="mb-6 space-y-2">
-              {prices.map((price) => (
-                <p
-                  key={price}
-                  className={`flex items-center gap-2 text-gray-400 font-mono cursor-pointer transition-transform duration-500
-                  ${selectedPrice === price ? "text-white translate-x-2" : ""}`}
-                  onClick={() => handlePriceSelect(price)}
-                >
-                  <Image
-                    src="/duelfiassets/solana logo.png"
-                    alt="SOL"
-                    width={16}
-                    height={16}
-                    className="inline"
-                  />
-                  {price} SOL
-                </p>
-              ))}
-            </div>
-
-            {/* Create Game Button */}
-            <button
-              className={`mt-6 w-full py-2 rounded-xl font-semibold transition
-                ${authenticated ? "bg-[rgb(248,144,22)] text-black hover:bg-white hover:scale-105" : "bg-gray-600 text-gray-400 cursor-not-allowed"}
-              `}
-              onClick={handleCreateGame}
-              disabled={!authenticated}
-            >
-              Create Game
-            </button>
-
-            {/* Warning if Not Signed In */}
-            {!authenticated && (
-              <p className="text-red-500 text-sm text-center mt-2">Please sign in first</p>
-            )}
-          </div>
-        </div>
-      )}
-
-      {/* How it Works Modal */}
-      {isModalOpen && (
-        <div className="fixed inset-0 bg-black/70 flex justify-center items-start pt-10 z-50" onClick={closeModals}>
-          <div
-            className="bg-[rgb(30,30,30)] text-white w-full max-w-lg p-6 rounded-2xl shadow-lg transform transition-transform duration-300 animate-slide-down"
-            onClick={(e) => e.stopPropagation()}
-          >
-            <h2 className="text-xl font-bold mb-4">How It Works</h2>
-
-            <div className="space-y-4">
-              {[
-                { step: "Connect Your Wallet", desc: "Start by linking your wallet securely." },
-                { step: "Create or Join Game", desc: "Pick a game and set a wager, or join an existing match." },
-                { step: "Place Your Bet", desc: "Confirm your wager and get ready to play." },
-                { step: "Claim Your Winnings", desc: "Win the game and collect your rewards instantly!" },
-              ].map(({ step, desc }, index) => (
-                <div key={index}>
-                  <h3 className="text-[rgb(248,144,22)] font-bold text-lg">{index + 1}. {step}</h3>
-                  <p className="text-xs text-gray-400 font-mono">{desc}</p>
-                </div>
-              ))}
-            </div>
-
-            <button
-              className="mt-6 w-full bg-[rgb(248,144,22)] text-black font-semibold py-2 rounded-xl transition hover:bg-white hover:scale-105"
-              onClick={() => setIsModalOpen(false)}
-            >
-              Okay
-            </button>
-          </div>
-        </div>
-      )}
-    </>
-  );
-}
diff --git a/src/data/games.ts b/src/data/games.ts
index 5ecac92..542ed26 100644
--- a/src/data/games.ts
+++ b/src/data/games.ts
@@ -19,9 +19,3 @@ export const games = [
   },
 ];
 
-export interface Game {
-    id: string;
-    name: string;
-    entryFee: string;
-    thumbnail: string;
-  }
\ No newline at end of file
diff --git a/src/shared/solana_helpers.ts b/src/shared/solana_helpers.ts
index 79822ab..df4bce8 100644
--- a/src/shared/solana_helpers.ts
+++ b/src/shared/solana_helpers.ts
@@ -6,7 +6,7 @@ import { Connection, Keypair, LAMPORTS_PER_SOL, PublicKey } from "@solana/web3.j
 import idl from "../idl/bets_idl.json";
 import { Bet } from "@/types/Bet";
 import { toast } from "sonner";
-import { Game } from "@/data/games";
+import { Game } from "@/types/Game";
 
 
 export const fetchOpenBets = async (wallets: ConnectedSolanaWallet): Promise<Bet[]> => {
diff --git a/src/types/Game.ts b/src/types/Game.ts
new file mode 100644
index 0000000..a68ff0c
--- /dev/null
+++ b/src/types/Game.ts
@@ -0,0 +1,6 @@
+export interface Game {
+    id: string;
+    name: string;
+    entryFee: string;
+    thumbnail: string;
+  }
\ No newline at end of file