Remove pronosticos and show already voted ones

midudev · Jul 16, 2024 · c7e9c37 · c7e9c37
1 parent 3b8835f
commit c7e9c37
Show file tree

Hide file tree

Showing 7 changed files with 138 additions and 183 deletions.
diff --git a/auth.config.js b/auth.config.js
@@ -1,12 +1,11 @@
-import Twitch from "@auth/core/providers/twitch"
 import { defineConfig } from "auth-astro"
 
 export default defineConfig({
 	providers: [
-		Twitch({
-			clientId: import.meta.env.TWITCH_CLIENT_ID,
-			clientSecret: import.meta.env.TWITCH_CLIENT_SECRET,
-		}),
+		// Twitch({
+		// 	clientId: import.meta.env.TWITCH_CLIENT_ID,
+		// 	clientSecret: import.meta.env.TWITCH_CLIENT_SECRET,
+		// }),
 	],
 	callbacks: {
 		session: ({ session, token }) => ({

diff --git a/src/components/Velocimetro.astro b/src/components/Velocimetro.astro
@@ -1,16 +1,22 @@
-<canvas id="velocimeter" width="500px" height="260px" class="w-full md:w-[500px]"></canvas>
+---
+const { id } = Astro.props
+---
 
-<script>
-	import { $ } from "@/lib/dom-selector"
+<canvas
+	id={`velocimeter-${id}`}
+	width="500px"
+	height="260px"
+	class="velocimeter w-full md:w-[500px]"></canvas>
 
+<script define:vars={{ id }}>
 	const COLORS = {
 		"accent": "#b4cd02",
 		"white": "#fff",
 		"white-50": "rgba(255, 255, 255, 0.5)",
 	}
 
 	document.addEventListener("astro:page-load", () => {
-		const canvas = $("#velocimeter") as HTMLCanvasElement
+		const canvas = document.querySelector(`#velocimeter-${id}`)
 		if (!canvas) return
 		const ctx = canvas.getContext("2d")
 
@@ -22,7 +28,7 @@
 			drawVelocimeter(velocimeterValue)
 		}
 
-		function drawVelocimeter(value: number) {
+		function drawVelocimeter(value) {
 			if (!ctx) return
 
 			const centerX = canvas.width / 2
@@ -95,8 +101,12 @@
 		updateVelocimeter()
 
 		window.addEventListener("forecast:loaded", (event) => {
-			const { detail } = event as CustomEvent<string>
-			canvas.setAttribute("data-percentage", detail)
+			const { detail } = event
+			const { combatId, percentage } = detail
+
+			if (combatId !== id) return
+
+			canvas.setAttribute("data-percentage", percentage)
 			updateVelocimeter()
 		})
 	})

diff --git a/src/consts/forecasts.ts b/src/consts/forecasts.ts
diff --git a/src/pages/api/votes/[combatId].ts b/src/pages/api/votes/[combatId].ts
@@ -1,9 +1,5 @@
 import type { APIRoute } from "astro"
-import { NOW, Votes, db } from "astro:db"
-import { getSession } from "auth-astro/server"
-import { object, safeParse, string } from "valibot"
-
-import { COMBATS } from "@/consts/combats"
+import { object, string } from "valibot"
 
 const VoteSchema = object({
 	voteId: string(),
@@ -17,56 +13,58 @@ const res = (
 	{ status, statusText, headers }: { status?: number; statusText?: string; headers?: Headers }
 ) => new Response(body, { status, statusText, headers })
 
-export const POST: APIRoute = async ({ params, request }) => {
-	const session = await getSession(request)
-
-	if (!session || session?.user?.email == null) {
-		return res("Unauthorized", { status: 401 })
-	}
-
-	const { combatId } = params
-	if (!combatId) return res("CombatId is required", { status: 400 })
-
-	const combatData = COMBATS.find((c) => c.id === combatId)
-	if (!combatData) return res("Combat not found", { status: 404 })
-
-	const { success, output } = safeParse(VoteSchema, await request.json())
-	if (!success) return res("Bad request", { status: 400 })
-
-	const { voteId } = output
-	let boxerData: string | undefined
-	if (combatData.teams !== undefined) {
-		boxerData = combatData.teams.find((t) => t === voteId)
-	} else {
-		boxerData = combatData.boxers.find((b) => b === voteId)
-	}
-	if (!boxerData) return res("Boxer not found", { status: 404 })
-
-	const userId = session.user.id
-
-	if (userId === undefined) {
-		return res("Unauthorized", { status: 401 })
-	}
-
-	const votedAt = NOW
-
-	const newId = `${userId}-${combatId}`
-	const vote = { id: newId, userId, votedAt, voteId, combatId }
-
-	try {
-		await db.insert(Votes).values(vote).onConflictDoUpdate({
-			target: Votes.id,
-			set: {
-				combatId,
-				userId,
-				voteId,
-				votedAt,
-			},
-		})
-	} catch (error) {
-		console.error(error)
-		return res("Error inserting vote", { status: 500 })
-	}
-
-	return res("OK", { status: 200 })
+export const POST: APIRoute = ({ params, request }) => {
+	return res("Unauthorized", { status: 401 })
+
+	// const session = await getSession(request)
+
+	// if (!session || session?.user?.email == null) {
+	// 	return res("Unauthorized", { status: 401 })
+	// }
+
+	// const { combatId } = params
+	// if (!combatId) return res("CombatId is required", { status: 400 })
+
+	// const combatData = COMBATS.find((c) => c.id === combatId)
+	// if (!combatData) return res("Combat not found", { status: 404 })
+
+	// const { success, output } = safeParse(VoteSchema, await request.json())
+	// if (!success) return res("Bad request", { status: 400 })
+
+	// const { voteId } = output
+	// let boxerData: string | undefined
+	// if (combatData.teams !== undefined) {
+	// 	boxerData = combatData.teams.find((t) => t === voteId)
+	// } else {
+	// 	boxerData = combatData.boxers.find((b) => b === voteId)
+	// }
+	// if (!boxerData) return res("Boxer not found", { status: 404 })
+
+	// const userId = session.user.id
+
+	// if (userId === undefined) {
+	// 	return res("Unauthorized", { status: 401 })
+	// }
+
+	// const votedAt = NOW
+
+	// const newId = `${userId}-${combatId}`
+	// const vote = { id: newId, userId, votedAt, voteId, combatId }
+
+	// try {
+	// 	await db.insert(Votes).values(vote).onConflictDoUpdate({
+	// 		target: Votes.id,
+	// 		set: {
+	// 			combatId,
+	// 			userId,
+	// 			voteId,
+	// 			votedAt,
+	// 		},
+	// 	})
+	// } catch (error) {
+	// 	console.error(error)
+	// 	return res("Error inserting vote", { status: 500 })
+	// }
+
+	// return res("OK", { status: 200 })
 }
diff --git a/src/pages/pronosticos.astro b/src/pages/pronosticos.astro
@@ -1,18 +1,15 @@
 ---
-import { getSession } from "auth-astro/server"
-
-import Intro from "@/components/Pronosticos/Intro.astro"
-import Vote from "@/components/Pronosticos/Vote.astro"
 import Layout from "@/layouts/Layout.astro"
 
-const session = await getSession(Astro.request)
+import { COMBATS } from "@/consts/combats"
+import Forecasts from "@/sections/Forecasts.astro"
 ---
 
 <Layout
 	title="Pronostica los ganadores - La Velada del Año IV"
 	description="¡Participa votando a los boxeadores que crees que ganarán sus combates!"
 >
 	<main class="flex flex-col items-center justify-center text-white">
-		{session === null ? <Intro /> : <Vote user={session.user} />}
+		{COMBATS.map((combat) => <Forecasts combatId={combat.id} />)}
 	</main>
 </Layout>
diff --git a/src/pages/pronosticos.astro copy.old b/src/pages/pronosticos.astro copy.old
@@ -0,0 +1,18 @@
+---
+import { getSession } from "auth-astro/server"
+
+import Intro from "@/components/Pronosticos/Intro.astro"
+import Vote from "@/components/Pronosticos/Vote.astro"
+import Layout from "@/layouts/Layout.astro"
+
+const session = await getSession(Astro.request)
+---
+
+<Layout
+	title="Pronostica los ganadores - La Velada del Año IV"
+	description="¡Participa votando a los boxeadores que crees que ganarán sus combates!"
+>
+	<main class="flex flex-col items-center justify-center text-white">
+		{session === null ? <Intro /> : <Vote user={session.user} />}
+	</main>
+</Layout>