package addview

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

type ScheduleInputData struct {
	Value    string
	Error    string
	Valid    string
	Disabled bool
}

templ scheduleInputContainer() {
	@ScheduleInput(ScheduleInputData{})
	<script>
        document.addEventListener('DOMContentLoaded', () => htmx.trigger('#schedule-input-group', 'change'))
    </script>
}

templ ScheduleInput(data ScheduleInputData) {
	<div
		id="schedule-input-group"
		class="form-control w-full my-auto"
		hx-get="/htmx/subreddits/validate/schedule"
		hx-trigger="change, input delay:1s"
		hx-include="this"
		hx-target="this"
		hx-swap="outerHTML"
	>
		<label class="label">
			<span
				class={ utils.CX(map[string]bool{
                        "label-text": true,
                        "text-error": data.Error != "",
                        "text-success": data.Valid != "",
                        "text-base": true,
                    }) }
			>Schedule</span>
			<div class="tooltip" data-tip="Whether to enable scheduler or not">
				if data.Disabled {
					<input type="checkbox" name="enable_schedule" value="1" class="toggle toggle-primary"/>
				} else {
					<input type="checkbox" name="enable_schedule" value="1" class="toggle toggle-primary" checked/>
				}
			</div>
		</label>
		if data.Disabled {
			<input name="schedule" type="text" placeholder="e.g. '@daily' or '0 0 * * MON'" class="input input-bordered" disabled/>
		} else {
			<input
				name="schedule"
				type="text"
				placeholder="e.g. '@daily' or '0 0 * * MON'"
				value={ data.Value }
				class={ utils.CX(map[string]bool{
                    "input": true,
                    "input-bordered": true,
                    "input-error": data.Error != "",
                    "text-error": data.Error != "",
                    "input-success": data.Valid != "",
                    "text-success": data.Valid != "",
                }) }
			/>
		}
		<div class="label">
			<span
				class={ utils.CX(map[string]bool{
                            "label-text": true,
                            "text-error": data.Error != "",
                            "text-success": data.Valid != "",
                            "min-h-[1rem]": true,
                        }) }
			>
				if data.Valid != "" {
					{ data.Valid }
				} else {
					{ data.Error }
				}
			</span>
		</div>
	</div>
}