feat: transfer funds between accounts

internal/ui/forms/create_transfer.templ

@@ -0,0 +1,176 @@
+package forms
+
+import "git.juancwu.dev/juancwu/budgit/internal/model"
+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"
+import "git.juancwu.dev/juancwu/budgit/internal/ui/components/textarea"
+
+type CreateTransferProps struct {
+	SpaceID         string
+	SourceAccountID string
+
+	// DestAccounts is the list of other accounts in the same space the user
+	// can transfer to. Excludes the source account.
+	DestAccounts []*model.Account
+
+	Title         string
+	Amount        string
+	DestAccountID string
+	Date          string
+	Description   string
+
+	TitleErr   string
+	AmountErr  string
+	DestErr    string
+	DateErr    string
+	GeneralErr string
+}
+
+templ CreateTransfer(props CreateTransferProps) {
+	<form hx-post={ routeurl.URL("action.app.spaces.space.accounts.account.transfers.create", "spaceID", props.SpaceID, "accountID", props.SourceAccountID) }>
+		@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: "title"}) {
+						Title
+					}
+					@input.Input(input.Props{
+						ID:          "title",
+						Name:        "title",
+						Type:        input.TypeText,
+						Placeholder: "e.g. Move to savings",
+						Class:       "rounded-sm",
+						Value:       props.Title,
+						HasError:    props.TitleErr != "",
+						Required:    true,
+						Attributes: templ.Attributes{
+							"autocomplete": "off",
+							"autofocus":    "",
+						},
+					})
+					if props.TitleErr != "" {
+						@form.Message(form.MessageProps{Variant: form.MessageVariantError}) {
+							{ props.TitleErr }
+						}
+					}
+				}
+				@form.Item() {
+					@form.Label(form.LabelProps{For: "destination"}) {
+						Destination account
+					}
+					if len(props.DestAccounts) == 0 {
+						@form.Message(form.MessageProps{Variant: form.MessageVariantError}) {
+							This space has no other accounts. Create one first.
+						}
+					} else {
+						<select
+							id="destination"
+							name="destination"
+							class={ "flex h-9 w-full items-center rounded-sm border bg-transparent px-3 py-1 text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
+								templ.KV("border-destructive", props.DestErr != ""),
+								templ.KV("border-input", props.DestErr == "") }
+							required
+						>
+							<option value="" selected?={ props.DestAccountID == "" }>Select an account…</option>
+							for _, a := range props.DestAccounts {
+								<option value={ a.ID } selected?={ props.DestAccountID == a.ID }>{ a.Name }</option>
+							}
+						</select>
+					}
+					if props.DestErr != "" {
+						@form.Message(form.MessageProps{Variant: form.MessageVariantError}) {
+							{ props.DestErr }
+						}
+					}
+				}
+				<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+					@form.Item() {
+						@form.Label(form.LabelProps{For: "amount"}) {
+							Amount
+						}
+						@input.Input(input.Props{
+							ID:          "amount",
+							Name:        "amount",
+							Type:        input.TypeNumber,
+							Placeholder: "0.00",
+							Class:       "rounded-sm",
+							Value:       props.Amount,
+							HasError:    props.AmountErr != "",
+							Required:    true,
+							Attributes: templ.Attributes{
+								"step":         "0.01",
+								"min":          "0",
+								"inputmode":    "decimal",
+								"autocomplete": "off",
+							},
+						})
+						if props.AmountErr != "" {
+							@form.Message(form.MessageProps{Variant: form.MessageVariantError}) {
+								{ props.AmountErr }
+							}
+						}
+						@form.Description() {
+							Transfers may exceed the source balance and result in a negative balance.
+						}
+					}
+					@form.Item() {
+						@form.Label(form.LabelProps{For: "date"}) {
+							Date
+						}
+						@input.Input(input.Props{
+							ID:       "date",
+							Name:     "date",
+							Type:     input.TypeDate,
+							Class:    "rounded-sm",
+							Value:    props.Date,
+							HasError: props.DateErr != "",
+							Required: true,
+						})
+						if props.DateErr != "" {
+							@form.Message(form.MessageProps{Variant: form.MessageVariantError}) {
+								{ props.DateErr }
+							}
+						}
+					}
+				</div>
+				@form.Item() {
+					@form.Label(form.LabelProps{For: "description"}) {
+						Description
+					}
+					@textarea.Textarea(textarea.Props{
+						ID:          "description",
+						Name:        "description",
+						Placeholder: "Anything extra worth remembering",
+						Rows:        3,
+						Value:       props.Description,
+					})
+					@form.Description() {
+						Optional. Shared by both sides of the transfer.
+					}
+				}
+			}
+			@card.Footer(card.FooterProps{Class: "flex justify-end gap-2"}) {
+				@button.Button(button.Props{
+					Variant: button.VariantGhost,
+					Href:    routeurl.URL("page.app.spaces.space.accounts.account.overview", "spaceID", props.SpaceID, "accountID", props.SourceAccountID),
+				}) {
+					Cancel
+				}
+				@button.Button(button.Props{
+					Type:     button.TypeSubmit,
+					Disabled: len(props.DestAccounts) == 0,
+				}) {
+					Transfer
+				}
+			}
+		}
+	</form>
+}