rentease/internal/view/login_form.templ

package view

func isFormError(data map[string]string, key string) bool {
	_, ok := data[key]
	return ok
}

templ LoginForm(lfvm LoginFormViewModel) {
	<form hx-post="/" x-data="{passwordTooShort:false}">
		<input
			type="email"
			name="email"
			value={ lfvm.Email }
			placeholder="john@email.com"
			aria-label="email"
			if isFormError(lfvm.Errors, "credentials") {
				aria-invalid="true"
			}
			autocomplete="email"
			autofocus
			required
		/>
		if msg, ok := lfvm.Errors["credentials"]; ok {
			<small>Authentication error: { msg }</small>
		}
		<input
			type="password"
			name="password"
			value={ lfvm.Password }
			placeholder="p4Ssw0rD"
			aria-label="password"
			if isFormError(lfvm.Errors, "credentials") {
				aria-invalid="true"
			}
			autocomplete="password"
			required
			@input.debounce="passwordTooShort = $event.target.value.length < 4"
			:aria-invalid="passwordTooShort"
		/>
		<small x-show="passwordTooShort">Password is too short</small>
		<button type="submit">Log in</button>
		<small>Registration is disabled. Please ask an admin to activate it.</small>
	</form>
}