diff --git a/app/components/leaderboard/leaderboard.tsx b/app/components/leaderboard/leaderboard.tsx index 3707505..0839de5 100644 --- a/app/components/leaderboard/leaderboard.tsx +++ b/app/components/leaderboard/leaderboard.tsx @@ -38,6 +38,7 @@ const Leaderboard: FunctionComponent = ({ ); const [error, setError] = useState(undefined); const [currentResult, setCurrentResult] = useState(); + const enableSearch = false; useEffect(() => { if (!isLoaded || isInit) return; @@ -128,11 +129,14 @@ const Leaderboard: FunctionComponent = ({ return (
- +
The game has ended
+ {enableSearch ? ( + + ) : null}
diff --git a/app/components/leaderboard/leaderboardWrapper.tsx b/app/components/leaderboard/leaderboardWrapper.tsx index 9a1eb09..b09aa14 100644 --- a/app/components/leaderboard/leaderboardWrapper.tsx +++ b/app/components/leaderboard/leaderboardWrapper.tsx @@ -1,35 +1,89 @@ "use client"; import React from "next"; -import { FunctionComponent, useEffect, useState } from "react"; +import { FunctionComponent } from "react"; import { LeaderboardData } from "@/constants/types"; -import { getWinners } from "@/services/leaderboardService"; import Leaderboard from "./leaderboard"; const LeaderboardWrapper: FunctionComponent = () => { - const [isLoaded, setIsLoaded] = useState(false); - const [data, setData] = useState(); - const [participants, setParticipants] = useState(0); + // const [isLoaded, setIsLoaded] = useState(false); + // const [data, setData] = useState(); + // const [participants, setParticipants] = useState(3607); + const participants = 3607; + const winners: LeaderboardData[] = [ + { + address: + "0x075f829bfd061ea938d7f8e399db70ac410b719cb1f0a321ce1d80dca44fbbd0", + rank: 1, + times_clicked: 1, + reward: "5", + }, + { + address: "0xcd61a050a000af3093cdbbf536717356b709683b", + rank: 2, + times_clicked: 1, + }, + { + address: "0x27674c788249dbe99e8e5f12cafe1f1c8b9e7a12", + rank: 3, + times_clicked: 1, + }, + { + address: + "0x0625eb7e2a2b279eeaff6edd753abfd82f5e2fd0f69af0b2ab6528f8e517d9df", + rank: 4, + times_clicked: 1, + }, + { + address: "0x84ef5a8fcfd2873d053dbc76276a98801ed081e1", + rank: 5, + times_clicked: 1, + }, + { + address: + "0x04e1ec4b3f6c8658f4e2adc0237fac75cf9b20aecb0638597e3cb8d26c0d9519", + rank: 6, + times_clicked: 1, + }, + { + address: "0x611f08e009a02b77d1ce331e01b616b93ee5738c", + rank: 7, + times_clicked: 1, + }, + { + address: + "0x07fbe54431c250c3560ffa44b1d7d57b056e320dade627ff6123466dc081b0b7", + rank: 8, + times_clicked: 1, + }, + { + address: + "0x04d25fa97c8080069ba27839f12691bb13ea74ccdb89a55b576fa3d2d8b39d48", + rank: 9, + times_clicked: 10, + }, + { + address: "0xf6400fe683ab896001caca296e6940c819b68449", + rank: 10, + times_clicked: 1, + }, + ]; - useEffect(() => { - if (isLoaded) return; - getWinners() - .then((res) => { - setData(res.winners); - setParticipants(res.nb_players); - setIsLoaded(true); - }) - .catch((err) => { - console.log("Error while fetching tracking virtualTxId", err); - }); - }); + // useEffect(() => { + // if (isLoaded) return; + // getWinners() + // .then((res) => { + // setData(res.winners); + // setParticipants(res.nb_players); + // setIsLoaded(true); + // }) + // .catch((err) => { + // console.log("Error while fetching tracking virtualTxId", err); + // }); + // }); return ( - + ); }; diff --git a/app/page.tsx b/app/page.tsx index b4e7b5b..4498e2e 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -109,7 +109,8 @@ export default function Home() { const [showNotifPlayed, setShowNotifPlayed] = useState(false); const [showErrorMsg, setShowErrorMsg] = useState(false); const [errorMsg, setErrorMsg] = useState(""); - const [leaderboard, setLeaderboard] = useState(false); + // const [leaderboard, setLeaderboard] = useState(false); + const leaderboard = true; const [maintenance, setMaintenance] = useState(false); const unexpectedError = isUnexpectedError(); @@ -185,7 +186,7 @@ export default function Home() { useEffect(() => { if (!isLoaded && process.env.NEXT_PUBLIC_ENABLE_LEADERBOARD === "true") { - setLeaderboard(true); + // setLeaderboard(true); setIsLoaded(true); } }, []); @@ -653,7 +654,9 @@ export default function Home() { return ( <> - {maintenance ? ( + {leaderboard ? ( + + ) : maintenance ? ( - ) : leaderboard ? ( - ) : ( <>
@@ -741,7 +742,7 @@ export default function Home() { icon={} enableHover={false} > - {priceValue} + {priceValue as string} ) ) : null} diff --git a/app/styles/leaderboard.module.css b/app/styles/leaderboard.module.css index 2ada00c..3d239dc 100644 --- a/app/styles/leaderboard.module.css +++ b/app/styles/leaderboard.module.css @@ -78,6 +78,26 @@ margin: 10px auto; } +.searchTitle { + display: flex; + flex-direction: column; + gap: 12px; + position: relative; + width: 500px; + height: 200px; + margin: auto; + justify-content: center; + text-align: center; + + color: var(--content); + font-family: "Airstrike"; + font-size: 32px; + font-style: normal; + font-weight: 700; + line-height: 32px; + letter-spacing: 0.04em; +} + @media (max-width: 1024px) { .tableSection { padding: 24px; @@ -93,6 +113,10 @@ height: 104px; margin: 10px auto; } + .searchTitle { + width: 350px; + height: 90px; + } } @media (max-width: 490px) { @@ -110,4 +134,8 @@ height: 71px; margin: 10px auto; } + .searchTitle { + width: 250px; + height: 65px; + } }