package capture

import "gitea.henriburau.de/haw-lan/cod4watcher/views/layouts"
import "gitea.henriburau.de/haw-lan/cod4watcher/views/components"

type CaptureFormValues struct {
	Host string
	Port string
	Name string
}

templ CaptureForm(formValues CaptureFormValues, errors map[string]string) {
	@layouts.Base() {
		<div class="w-full mx-auto max-w-96 p-4 bg-white border border-gray-200 rounded-lg shadow  dark:bg-gray-800 dark:border-gray-700">
			<form class="space-y-6" action="/new/capture" method="post">
				<h5 class="text-xl font-medium text-gray-900 dark:text-white">Create new capture</h5>
				<div>
					<label for="name" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Name</label>
					@components.Input(components.InputProps{
						Name:        "name",
						Value:       formValues.Name,
						Error:       errors["name"],
						Placeholder: "Name for the capture",
					})
				</div>
				<div>
					<label for="host" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Host</label>
					@components.Input(components.InputProps{
						Name:        "host",
						Value:       formValues.Host,
						Error:       errors["host"],
						Placeholder: "Host-Address of the capture",
					})
				</div>
				<div>
					<label for="port" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Port</label>
					@components.Input(components.InputProps{
						Name:        "port",
						Value:       formValues.Port,
						Error:       errors["port"],
						Placeholder: "Port for the capture",
					})
				</div>
				<button type="submit" method="post" class="w-full text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
					Create capture
				</button>
			</form>
		</div>
	}
}