Migrated more auth forms.

Author: mikestefanello

pkg/handlers/auth.go

@@ -17,20 +17,15 @@ import (
 	"github.com/mikestefanello/pagoda/pkg/redirect"
 	"github.com/mikestefanello/pagoda/pkg/routenames"
 	"github.com/mikestefanello/pagoda/pkg/services"
+	"github.com/mikestefanello/pagoda/pkg/ui"
 	"github.com/mikestefanello/pagoda/templates"
 )
 
 const (
-	routeNameForgotPassword       = "forgot_password"
-	routeNameForgotPasswordSubmit = "forgot_password.submit"
-	routeNameLogin                = "login"
-	routeNameLoginSubmit          = "login.submit"
-	routeNameLogout               = "logout"
-	routeNameRegister             = "register"
-	routeNameRegisterSubmit       = "register.submit"
-	routeNameResetPassword        = "reset_password"
-	routeNameResetPasswordSubmit  = "reset_password.submit"
-	routeNameVerifyEmail          = "verify_email"
+	routeNameLogout              = "logout"
+	routeNameResetPassword       = "reset_password"
+	routeNameResetPasswordSubmit = "reset_password.submit"
+	routeNameVerifyEmail         = "verify_email"
 )
 
 type (
@@ -41,25 +36,6 @@ type (
 		*services.TemplateRenderer
 	}
 
-	forgotPasswordForm struct {
-		Email string `form:"email" validate:"required,email"`
-		form.Submission
-	}
-
-	loginForm struct {
-		Email    string `form:"email" validate:"required,email"`
-		Password string `form:"password" validate:"required"`
-		form.Submission
-	}
-
-	registerForm struct {
-		Name            string `form:"name" validate:"required"`
-		Email           string `form:"email" validate:"required,email"`
-		Password        string `form:"password" validate:"required"`
-		ConfirmPassword string `form:"password-confirm" validate:"required,eqfield=Password"`
-		form.Submission
-	}
-
 	resetPasswordForm struct {
 		Password        string `form:"password" validate:"required"`
 		ConfirmPassword string `form:"password-confirm" validate:"required,eqfield=Password"`
@@ -84,12 +60,12 @@ func (h *Auth) Routes(g *echo.Group) {
 	g.GET("/email/verify/:token", h.VerifyEmail).Name = routeNameVerifyEmail
 
 	noAuth := g.Group("/user", middleware.RequireNoAuthentication())
-	noAuth.GET("/login", h.LoginPage).Name = routeNameLogin
-	noAuth.POST("/login", h.LoginSubmit).Name = routeNameLoginSubmit
-	noAuth.GET("/register", h.RegisterPage).Name = routeNameRegister
-	noAuth.POST("/register", h.RegisterSubmit).Name = routeNameRegisterSubmit
-	noAuth.GET("/password", h.ForgotPasswordPage).Name = routeNameForgotPassword
-	noAuth.POST("/password", h.ForgotPasswordSubmit).Name = routeNameForgotPasswordSubmit
+	noAuth.GET("/login", h.LoginPage).Name = routenames.Login
+	noAuth.POST("/login", h.LoginSubmit).Name = routenames.LoginSubmit
+	noAuth.GET("/register", h.RegisterPage).Name = routenames.Register
+	noAuth.POST("/register", h.RegisterSubmit).Name = routenames.RegisterSubmit
+	noAuth.GET("/password", h.ForgotPasswordPage).Name = routenames.ForgotPassword
+	noAuth.POST("/password", h.ForgotPasswordSubmit).Name = routenames.ForgotPasswordSubmit
 
 	resetGroup := noAuth.Group("/password/reset",
 		middleware.LoadUser(h.orm),
@@ -100,17 +76,11 @@ func (h *Auth) Routes(g *echo.Group) {
 }
 
 func (h *Auth) ForgotPasswordPage(ctx echo.Context) error {
-	p := page.New(ctx)
-	p.Layout = templates.LayoutAuth
-	p.Name = templates.PageForgotPassword
-	p.Title = "Forgot password"
-	p.Form = form.Get[forgotPasswordForm](ctx)
-
-	return h.RenderPage(ctx, p)
+	return ui.ForgotPassword(ctx, form.Get[ui.ForgotPasswordForm](ctx))
 }
 
 func (h *Auth) ForgotPasswordSubmit(ctx echo.Context) error {
-	var input forgotPasswordForm
+	var input ui.ForgotPasswordForm
 
 	succeed := func() error {
 		form.Clear(ctx)
@@ -169,17 +139,11 @@ func (h *Auth) ForgotPasswordSubmit(ctx echo.Context) error {
 }
 
 func (h *Auth) LoginPage(ctx echo.Context) error {
-	p := page.New(ctx)
-	p.Layout = templates.LayoutAuth
-	p.Name = templates.PageLogin
-	p.Title = "Log in"
-	p.Form = form.Get[loginForm](ctx)
-
-	return h.RenderPage(ctx, p)
+	return ui.Login(ctx, form.Get[ui.LoginForm](ctx))
 }
 
 func (h *Auth) LoginSubmit(ctx echo.Context) error {
-	var input loginForm
+	var input ui.LoginForm
 
 	authFailed := func() error {
 		input.SetFieldError("Email", "")
@@ -224,7 +188,7 @@ func (h *Auth) LoginSubmit(ctx echo.Context) error {
 		return fail(err, "unable to log in user")
 	}
 
-	msg.Success(ctx, fmt.Sprintf("Welcome back, <strong>%s</strong>. You are now logged in.", u.Name))
+	msg.Success(ctx, fmt.Sprintf("Welcome back, %s. You are now logged in.", u.Name))
 
 	return redirect.New(ctx).
 		Route(routenames.Home).
@@ -243,17 +207,11 @@ func (h *Auth) Logout(ctx echo.Context) error {
 }
 
 func (h *Auth) RegisterPage(ctx echo.Context) error {
-	p := page.New(ctx)
-	p.Layout = templates.LayoutAuth
-	p.Name = templates.PageRegister
-	p.Title = "Register"
-	p.Form = form.Get[registerForm](ctx)
-
-	return h.RenderPage(ctx, p)
+	return ui.Register(ctx, form.Get[ui.RegisterForm](ctx))
 }
 
 func (h *Auth) RegisterSubmit(ctx echo.Context) error {
-	var input registerForm
+	var input ui.RegisterForm
 
 	err := form.Submit(ctx, &input)
 
@@ -288,7 +246,7 @@ func (h *Auth) RegisterSubmit(ctx echo.Context) error {
 	case *ent.ConstraintError:
 		msg.Warning(ctx, "A user with this email address already exists. Please log in.")
 		return redirect.New(ctx).
-			Route(routeNameLogin).
+			Route(routenames.Login).
 			Go()
 	default:
 		return fail(err, "unable to create user")
@@ -303,7 +261,7 @@ func (h *Auth) RegisterSubmit(ctx echo.Context) error {
 		)
 		msg.Info(ctx, "Your account has been created.")
 		return redirect.New(ctx).
-			Route(routeNameLogin).
+			Route(routenames.Login).
 			Go()
 	}
 
@@ -398,7 +356,7 @@ func (h *Auth) ResetPasswordSubmit(ctx echo.Context) error {
 
 	msg.Success(ctx, "Your password has been updated.")
 	return redirect.New(ctx).
-		Route(routeNameLogin).
+		Route(routenames.Login).
 		Go()
 }
 

pkg/redirect/redirect.go

@@ -24,7 +24,7 @@ type Redirect struct {
 func New(ctx echo.Context) *Redirect {
 	return &Redirect{
 		ctx:    ctx,
-		status: http.StatusFound,
+		status: http.StatusTemporaryRedirect,
 	}
 }
 

pkg/routenames/names.go

@@ -0,0 +1,13 @@
+package routenames
+
+const (
+	Home                 = "home"
+	Contact              = "contact"
+	ContactSubmit        = "contact.submit"
+	Login                = "login"
+	LoginSubmit          = "login.submit"
+	Register             = "register"
+	RegisterSubmit       = "register.submit"
+	ForgotPassword       = "forgot_password"
+	ForgotPasswordSubmit = "forgot_password.submit"
+)

pkg/ui/components.go

@@ -224,3 +224,18 @@ func footer(r *request) Node {
 		`)),
 	}
 }
+
+func button(class, label string) Node {
+	return Button(
+		Class("button "+class),
+		Text(label),
+	)
+}
+
+func buttonLink(href, class, label string) Node {
+	return A(
+		Href(href),
+		Class("button "+class),
+		Text(label),
+	)
+}

pkg/ui/form.go

@@ -8,12 +8,13 @@ import (
 
 type (
 	input struct {
-		form      form.Form
-		formField string
-		name      string
-		inputType string
-		label     string
-		value     string
+		form        form.Form
+		formField   string
+		name        string
+		inputType   string
+		label       string
+		value       string
+		placeholder string
 	}
 
 	radios struct {
@@ -39,16 +40,18 @@ type (
 	}
 )
 
-func formSubmit(label string) Node {
+func formControlGroup(controls ...Node) Node {
+	g := make(Group, 0, len(controls))
+	for _, control := range controls {
+		g = append(g, Div(
+			Class("control"),
+			control,
+		))
+	}
+
 	return Div(
 		Class("field is-grouped"),
-		Div(
-			Class("control"),
-			Button(
-				Class("button is-link"),
-				Text(label),
-			),
-		),
+		g,
 	)
 }
 
@@ -113,6 +116,7 @@ func formInput(el input) Node {
 				ID(el.name),
 				Name(el.name),
 				Type(el.inputType),
+				If(el.placeholder != "", Placeholder(el.placeholder)),
 				Class("input "+formFieldStatusClass(el.form, el.formField)),
 				Value(el.value),
 			),

pkg/ui/forms.go

@@ -16,6 +16,25 @@ type (
 		Message    string `form:"message" validate:"required"`
 		form.Submission
 	}
+
+	LoginForm struct {
+		Email    string `form:"email" validate:"required,email"`
+		Password string `form:"password" validate:"required"`
+		form.Submission
+	}
+
+	RegisterForm struct {
+		Name            string `form:"name" validate:"required"`
+		Email           string `form:"email" validate:"required,email"`
+		Password        string `form:"password" validate:"required"`
+		ConfirmPassword string `form:"password-confirm" validate:"required,eqfield=Password"`
+		form.Submission
+	}
+
+	ForgotPasswordForm struct {
+		Email string `form:"email" validate:"required,email"`
+		form.Submission
+	}
 )
 
 func (f *ContactForm) render(r *request) Node {
@@ -50,7 +69,108 @@ func (f *ContactForm) render(r *request) Node {
 			label:     "Message",
 			value:     f.Message,
 		}),
-		formSubmit("Submit"),
+		formControlGroup(
+			button("is-link", "Submit"),
+		),
+		csrf(r),
+	)
+}
+
+func (f *LoginForm) render(r *request) Node {
+	return Form(
+		ID("login"),
+		Method(http.MethodPost),
+		Attr("hx-boost", "true"),
+		Action(r.path(routenames.LoginSubmit)),
+		flashMessages(r),
+		formInput(input{
+			form:      f,
+			formField: "Email",
+			name:      "email",
+			inputType: "email",
+			label:     "Email address",
+			value:     f.Email,
+		}),
+		formInput(input{
+			form:        f,
+			formField:   "Password",
+			name:        "password",
+			inputType:   "password",
+			label:       "Password",
+			placeholder: "******",
+		}),
+		formControlGroup(
+			button("is-link", "Login"),
+			buttonLink(r.path(routenames.Home), "is-light", "Cancel"),
+		),
+		csrf(r),
+	)
+}
+
+func (f *RegisterForm) render(r *request) Node {
+	return Form(
+		ID("register"),
+		Method(http.MethodPost),
+		Attr("hx-boost", "true"),
+		Action(r.path(routenames.RegisterSubmit)),
+		formInput(input{
+			form:      f,
+			formField: "Name",
+			name:      "name",
+			inputType: "text",
+			label:     "Name",
+			value:     f.Name,
+		}),
+		formInput(input{
+			form:      f,
+			formField: "Email",
+			name:      "email",
+			inputType: "email",
+			label:     "Email address",
+			value:     f.Email,
+		}),
+		formInput(input{
+			form:        f,
+			formField:   "Password",
+			name:        "password",
+			inputType:   "password",
+			label:       "Password",
+			placeholder: "******",
+		}),
+		formInput(input{
+			form:        f,
+			formField:   "PasswordConfirm",
+			name:        "password-confirm",
+			inputType:   "password",
+			label:       "Confirm password",
+			placeholder: "******",
+		}),
+		formControlGroup(
+			button("is-primary", "Register"),
+			buttonLink(r.path(routenames.Home), "is-light", "Cancel"),
+		),
+		csrf(r),
+	)
+}
+
+func (f *ForgotPasswordForm) render(r *request) Node {
+	return Form(
+		ID("forgot-password"),
+		Method(http.MethodPost),
+		Attr("hx-boost", "true"),
+		Action(r.path(routenames.ForgotPasswordSubmit)),
+		formInput(input{
+			form:      f,
+			formField: "Email",
+			name:      "email",
+			inputType: "email",
+			label:     "Email address",
+			value:     f.Email,
+		}),
+		formControlGroup(
+			button("is-primary", "Reset password"),
+			buttonLink(r.path(routenames.Home), "is-light", "Cancel"),
+		),
 		csrf(r),
 	)
 }