Try to fix thumb up / down

This commit is contained in:
Leonardo Segala 2025-08-02 12:47:16 +02:00
parent f4a4c46fbc
commit 01cf53c775

View file

@ -7,9 +7,8 @@
let picked_suggestions: string[] = $state([]) let picked_suggestions: string[] = $state([])
async function vote(idx: number, amount: number, songId: string) { async function vote(amount: number, songId: string) {
if (picked_suggestions.includes(songId)) return console.log("rejecting vote") if (picked_suggestions.includes(songId)) return console.log("rejecting vote")
suggestions[idx].upvote += amount
await fetch(`/api/song/voting?room=${roomId}&song=${songId}&increment=${amount}`, { method: "POST" }) await fetch(`/api/song/voting?room=${roomId}&song=${songId}&increment=${amount}`, { method: "POST" })
picked_suggestions.push(songId) picked_suggestions.push(songId)
console.log("accepted vote") console.log("accepted vote")
@ -26,7 +25,7 @@
<p>No suggestions yet! Try to add a new one using the Add button</p> <p>No suggestions yet! Try to add a new one using the Add button</p>
{/if} {/if}
{#each suggestions as sug, idx} {#each suggestions as sug}
<div <div
class="flex h-[80px] w-full flex-row gap-2 rounded-md border-dark-pine-muted bg-light-pine-overlay p-2 shadow-md duration-100 hover:bg-dark-pine-base/20 dark:bg-dark-pine-overlay hover:dark:bg-light-pine-base/20" class="flex h-[80px] w-full flex-row gap-2 rounded-md border-dark-pine-muted bg-light-pine-overlay p-2 shadow-md duration-100 hover:bg-dark-pine-base/20 dark:bg-dark-pine-overlay hover:dark:bg-light-pine-base/20"
> >
@ -48,7 +47,8 @@
class={!picked_suggestions.includes(sug.uuid) ? "text-light-pine-green duration-100 hover:scale-150 dark:text-dark-pine-green" : "text-light-pine-muted dark:text-dark-pine-muted"} class={!picked_suggestions.includes(sug.uuid) ? "text-light-pine-green duration-100 hover:scale-150 dark:text-dark-pine-green" : "text-light-pine-muted dark:text-dark-pine-muted"}
disabled={!!picked_suggestions.includes(sug.uuid)} disabled={!!picked_suggestions.includes(sug.uuid)}
onclick={async () => { onclick={async () => {
await vote(idx, 1, sug.uuid) sug.upvode += 1
await vote(1, sug.uuid)
}}><ThumbsUp /></button }}><ThumbsUp /></button
> >
<p class="font-semibold text-light-pine-text dark:text-dark-pine-text">{sug.upvote}</p> <p class="font-semibold text-light-pine-text dark:text-dark-pine-text">{sug.upvote}</p>
@ -56,7 +56,8 @@
class={!picked_suggestions.includes(sug.uuid) ? "text-light-pine-red duration-100 hover:scale-150 dark:text-dark-pine-red" : "text-light-pine-muted dark:text-dark-pine-muted"} class={!picked_suggestions.includes(sug.uuid) ? "text-light-pine-red duration-100 hover:scale-150 dark:text-dark-pine-red" : "text-light-pine-muted dark:text-dark-pine-muted"}
disabled={!!picked_suggestions.includes(sug.uuid)} disabled={!!picked_suggestions.includes(sug.uuid)}
onclick={async () => { onclick={async () => {
await vote(idx, -1, sug.uuid) sug.upvode += 1
await vote(-1, sug.uuid)
}}><ThumbsDown /></button }}><ThumbsDown /></button
> >
</div> </div>