package put

import "github.com/tigorlazuardi/redmage/views"
import "github.com/tigorlazuardi/redmage/views/components"

type Data struct {
	Title          string
	EditMode       bool
	PostAction     string
	NameInput      NameInputData
	TypeInput      TypeInputData
	ScheduleInput  ScheduleInputData
	CountbackInput CountbackInputData
}

templ View(c *views.Context, data Data) {
	@components.Doctype() {
		@components.Head(c, components.HeadTitle(data.Title))
		@components.Body(c) {
			@Content(c, data)
			@components.NotificationContainer()
		}
	}
}

templ Content(c *views.Context, data Data) {
	<main class="prose min-w-full">
		@components.Container() {
			<h1>{ data.Title }</h1>
			<div class="divider"></div>
			<form
				action={ templ.SafeURL(data.PostAction) }
				method="POST"
				hx-post={ data.PostAction }
				hx-target-error={ components.NotificationContainerID }
			>
				<div
					class="grid grid-cols-1 sm:grid-cols-2 gap-4"
				>
					if !data.EditMode {
						@NameInput(data.NameInput)
					}
					if !data.EditMode {
						@TypeInput(data.TypeInput)
					}
					<div class="sm:col-span-2">
						@ScheduleInput(data.ScheduleInput)
					</div>
					<div class="sm:col-span-2">
						@CountbackInput(data.CountbackInput)
					</div>
					if !data.EditMode {
						<div class="sm:col-span-2">
							<div class="max-w-xs mx-auto">
								@FetchCheckbox()
							</div>
						</div>
					}
				</div>
				<button type="submit" class="block btn btn-primary mx-auto w-full max-w-xs mt-8 text-primary-content">
					if data.EditMode {
						Save
					} else {
						Add
					}
				</button>
			</form>
		}
	</main>
}