package workout

templ WorkoutComp(currentDate string) {
	<main class="mx-2">
		<form
			class="max-w-xl mx-auto flex flex-col gap-4 justify-center mt-10"
			hx-post="/api/workout"
			hx-target="#workout-placeholder"
			hx-swap="outerHTML"
		>
			<h2 class="text-4xl mb-8">Track your workout</h2>
			<input id="date" type="date" class="" value={ currentDate } name="date"/>
			<select class="w-full" name="type">
				<option>Push Ups</option>
				<option>Pull Ups</option>
			</select>
			<input type="number" class="" placeholder="Sets" name="sets"/>
			<input type="number" class="" placeholder="Reps" name="reps"/>
			<button class="self-end">Save</button>
		</form>
		<div hx-get="/api/workout" hx-trigger="load"></div>
	</main>
}

type Workout struct {
	Id   string
	Date string
	Type string
	Sets string
	Reps string
}

templ WorkoutListComp(workouts []Workout) {
	<div class="overflow-x-auto mx-auto max-w-lg">
		<h2 class="text-4xl mt-14 mb-8">Workout history</h2>
		<table class="table table-auto max-w-full">
			<thead>
				<tr>
					<th>Date</th>
					<th>Type</th>
					<th>Sets</th>
					<th>Reps</th>
					<th></th>
				</tr>
			</thead>
			<tbody>
				<tr class="hidden" id="workout-placeholder"></tr>
				for _,w := range workouts {
					@WorkoutItemComp(w, false)
				}
			</tbody>
		</table>
	</div>
}

templ WorkoutItemComp(w Workout, includePlaceholder bool) {
	if includePlaceholder {
		<tr class="hidden" id="workout-placeholder"></tr>
	}
	<tr>
		<th>{ w.Date }</th>
		<th>{ w.Type }</th>
		<th>{ w.Sets }</th>
		<th>{ w.Reps }</th>
		<th>
			<div class="tooltip" data-tip="Delete Entry">
				<button hx-delete={ "api/workout/" + w.Id } hx-target="closest tr" type="submit">
					Delete
				</button>
			</div>
		</th>
	</tr>
}