diff --git a/scenes/tournament/components/ActionSection.tsx b/scenes/tournament/components/ActionSection.tsx index 200c1afba..1cbc21f03 100644 --- a/scenes/tournament/components/ActionSection.tsx +++ b/scenes/tournament/components/ActionSection.tsx @@ -6,34 +6,42 @@ import s from "../styles/ActionSection.module.css"; export function ActionSection() { const [expanded, setExpanded] = createSignal(true); - const open = () => setExpanded(true); - const close = () => setExpanded(false); - const handleSpaceBarClick = (e: KeyboardEvent) => { - if (e.key === " ") { - e.preventDefault(); - e.stopPropagation(); - open(); - } - }; - return (
setExpanded(true)} + tabindex={!expanded() ? "0" : undefined} + role={!expanded() ? "button" : undefined} + onKeyDown={(e: KeyboardEvent) => { + if (e.key === " " || e.key === "Enter") { + e.preventDefault(); + setExpanded(true); + } + }} >
Register now
{expanded() && ( -
- -
- - -
+
e.stopPropagation()}> +
+ +
+ + +
+
)}
diff --git a/scenes/tournament/router.ts b/scenes/tournament/router.ts index 0aa0dba6e..7d63d8633 100644 --- a/scenes/tournament/router.ts +++ b/scenes/tournament/router.ts @@ -1,15 +1,29 @@ import { z } from "zod"; import { createRouter } from "../../utils/trpc-server"; -import { findTournamentByNameForUrl } from "./service"; +import { createTournamentTeam, findTournamentByNameForUrl } from "./service"; -export const tournament = createRouter().query("get", { - input: z.object({ - organization: z.string(), - tournament: z.string(), - }), - resolve: ({ input }) => - findTournamentByNameForUrl({ - organizationNameForUrl: input.organization, - tournamentNameForUrl: input.tournament, +export const tournament = createRouter() + .query("get", { + input: z.object({ + organization: z.string(), + tournament: z.string(), }), -}); + resolve: ({ input }) => + findTournamentByNameForUrl({ + organizationNameForUrl: input.organization, + tournamentNameForUrl: input.tournament, + }), + }) + .mutation("createTournamentTeam", { + input: z.object({ + // TODO: validator + name: z.string(), + tournamentId: z.number(), + }), + resolve: ({ input, ctx }) => + createTournamentTeam({ + userId: ctx.user!.id, + name: input.name, + tournamentId: input.tournamentId, + }), + }); diff --git a/scenes/tournament/service.ts b/scenes/tournament/service.ts index caa2b4e58..9839fafa4 100644 --- a/scenes/tournament/service.ts +++ b/scenes/tournament/service.ts @@ -79,3 +79,27 @@ function twitterToUrl(twitter: string | null) { function discordInviteToUrl(discordInvite: string) { return `https://discord.com/invite/${discordInvite}`; } + +export function createTournamentTeam({ + userId, + name, + tournamentId, +}: { + userId: number; + name: string; + tournamentId: number; +}) { + return prisma.tournamentTeam.create({ + data: { + name: name.trim(), + tournamentId, + members: { + create: { + memberId: userId, + tournamentId, + captain: true, + }, + }, + }, + }); +} diff --git a/scenes/tournament/styles/ActionSection.module.css b/scenes/tournament/styles/ActionSection.module.css index e0ab9ec1a..df93c1733 100644 --- a/scenes/tournament/styles/ActionSection.module.css +++ b/scenes/tournament/styles/ActionSection.module.css @@ -9,15 +9,17 @@ display: flex; flex-direction: column; align-items: center; + cursor: pointer; } -.container:hover { +.container:hover, +.container:focus { background-color: var(--bg-lighter); - cursor: pointer; } .active { background-color: var(--bg-lighter); + cursor: auto; } .header {