feat: create accounts

internal/ui/forms/create_account.templ

@@ -0,0 +1,68 @@
+package forms
+
+import "git.juancwu.dev/juancwu/budgit/internal/routeurl"
+import "git.juancwu.dev/juancwu/budgit/internal/ui/components/button"
+import "git.juancwu.dev/juancwu/budgit/internal/ui/components/card"
+import "git.juancwu.dev/juancwu/budgit/internal/ui/components/form"
+import "git.juancwu.dev/juancwu/budgit/internal/ui/components/input"
+
+type CreateAccountProps struct {
+	SpaceID string
+
+	Name string
+
+	NameErr    string
+	GeneralErr string
+}
+
+templ CreateAccount(props CreateAccountProps) {
+	<form hx-post={ routeurl.URL("action.app.spaces.space.accounts.create", "spaceID", props.SpaceID) }>
+		@card.Card(card.Props{Class: "rounded-sm"}) {
+			@card.Content(card.ContentProps{Class: "p-4 space-y-4"}) {
+				if props.GeneralErr != "" {
+					@form.Message(form.MessageProps{Variant: form.MessageVariantError}) {
+						{ props.GeneralErr }
+					}
+				}
+				@form.Item() {
+					@form.Label(form.LabelProps{For: "name"}) {
+						Account Name
+					}
+					@input.Input(input.Props{
+						ID:          "name",
+						Name:        "name",
+						Type:        input.TypeText,
+						Placeholder: "e.g. Checking",
+						Class:       "rounded-sm",
+						Value:       props.Name,
+						HasError:    props.NameErr != "",
+						Required:    true,
+						Attributes: templ.Attributes{
+							"autocomplete": "off",
+							"autofocus":    "",
+						},
+					})
+					if props.NameErr != "" {
+						@form.Message(form.MessageProps{Variant: form.MessageVariantError}) {
+							{ props.NameErr }
+						}
+					}
+					@form.Description() {
+						You can rename the account later. Starts with a $0.00 balance.
+					}
+				}
+			}
+			@card.Footer(card.FooterProps{Class: "flex justify-end gap-2"}) {
+				@button.Button(button.Props{
+					Variant: button.VariantGhost,
+					Href:    routeurl.URL("page.app.spaces.space.overview", "spaceID", props.SpaceID),
+				}) {
+					Cancel
+				}
+				@button.Button(button.Props{Type: button.TypeSubmit}) {
+					Create Account
+				}
+			}
+		}
+	</form>
+}