diff --git a/src/app/game/berry-dash/leaderboards/page.tsx b/src/app/game/berry-dash/leaderboards/page.tsx index 9b72075..78f071f 100644 --- a/src/app/game/berry-dash/leaderboards/page.tsx +++ b/src/app/game/berry-dash/leaderboards/page.tsx @@ -2,10 +2,11 @@ import { BackButton } from '@/app/components/BackButton' import { DiscordButton } from '@/app/components/DiscordButton' -import { useEffect, useState } from 'react' +import { useCallback, useEffect, useState } from 'react' import { BirdColor } from '../chatroom/page' import axios from 'axios' import { GetIconForUser } from '@/util/bd' +import Image from 'next/image' interface LeaderboardEntry { id: number @@ -24,7 +25,7 @@ export default function BerryDashLeaderboards () { const [gettingEntries, setGettingEntries] = useState(false) const [entries, setEntries] = useState([]) - const Refresh = async () => { + const Refresh = useCallback(async () => { setGettingEntries(true) try { const result = await axios.get( @@ -46,15 +47,15 @@ export default function BerryDashLeaderboards () { setEntries([]) } setGettingEntries(false) - } + }, [selected, selectedBerryOption]) useEffect(() => { document.title = 'Lncvrt Games - Berry Dash Leaderboards' }, []) useEffect(() => { - if (selected != -1) Refresh() - }, [selected]) + if (selected != -1) setTimeout(() => Refresh(), 0) + }, [selected, Refresh]) return (
@@ -81,7 +82,13 @@ export default function BerryDashLeaderboards () { - + + + @@ -97,7 +104,7 @@ export default function BerryDashLeaderboards () { className='flex justify-between items-center' >
-

{item.username} (#{index + 1}) @@ -129,6 +138,25 @@ export default function BerryDashLeaderboards () { ) })}

+ {selected == 1 && ( +
+ +
+ )} )}
diff --git a/src/app/globals.css b/src/app/globals.css index e20a331..62e5fe8 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -71,6 +71,10 @@ select { @apply bg-(--col4) hover:bg-(--col5) border border-(--col6) hover:border-(--col8) hover:-translate-y-0.5 rounded-lg px-4 py-2 inline-block transition-all duration-200 cursor-pointer; } +button:disabled { + @apply bg-(--col3) hover:bg-(--col4) border border-(--col5) hover:border-(--col7); +} + .top-button { @apply bg-(--col4) hover:bg-(--col5) border border-(--col6) hover:border-(--col7) hover:-translate-y-px rounded-full transition-all h-10 w-10 flex items-center justify-center; }