import prisma from "app/lib/db"
import React from "react"
import { letterCase } from "app/lib/functions"
export default async function GenreCheckboxes() {
	async function getGenres() {
		"use server"
		const genres = await prisma.genre.findMany()
		return genres
	}
	const genres = await getGenres()
	const genreCheckboxes = genres.map(e => {
		const label = letterCase(e.name)
		return (<React.Fragment key={`fragment${e.name}`}>
			<input type="checkbox" id={e.name} key={`genreCheckboxInput${e.id}`} />
			<label htmlFor={e.name} key={`genreCheckboxLabel${e.id}`}>{label}</label>
		</React.Fragment>
		)
	})
	return <>{genreCheckboxes}</>

}