diff --git a/web/public/images/events/cops/0.gif b/web/public/images/events/cops/0.gif
deleted file mode 100644
index df40eaab..00000000
Binary files a/web/public/images/events/cops/0.gif and /dev/null differ
diff --git a/web/public/images/events/cops/1.gif b/web/public/images/events/cops/1.gif
index c606edb2..6e8eabd5 100644
Binary files a/web/public/images/events/cops/1.gif and b/web/public/images/events/cops/1.gif differ
diff --git a/web/public/images/events/cops/2.gif b/web/public/images/events/cops/2.gif
index df8244db..df40eaab 100644
Binary files a/web/public/images/events/cops/2.gif and b/web/public/images/events/cops/2.gif differ
diff --git a/web/public/images/events/cops/3.gif b/web/public/images/events/cops/3.gif
index 63007b1c..c606edb2 100644
Binary files a/web/public/images/events/cops/3.gif and b/web/public/images/events/cops/3.gif differ
diff --git a/web/public/images/events/cops/4.gif b/web/public/images/events/cops/4.gif
index 0e1fc6b8..ddbe4162 100644
Binary files a/web/public/images/events/cops/4.gif and b/web/public/images/events/cops/4.gif differ
diff --git a/web/public/images/events/cops/6-intro.gif b/web/public/images/events/cops/6-intro.gif
new file mode 100644
index 00000000..0a395d5f
Binary files /dev/null and b/web/public/images/events/cops/6-intro.gif differ
diff --git a/web/public/images/events/cops/6.gif b/web/public/images/events/cops/6.gif
index 0e1fc6b8..df7c07f0 100644
Binary files a/web/public/images/events/cops/6.gif and b/web/public/images/events/cops/6.gif differ
diff --git a/web/public/images/events/cops/7.gif b/web/public/images/events/cops/7.gif
deleted file mode 100644
index 0e1fc6b8..00000000
Binary files a/web/public/images/events/cops/7.gif and /dev/null differ
diff --git a/web/public/images/events/gang/0.gif b/web/public/images/events/gang/0.gif
deleted file mode 100644
index 50ef36bc..00000000
Binary files a/web/public/images/events/gang/0.gif and /dev/null differ
diff --git a/web/public/images/events/gang/1.gif b/web/public/images/events/gang/1.gif
index e9a865ca..50ef36bc 100644
Binary files a/web/public/images/events/gang/1.gif and b/web/public/images/events/gang/1.gif differ
diff --git a/web/public/images/events/gang/2.gif b/web/public/images/events/gang/2.gif
index 111fc865..e9a865ca 100644
Binary files a/web/public/images/events/gang/2.gif and b/web/public/images/events/gang/2.gif differ
diff --git a/web/public/images/events/gang/3.gif b/web/public/images/events/gang/3.gif
index 5e801790..53ab5fed 100644
Binary files a/web/public/images/events/gang/3.gif and b/web/public/images/events/gang/3.gif differ
diff --git a/web/public/images/events/gang/5.gif b/web/public/images/events/gang/5.gif
index 53ab5fed..111fc865 100644
Binary files a/web/public/images/events/gang/5.gif and b/web/public/images/events/gang/5.gif differ
diff --git a/web/public/images/events/gang/6.gif b/web/public/images/events/gang/6.gif
index 308d8e71..5e801790 100644
Binary files a/web/public/images/events/gang/6.gif and b/web/public/images/events/gang/6.gif differ
diff --git a/web/public/images/events/gang/7.gif b/web/public/images/events/gang/7.gif
deleted file mode 100644
index b03c0a39..00000000
Binary files a/web/public/images/events/gang/7.gif and /dev/null differ
diff --git a/web/src/components/icons/items/PlasticBag.tsx b/web/src/components/icons/items/PlasticBag.tsx
index 84f19f9c..766fc91c 100644
--- a/web/src/components/icons/items/PlasticBag.tsx
+++ b/web/src/components/icons/items/PlasticBag.tsx
@@ -3,15 +3,12 @@ import { Icon, IconProps } from "..";
export const PlasticBag = (props: IconProps) => {
return (
- <>
-
- >
);
};
diff --git a/web/src/components/layout/Header.tsx b/web/src/components/layout/Header.tsx
index 6d717a1d..29bea26e 100644
--- a/web/src/components/layout/Header.tsx
+++ b/web/src/components/layout/Header.tsx
@@ -1,13 +1,14 @@
import { MediaPlayer, MobileMenu } from "@/components/layout";
-import { Connect } from "@/components/wallet";
+import { Connect, TokenBalance } from "@/components/wallet";
import { useConfigStore, useGameStore, useRouterContext } from "@/dojo/hooks";
import { initSoundStore } from "@/hooks/sound";
import { headerStyles } from "@/theme/styles";
import { IsMobile, formatCashHeader } from "@/utils/ui";
-import { Divider, Flex, HStack } from "@chakra-ui/react";
+import { Card, Divider, Flex, HStack } from "@chakra-ui/react";
import { useAccount } from "@starknet-react/core";
import { observer } from "mobx-react-lite";
import { useEffect } from "react";
+import { PaperIcon } from "../icons";
import { ClaimReward } from "../pages/home";
import { ProfileLink } from "../pages/profile/Profile";
import { CashIndicator, DayIndicator, HealthIndicator } from "../player";
@@ -51,12 +52,12 @@ export const Header = observer(({ back }: HeaderProps) => {
- {/* {!game && (
- <>
- {config?.ryoAddress.paper && }
- {account && }
- >
- )} */}
+ {!gameId && account && (
+
+
+
+ )}
+
{!gameId && }
diff --git a/web/src/components/pages/home/HallOfFame.tsx b/web/src/components/pages/home/HallOfFame.tsx
index 3e1357d7..80b47b1b 100644
--- a/web/src/components/pages/home/HallOfFame.tsx
+++ b/web/src/components/pages/home/HallOfFame.tsx
@@ -1,4 +1,5 @@
import { HustlerIcon } from "@/components/hustlers";
+import { PaperIcon } from "@/components/icons";
import { Loader } from "@/components/layout/Loader";
import { useConfigStore, useDojoContext, useRouterContext } from "@/dojo/hooks";
import { useGameById } from "@/dojo/hooks/useGameById";
@@ -28,6 +29,7 @@ export const HallOfFame = observer(() => {
{hallOfFame
.filter((i) => i.version !== config?.ryo?.leaderboard_version)
+ .sort((a, b) => b.version - a.version)
.map((i, index) => {
return ;
})}
@@ -42,6 +44,7 @@ const HallOfFameEntry = ({ entry, account }: { entry: Leaderboard; account: Acco
const { game, isFetched } = useGameById(entry.game_id);
const isSelf = useMemo(() => {
+ if(!account) return false
return account?.address === game?.player_id;
}, [account?.address, game?.player_id]);
@@ -57,15 +60,8 @@ const HallOfFameEntry = ({ entry, account }: { entry: Leaderboard; account: Acco
if (!isFetched) return null;
return (
-
-
-
- SEASON {entry.version}
-
- {formatCash(entry.paper_balance).replace("$", "")} PAPER
-
-
-
+
+
{game && (
- {shortString.decodeShortString(game?.player_name)}
+ {shortString.decodeShortString(game?.player_name)} {isSelf && ("(you)")}
{formatCash(entry.high_score)}
)}
{!game && No winner!}
+
+
+ SEASON {entry.version}
+
+ {formatCash(entry.paper_balance).replace("$", "")}
+
+
);
diff --git a/web/src/components/pages/home/Leaderboard.tsx b/web/src/components/pages/home/Leaderboard.tsx
index 1c79a175..51a5d32d 100644
--- a/web/src/components/pages/home/Leaderboard.tsx
+++ b/web/src/components/pages/home/Leaderboard.tsx
@@ -10,7 +10,7 @@ import { useAccount } from "@starknet-react/core";
import { observer } from "mobx-react-lite";
import { useEffect, useRef, useState } from "react";
import Countdown from "react-countdown";
-import { Arrow, Skull } from "../../icons";
+import { Arrow, PaperIcon, Skull } from "../../icons";
const renderer = ({
days,
@@ -57,8 +57,15 @@ export const Leaderboard = observer(({ nameEntry, ...props }: { nameEntry?: bool
//const { leaderboard, isFetchingLeaderboard } = useLeaderboardByVersion(selectedVersion);
const { hallOfFame, isFetchingHallOfFame } = useHallOfFame();
- const maxIndex = hallOfFame.length > 0 ? hallOfFame.length - 1 : 0;
- const [selectedIndex, setSelectedIndex] = useState(maxIndex);
+
+ const [maxIndex, setMaxIndex] = useState(0);
+ const [selectedIndex, setSelectedIndex] = useState(0);
+
+ useEffect(() => {
+ const maxIndex = hallOfFame.length > 0 ? hallOfFame.length - 1 : 0;
+ setMaxIndex(maxIndex);
+ setSelectedIndex(maxIndex);
+ }, [hallOfFame]);
const { leaderboardEntries, isFetchingLeaderboardEntries } = useLeaderboardEntries(
hallOfFame[selectedIndex]?.version || 0,
@@ -97,7 +104,8 @@ export const Leaderboard = observer(({ nameEntry, ...props }: { nameEntry?: bool
SEASON {hallOfFame[selectedIndex]?.version} REWARDS
- {formatCash(hallOfFame[selectedIndex]?.paper_balance || 0).replace("$", "")} PAPER
+
+ {formatCash(hallOfFame[selectedIndex]?.paper_balance || 0).replace("$", "")}
{
+export const TokenBalance = ({ address, token, icon }: { address?: string; token?: string, icon?: React.FC }) => {
// infinite loop with sn.js 6
// const { data: balance } = useBalance({ address, token, /*watch: true, refetchInterval:5_000*/ });
const { balance, isInitializing } = useTokenBalance({ address, token, refetchInterval: 5_000 });
@@ -20,7 +21,10 @@ export const TokenBalance = ({ address, token }: { address?: string; token?: str
{isInitializing ? (
) : (
+ <>
+ {icon && icon({width:"16px", height:"16px"})}
{formatCash(formatEther(balance)).replace("$", "") || 0}
+ >
)}
{/* {iconsBySymbol[balance?.symbol as iconsBySymbolKeys] && iconsBySymbol[balance?.symbol as iconsBySymbolKeys]({})} */}
{/* {balance?.symbol || "?"} */}
diff --git a/web/src/pages/index.tsx b/web/src/pages/index.tsx
index 075af527..0a1fc640 100644
--- a/web/src/pages/index.tsx
+++ b/web/src/pages/index.tsx
@@ -65,7 +65,7 @@ export default function Home() {
HALL OF FAME
-
+
diff --git a/web/src/theme/components/tabs.tsx b/web/src/theme/components/tabs.tsx
index 5bf960f9..163355b3 100644
--- a/web/src/theme/components/tabs.tsx
+++ b/web/src/theme/components/tabs.tsx
@@ -18,7 +18,7 @@ const baseStyle = definePartsStyle({
color: "neon.300",
...cardPixelatedStyle({ radius: 6, pixelSize: 1 }),
bg: "transparent",
- border: "2px solid",
+ border: "0",
borderColor: "neon.700",
},
},