Spaces:
Sleeping
Sleeping
File size: 2,092 Bytes
df2ef4f |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 |
/**
* v0 by Vercel.
* @see https://v0.dev/t/OH0xMc8eRYc
* Documentation: https://v0.dev/docs#integrating-generated-code-into-your-nextjs-app
*/
import Button from "./buttons/Button"
import Modal from 'react-modal';
import { GameId } from "../../convex/aiTown/ids"
import { Id } from "../../convex/_generated/dataModel"
import { ServerGame } from "@/hooks/serverGame"
import { useState } from "react"
import { VoteModal } from "./VoteModal";
import { useSendInput } from "../hooks/sendInput";
export default function LLMVote(
{
game,
engineId,
playerId,
}: {
engineId: Id<'engines'>,
game: ServerGame,
playerId: GameId<'players'>,
}
) {
const [isModalOpen, setIsModalOpen] = useState(false)
const [votes, setVotes] = useState<GameId<'players'>[]>([]);
const players = [...game.world.playersInit.values()].filter(
(player) => player.id !== playerId
)
const inputVote = useSendInput(engineId, "llmVote");
const totalLLMs = players.filter((player) => !player.human).length
return (
<>
<Button onClick={() => setIsModalOpen(true)} className="lg:block">
Choose LLM
</Button>
<Modal
isOpen={isModalOpen}
onRequestClose={() => setIsModalOpen(false)}
contentLabel="Choose LLM"
ariaHideApp={false}
className="mx-auto bg-brown-800 p-16 game-frame font-body max-w-[1000px]"
style={{
content: {
position: 'absolute',
top: '50%',
left: '30%',
transform: 'translate(-20%, -50%)',
},
}}
>
<h2 className="text-2xl font-bold text-center mb-8">Which players are LLMs ? (Choose up to {totalLLMs} players)</h2>
<div className="max-w-[600px] w-full mx-auto">
<VoteModal compact={false} votes={votes} players={players} onVote={(newVotes) => {
setVotes(newVotes)
inputVote({voter: playerId, votedPlayerIds: newVotes});
}} engineId={engineId} game={game} playerId={playerId} maxVotes={totalLLMs} />
</div>
</Modal>
</>
)
}
|