ruidy/rentease
1
0
Fork 0
mirror of https://github.com/rjNemo/rentease.git synced 2026-06-12 13:46:51 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

login form

Browse source 
log
This commit is contained in:
Ruidy 2024-11-15 15:35:50 +01:00
parent efd433ddc2
commit 166ea488cf
No known key found for this signature in database
GPG key ID: E00F51288CB857CC
6 changed files with 72 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
internal/view/layout/base.templ
View file

@ -8,7 +8,7 @@ templ BaseLayout() {
@head()
<body hx-boost="true" style="display: flex; flex-direction: column; min-height: 100vh;">
@navbar()
<main class="container" style="flex: 1 0 auto;">
<main class="container mx-auto flex flex-col items-center justify-center flex-grow">
{ children... }
</main>
@footer()

2
internal/view/layout/base_templ.go
View file

@ -47,7 +47,7 @@ func BaseLayout() templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<main class=\"container\" style=\"flex: 1 0 auto;\">")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<main class=\"container mx-auto flex flex-col items-center justify-center flex-grow\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}

12
internal/view/login.templ
View file

@ -4,14 +4,14 @@ import "github.com/rjNemo/rentease/internal/view/layout"
templ Login(lfvm LoginFormViewModel) {
@layout.BaseLayout() {
<section>
<article>
<hgroup>
<h1>Welcome</h1>
<h2>Manage your rental property</h2>
<section class="flex justify-center items-center">
<div class="w-full max-w-md">
<hgroup class="text-center py-8">
<h1 class="text-4xl font-bold text-primary">Welcome</h1>
<h2 class="text-xl text-base-content/70">Manage your rental property</h2>
</hgroup>
@LoginForm(lfvm)
</article>
</div>
</section>
}
}

85
internal/view/login_form.templ
View file

@ -6,39 +6,54 @@ func isFormError(data map[string]string, key string) bool {
}
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>
<div class="flex min-h-full w-full items-center justify-center py-12 px-4" id="login-form">
<div class="card w-full max-w-sm bg-base-100 shadow-xl mx-auto">
<div class="card-body">
<h2 class="card-title justify-center mb-4">Login</h2>
<form hx-post="/" hx-target="#login-form" hx-swap="outerHTML" x-data="{passwordTooShort:false}" class="space-y-4">
<div class="form-control w-full">
<input
type="email"
name="email"
value={ lfvm.Email }
placeholder="john@email.com"
aria-label="email"
class="input input-bordered w-full"
if isFormError(lfvm.Errors, "credentials") {
class="input input-bordered input-error w-full"
}
autocomplete="email"
autofocus
required
/>
if msg, ok := lfvm.Errors["credentials"]; ok {
<small class="text-error mt-1">Authentication error: { msg }</small>
}
</div>
<div class="form-control w-full">
<input
type="password"
name="password"
value={ lfvm.Password }
placeholder="p4Ssw0rD"
aria-label="password"
class="input input-bordered w-full"
if isFormError(lfvm.Errors, "credentials") {
class="input input-bordered input-error w-full"
}
autocomplete="password"
required
@input.debounce="passwordTooShort = $event.target.value.length < 4"
:class="{'input-error': passwordTooShort}"
/>
<small x-show="passwordTooShort" class="text-error mt-1">Password is too short</small>
</div>
<button type="submit" class="btn btn-primary w-full">Log in</button>
<div class="text-center">
<small class="text-base-content/70">Registration is disabled. Please ask an admin to activate it.</small>
</div>
</form>
</div>
</div>
</div>
}

24
internal/view/login_form_templ.go
View file

@ -34,25 +34,25 @@ func LoginForm(lfvm LoginFormViewModel) templ.Component {
templ_7745c5c3_Var1 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<form hx-post=\"/\" x-data=\"{passwordTooShort:false}\"><input type=\"email\" name=\"email\" value=\"")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<div class=\"flex min-h-full w-full items-center justify-center py-12 px-4\" id=\"login-form\"><div class=\"card w-full max-w-sm bg-base-100 shadow-xl mx-auto\"><div class=\"card-body\"><h2 class=\"card-title justify-center mb-4\">Login</h2><form hx-post=\"/\" hx-target=\"#login-form\" hx-swap=\"outerHTML\" x-data=\"{passwordTooShort:false}\" class=\"space-y-4\"><div class=\"form-control w-full\"><input type=\"email\" name=\"email\" value=\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var2 string
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(lfvm.Email)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/view/login_form.templ`, Line: 13, Col: 21}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/view/login_form.templ`, Line: 18, Col: 25}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" placeholder=\"john@email.com\" aria-label=\"email\"")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" placeholder=\"john@email.com\" aria-label=\"email\" class=\"input input-bordered w-full\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
if isFormError(lfvm.Errors, "credentials") {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" aria-invalid=\"true\"")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" class=\"input input-bordered input-error w-full\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -62,48 +62,48 @@ func LoginForm(lfvm LoginFormViewModel) templ.Component {
return templ_7745c5c3_Err
}
if msg, ok := lfvm.Errors["credentials"]; ok {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<small>Authentication error: ")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<small class=\"text-error mt-1\">Authentication error: ")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var3 string
templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(msg)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/view/login_form.templ`, Line: 24, Col: 37}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/view/login_form.templ`, Line: 30, Col: 65}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</small> ")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</small>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<input type=\"password\" name=\"password\" value=\"")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><div class=\"form-control w-full\"><input type=\"password\" name=\"password\" value=\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var4 string
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(lfvm.Password)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/view/login_form.templ`, Line: 29, Col: 24}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/view/login_form.templ`, Line: 37, Col: 28}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" placeholder=\"p4Ssw0rD\" aria-label=\"password\"")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("\" placeholder=\"p4Ssw0rD\" aria-label=\"password\" class=\"input input-bordered w-full\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
if isFormError(lfvm.Errors, "credentials") {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" aria-invalid=\"true\"")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" class=\"input input-bordered input-error w-full\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" autocomplete=\"password\" required @input.debounce=\"passwordTooShort = $event.target.value.length &lt; 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>")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" autocomplete=\"password\" required @input.debounce=\"passwordTooShort = $event.target.value.length &lt; 4\" :class=\"{&#39;input-error&#39;: passwordTooShort}\"> <small x-show=\"passwordTooShort\" class=\"text-error mt-1\">Password is too short</small></div><button type=\"submit\" class=\"btn btn-primary w-full\">Log in</button><div class=\"text-center\"><small class=\"text-base-content/70\">Registration is disabled. Please ask an admin to activate it.</small></div></form></div></div></div>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}

4
internal/view/login_templ.go
View file

@ -43,7 +43,7 @@ func Login(lfvm LoginFormViewModel) templ.Component {
}()
}
ctx = templ.InitializeContext(ctx)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<section><article><hgroup><h1>Welcome</h1><h2>Manage your rental property</h2></hgroup>")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<section class=\"flex justify-center items-center\"><div class=\"w-full max-w-md\"><hgroup class=\"text-center py-8\"><h1 class=\"text-4xl font-bold text-primary\">Welcome</h1><h2 class=\"text-xl text-base-content/70\">Manage your rental property</h2></hgroup>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -51,7 +51,7 @@ func Login(lfvm LoginFormViewModel) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</article></section>")
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div></section>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}