package site

import (
	"fmt"
	"github.com/delaneyj/toolbelt"
)

type ClickToLoadSignals struct {
	Limit  int `json:"limit"`
	Offset int `json:"offset"`
}

templ ClickToLoadAgentRow(i int) {
	<tr
		id={ fmt.Sprintf("agent_%d", i) }
	>
		<td class="text-center">Agent Smith</td>
		<td class="text-center">{ fmt.Sprintf("void%d@null.org", i+1) }</td>
		<td class="text-center uppercase">{ fmt.Sprintf("%x", toolbelt.AliasHash(fmt.Sprint(i))) }</td>
	</tr>
}

templ ClickToLoadMoreButton(input *ClickToLoadSignals) {
	<button
		id="more_btn"
		class="w-full btn btn-success"
		data-on-click={ fmt.Sprintf(
			"console.log('click to load more');offset.value=%d; limit.value=%d; sse('/examples/click_to_load/data', {method:'get',useViewTransitions:false})",
			input.Offset+input.Limit,input.Limit,
			) }
	>
		Load More
	</button>
}

templ ClickToEditAgentsTable(input *ClickToLoadSignals) {
	<div
		id="click_to_load"
		class="flex flex-col gap-2"
		data-signals={ templ.JSONString(input) }
	>
		<table class="table table-zebra">
			<caption>Agents</caption>
			<thead>
				<tr>
					<th>Name</th>
					<th>Email</th>
					<th>ID</th>
				</tr>
			</thead>
			<tbody
				id="click_to_load_rows"
				data-signals={ templ.JSONString(input) }
			>
				for i := 0; i < input.Limit; i++ {
					@ClickToLoadAgentRow(i + input.Offset)
				}
			</tbody>
		</table>
		@ClickToLoadMoreButton(input)
	</div>
}