30 lines
1 KiB
TypeScript
30 lines
1 KiB
TypeScript
"use client";
|
|
|
|
import { useCallback, useState } from "react";
|
|
import type { FlappyStats } from "@/app/(frontend)/flappy/actions";
|
|
import { useRealtimePresence } from "@/hooks/useRealtimePresence";
|
|
import { FlappyBird } from "./FlappyBird";
|
|
import { FlappyLeaderboard } from "./FlappyLeaderboard";
|
|
|
|
export function FlappyArena({
|
|
initialStats,
|
|
currentUserId,
|
|
}: {
|
|
initialStats: FlappyStats;
|
|
currentUserId: number | string;
|
|
}) {
|
|
const [refreshKey, setRefreshKey] = useState(0);
|
|
|
|
const [playing, setPlaying] = useState(false);
|
|
const activePilots = useRealtimePresence("flappy", playing, true);
|
|
const onPhaseChange = useCallback((phase: "ready" | "playing" | "over") => {
|
|
setPlaying(phase === "playing");
|
|
}, []);
|
|
|
|
return (
|
|
<div className="flex flex-col items-center gap-6">
|
|
<FlappyBird initialStats={initialStats} onGameRecorded={() => setRefreshKey((k) => k + 1)} onPhaseChange={onPhaseChange} />
|
|
<FlappyLeaderboard refreshKey={refreshKey} currentUserId={currentUserId} activePilots={activePilots} />
|
|
</div>
|
|
);
|
|
}
|