package components

import "git.src.quest/~skye/felu-ddns/internal/config"
import "fmt"

func getDomainPattern() string {
	return fmt.Sprintf(".%s", config.FeluConfig.DNSPattern)
}

func getUpdateACommand() string {
	return fmt.Sprintf("curl \"https://%s/update/a?domain=THE_PART_YOU_DEFINE&api_key=THE_API_KEY\"",
		config.FeluConfig.APIUrl)
}

templ Manage() {
	@ManageBase("Manage") {
		<details class="bg-amber-200 p-2">
			<summary class="list-none flex border p-2 items-center cursor-pointer select-none">
				<div>Temp Docs, wip (click)</div>
			</summary>
			<div class="p-2 flex flex-col">
				<div class="flex flex-col">
					<p class="font-bold">Updating A Records automatically</p>
					<div class="">
						<p class="">
							The following should be ran via some automation, like a cron job.
							You are on your own till real docs are made.
						</p>
						<code>{ getUpdateACommand() }</code>
					</div>
				</div>
			</div>
		</details>
		<div class="bg-teal-200">
			<form class="flex flex-col p-2 gap-2" hx-post="/manage/domains" hx-target="#add_domain_error">
				<label for="domain">Domain</label>
				<div>
					<input class="border" type="text" placeholder="..." name="domain" id="domain"/>
					<span>{ getDomainPattern() }</span>
				</div>
				<label for="a_record">A Record</label>
				<input class="border" type="text" placeholder="..." name="a_record" id="a_record"/>
				<div class="text-rose-600 text-center" id="add_domain_error"></div>
				<button class="border p-1" type="submit">Add</button>
			</form>
		</div>

		<div hx-get="/manage/partials/domains" hx-trigger="load, update-domain-list from:body" hx-target="this">
		</div>
	}
}

templ ManageUser(currentEmail string) {
	@ManageBase("Settings") {
		<div class="bg-violet-200">
			<form class="flex flex-col p-2 gap-2" hx-confirm="Sure?" hx-post="/manage/user/password" hx-target="#update_password_error">
				<label for="current_password">Current Password</label>
				<input class="border" type="password" placeholder="..." name="current_password" id="current_password"/>
				<label for="new_password">New Password</label>
				<input class="border" type="password" placeholder="..." name="new_password" id="new_password"/>
				<label for="confirm_new_password">Confirm</label>
				<input class="border" type="password" placeholder="..." name="confirm_new_password" id="confirm_new_password"/>
				<div class="text-rose-600 text-center" id="update_password_error"></div>
				<button class="border p-1">Update</button>
			</form>
		</div>
		<div class="bg-emerald-200">
			<form class="flex flex-col p-2 gap-2" hx-confirm="Sure?" hx-post="/manage/user/email" hx-target="#update_email_error">
				<label for="email">Email</label>
				<div>
					<input class="border" type="text" placeholder="..." name="email" id="email" value={ currentEmail }/>
					<input class="border" type="reset"/>
				</div>
				<div class="text-rose-600 text-center" id="update_email_error"></div>
				<button class="border p-1">Update</button>
			</form>
		</div>
		<div class="bg-rose-200">
			<button class="border p-1" hx-confirm="Sure? This will also delete all domain entries owned by the account." hx-delete="/manage/user">Delete Account</button>
		</div>
	}
}