Add Opus Seasons (#293)

* - add content relevant to opus seasons - switch environment from dark shuffle tournament to season - improve styles * fix build * approval fix
Provable-Games · Feb 10, 2025 · 5657a0c · 5657a0c
1 parent 4ffefcf
commit 5657a0c
Show file tree

Hide file tree

Showing 6 changed files with 70 additions and 73 deletions.
diff --git a/ui/.env b/ui/.env
@@ -1,6 +1,6 @@
 NEXT_PUBLIC_NETWORK="mainnet"
 NEXT_PUBLIC_TOURNAMENT_ENDED="true"
-NEXT_PUBLIC_SEASON_ACTIVE="false"
-NEXT_PUBLIC_DS_TOURNAMENT_ACTIVE="true"
+NEXT_PUBLIC_SEASON_ACTIVE="true"
+NEXT_PUBLIC_DS_TOURNAMENT_ACTIVE="false"
 NEXT_PUBLIC_DS_TOURNAMENT_ID=1
 NEXT_PUBLIC_DS_TOURNAMENT_START_TIME=1737727200
diff --git a/ui/src/app/components/start/CreateAdventurer.tsx b/ui/src/app/components/start/CreateAdventurer.tsx
@@ -144,16 +144,23 @@ export const CreateAdventurer = ({
   return (
     <>
       {step == 1 && (
-        <div className="flex flex-col w-full justify-between items-center gap-2 sm:gap-0 py-2 sm:py-10">
+        <div className="flex flex-col w-full justify-between items-center gap-5 sm:gap-0 py-2 sm:pt-10">
           {seasonActive ? (
             <div className="flex flex-col items-center w-full gap-2 sm:gap-5">
               <h3 className="uppercase text-center 2xl:text-5xl m-0">
-                Enter Season 0
+                Opus Season 1
               </h3>
               <p className="w-5/6 sm:text-xl text-center">
-                Introducing onchain seasons for Loot Survivor. This is the first
-                weekly season with a prize pool of:
+                We&apos;ve teamed up with Opus to sponsor on-chain tournaments
+                with $CASH prizes.{" "}
+                <a
+                  className="underline uppercase"
+                  href="https://www.opus.money/"
+                >
+                  Visit Opus
+                </a>
               </p>
+              <p className="sm:text-xl text-center">Ends 17/02 14:00 UTC</p>
               <div className="w-full sm:w-3/4">
                 {tournamentPrizes && (
                   <Prizes

diff --git a/ui/src/app/components/start/Prizes.tsx b/ui/src/app/components/start/Prizes.tsx
@@ -1,7 +1,5 @@
 import { TournamentTrophyIcon } from "@/app/components/icons/Icons";
 import { getOrdinalSuffix } from "@/app/lib/utils";
-import Lords from "public/icons/lords.svg";
-import { useEffect, useState } from "react";
 
 interface Prizes {
   prizes: any;
@@ -10,16 +8,16 @@ interface Prizes {
 
 const Prizes = ({ prizes, lordsDollarValue }: Prizes) => {
   const formattedPrizes = prizes.lsTournamentsV0TournamentPrizeModels.edges;
-  const [lordsDollar, setLordsDollar] = useState<bigint>(0n);
+  // const [lordsDollar, setLordsDollar] = useState<bigint>(0n);
 
-  const handleLordsDollarValue = async () => {
-    const value = await lordsDollarValue();
-    setLordsDollar(value);
-  };
+  // const handleLordsDollarValue = async () => {
+  //   const value = await lordsDollarValue();
+  //   setLordsDollar(value);
+  // };
 
-  useEffect(() => {
-    handleLordsDollarValue();
-  }, []);
+  // useEffect(() => {
+  //   handleLordsDollarValue();
+  // }, []);
 
   return (
     <>
@@ -41,7 +39,7 @@ const Prizes = ({ prizes, lordsDollarValue }: Prizes) => {
         return (
           <div
             key={index}
-            className="flex flex-row gap-5 overflow-scroll default-scroll"
+            className="flex flex-row gap-5 overflow-scroll item-scrol h-10"
           >
             {prizes.map((prize: any, index: any) => {
               const isERC20 = variant === "erc20";
@@ -52,39 +50,42 @@ const Prizes = ({ prizes, lordsDollarValue }: Prizes) => {
               );
 
               return (
-                <span key={index} className="flex flex-row items-center gap-2">
-                  <div className="flex flex-row gap-2 items-center">
-                    {prize.payout_position <= 3 && (
-                      <span
-                        className={`w-4 h-4 sm:w-8 sm:h-8 ${
-                          prize.payout_position === 1
-                            ? "text-terminal-gold"
-                            : prize.payout_position === 2
-                            ? "text-terminal-silver"
-                            : "text-terminal-bronze"
-                        }`}
-                      >
-                        <TournamentTrophyIcon />
-                      </span>
-                    )}
-                    <p className="flex text-2xl">
-                      {prize.payout_position}
-                      <sup className="text-sm">
-                        {getOrdinalSuffix(prize.payout_position).slice(1)}
-                      </sup>
-                    </p>
-                  </div>
-                  <span className="hidden sm:flex text-2xl">-</span>
-                  <Lords className="self-center w-4 h-4 sm:w-5 sm:h-5 fill-current" />
-                  <span className="text-terminal-green text-2xl">
-                    $
-                    {(
-                      (tokenValue * Number(lordsDollar)) /
-                      10 ** 8 /
-                      10 ** 18
-                    ).toFixed(2)}
+                <>
+                  {index > 0 && (
+                    <div className="h-1/2 min-w-[2px] bg-terminal-green self-center opacity-50" />
+                  )}
+                  <span
+                    key={index}
+                    className="flex flex-row items-center gap-2"
+                  >
+                    <div className="flex flex-row gap-2 items-center">
+                      {prize.payout_position <= 3 && (
+                        <span
+                          className={`w-4 h-4 sm:w-8 sm:h-8 ${
+                            prize.payout_position === 1
+                              ? "text-terminal-gold"
+                              : prize.payout_position === 2
+                              ? "text-terminal-silver"
+                              : "text-terminal-bronze"
+                          }`}
+                        >
+                          <TournamentTrophyIcon />
+                        </span>
+                      )}
+                      <p className="flex text-2xl">
+                        {prize.payout_position}
+                        <sup className="text-sm">
+                          {getOrdinalSuffix(prize.payout_position).slice(1)}
+                        </sup>
+                      </p>
+                    </div>
+                    <span className="hidden sm:flex text-2xl">-</span>
+                    {/* <Lords className="self-center w-4 h-4 sm:w-5 sm:h-5 fill-current" /> */}
+                    <span className="text-terminal-green text-2xl">
+                      ${tokenValue / 10 ** 18}
+                    </span>
                   </span>
-                </span>
+                </>
               );
             })}
           </div>

diff --git a/ui/src/app/components/start/SeasonDetails.tsx b/ui/src/app/components/start/SeasonDetails.tsx
@@ -19,7 +19,7 @@ const SeasonTable = ({ prizes, lordsValue }: SeasonDetailsProps) => {
       <div className="flex flex-col items-center border border-terminal-green b-5 bg-terminal-black text-terminal-green uppercase w-3/4">
         <div className="bg-terminal-green/75 w-full">
           <h1 className="m-0 p-2 text-lg sm:text-2xl text-terminal-black">
-            Season 0 Pool
+            Opus Season 1
           </h1>
         </div>
         <div className="flex flex-row w-full justify-between p-2 border-t border-terminal-green">
@@ -34,12 +34,8 @@ const SeasonTable = ({ prizes, lordsValue }: SeasonDetailsProps) => {
               <Lords className="self-center w-5 h-5 fill-current" />
               <p className="text-2xl">
                 $
-                {(
-                  (formattedPrizes[0].node.token_data_type.erc20?.token_amount *
-                    Number(lordsValue)) /
-                  10 ** 8 /
-                  10 ** 18
-                ).toFixed(2)}
+                {formattedPrizes[0].node.token_data_type.erc20?.token_amount /
+                  10 ** 18}
               </p>
             </div>
           </div>
@@ -56,12 +52,8 @@ const SeasonTable = ({ prizes, lordsValue }: SeasonDetailsProps) => {
               <Lords className="self-center w-5 h-5 fill-current" />
               <p className="text-2xl">
                 $
-                {(
-                  (formattedPrizes[1].node.token_data_type.erc20?.token_amount *
-                    Number(lordsValue)) /
-                  10 ** 8 /
-                  10 ** 18
-                ).toFixed(2)}
+                {formattedPrizes[1].node.token_data_type.erc20?.token_amount /
+                  10 ** 18}
               </p>
             </div>
           </div>
@@ -78,17 +70,14 @@ const SeasonTable = ({ prizes, lordsValue }: SeasonDetailsProps) => {
               <Lords className="self-center w-5 h-5 fill-current" />
               <p className="text-2xl">
                 $
-                {(
-                  (formattedPrizes[2].node.token_data_type.erc20?.token_amount *
-                    Number(lordsValue)) /
-                  10 ** 8 /
-                  10 ** 18
-                ).toFixed(2)}
+                {formattedPrizes[2].node.token_data_type.erc20?.token_amount /
+                  10 ** 18}
               </p>
             </div>
           </div>
         </div>
       </div>
+      <span className="uppercase text-lg">... more!</span>
     </div>
   );
 };

diff --git a/ui/src/app/lib/networkConfig.ts b/ui/src/app/lib/networkConfig.ts
@@ -67,7 +67,7 @@ export const networkConfig = {
     rendererAddress: "0x0",
     tournamentAddress:
       "0x3347382d530ff6acb9283ac1d78471187aae8a4690e9316bb4e3c3365ff7a86",
-    tournamentId: "0x1",
+    tournamentId: "0x4",
     appUrl: "https://lootsurvivor.io/",
     tournamentAppUrl: "https://tournaments.lootsurvivor.io/",
     beastsViewer:

diff --git a/ui/src/app/lib/utils/syscalls.ts b/ui/src/app/lib/utils/syscalls.ts
@@ -1658,17 +1658,17 @@ export function createSyscalls({
     const randomInt = getRandomInt(0, revenueAddresses.length - 1);
     const selectedRevenueAddress = revenueAddresses[randomInt];
 
+    const tournamentId = networkConfig[network!].tournamentId;
+
     const enterTournamentTx = {
       contractAddress: tournamentContractAddress,
       entrypoint: "enter_tournament",
       calldata: CallData.compile([
-        networkConfig[network!].tournamentId,
+        tournamentId,
         new CairoOption(CairoOptionVariant.None),
       ]),
     };
 
-    const tournamentId = networkConfig[network!].tournamentId;
-
     const startTournamentTx = {
       contractAddress: tournamentContractAddress,
       entrypoint: "start_tournament",
@@ -1709,7 +1709,7 @@ export function createSyscalls({
         freeVRF,
         (costToPlay ?? 0) + (seasonCost ?? 0),
         goldenTokenId,
-        blobertTokenId
+        goldenTokenId !== "0" ? "0" : blobertTokenId
       );
     }