game-master/src/app/_components/lobby/create-lobby-dialog.tsx

52 lines
1.3 KiB
TypeScript

"use client";
import React from "react";
import { Button } from "@/components/ui/button";
import { Icons } from "@/components/icons";
import { cn } from "@/lib/utils";
import {
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import LobbyForm from "./lobby-form";
function CreateLobbyDialog({ className }: { className?: string }) {
const [open, setOpen] = React.useState(false);
return (
<Dialog open={open} onOpenChange={setOpen}>
<DialogTrigger asChild>
<Button
size={"xxl"}
variant={"party"}
className={cn(
"text-shadow-primary text-primary-foreground font-black",
className,
)}
>
<>
<Icons.logo className="size-6" />
Create Lobby
</>
</Button>
</DialogTrigger>
<DialogContent className="container-bg bg-background/10">
<DialogHeader>
<DialogTitle className="text-shadow-primary text-4xl font-black uppercase">
Create Lobby
</DialogTitle>
<DialogDescription></DialogDescription>
</DialogHeader>
<LobbyForm cb={() => setOpen(false)} />
</DialogContent>
</Dialog>
);
}
export default CreateLobbyDialog;