juancwu/budgit
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: add transaction from overview page

Browse source
This commit is contained in:
juancwu 2026-02-23 19:27:03 +00:00
commit a17703d30d
4 changed files with 61 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

12
internal/ui/blocks/dialogs/add_transaction.templ
View file

@ -1,9 +1,12 @@
package dialogs
import "git.juancwu.dev/juancwu/budgit/internal/ui/components/dialog"
import "git.juancwu.dev/juancwu/budgit/internal/ui/components/button"
import "git.juancwu.dev/juancwu/budgit/internal/ui/components/expense"
import "git.juancwu.dev/juancwu/budgit/internal/model"
import (
"fmt"
"git.juancwu.dev/juancwu/budgit/internal/ui/components/dialog"
"git.juancwu.dev/juancwu/budgit/internal/ui/components/button"
"git.juancwu.dev/juancwu/budgit/internal/ui/components/expense"
"git.juancwu.dev/juancwu/budgit/internal/model"
)
templ AddTransaction(space *model.Space, tags []*model.Tag, listsWithItems []model.ListWithUncheckedItems, methods []*model.PaymentMethod) {
@dialog.Dialog(dialog.Props{ID: "add-transaction-dialog"}) {
@ -27,6 +30,7 @@ templ AddTransaction(space *model.Space, tags []*model.Tag, listsWithItems []mod
ListsWithItems: listsWithItems,
PaymentMethods: methods,
DialogID: "add-transaction-dialog",
RedirectURL: fmt.Sprintf("/app/spaces/%s/expenses?created=true", space.ID),
})
}
}

20
internal/ui/components/expense/expense.templ
View file

@ -22,16 +22,21 @@ type AddExpenseFormProps struct {
ListsWithItems []model.ListWithUncheckedItems
PaymentMethods []*model.PaymentMethod
DialogID string // which dialog to close on success
RedirectURL string // when set, server returns HX-Redirect instead of inline swap
}
func (p AddExpenseFormProps) formAttrs() templ.Attributes {
closeScript := "on htmx:afterOnLoad if event.detail.xhr.status == 200 then call window.tui.dialog.close('" + p.DialogID + "') then reset() me then show #item-selector-section end"
return templ.Attributes{
"hx-post": "/app/spaces/" + p.Space.ID + "/expenses",
"hx-target": "#expenses-list-wrapper",
"hx-swap": "innerHTML",
"_": closeScript,
attrs := templ.Attributes{
"hx-post": "/app/spaces/" + p.Space.ID + "/expenses",
}
if p.RedirectURL != "" {
attrs["_"] = "on htmx:afterOnLoad if event.detail.xhr.status == 200 then call window.tui.dialog.close('" + p.DialogID + "') end"
} else {
attrs["hx-target"] = "#expenses-list-wrapper"
attrs["hx-swap"] = "innerHTML"
attrs["_"] = "on htmx:afterOnLoad if event.detail.xhr.status == 200 then call window.tui.dialog.close('" + p.DialogID + "') then reset() me then show #item-selector-section end"
}
return attrs
}
templ AddExpenseForm(props AddExpenseFormProps) {
@ -40,6 +45,9 @@ templ AddExpenseForm(props AddExpenseFormProps) {
{ props.formAttrs()... }
>
@csrf.Token()
if props.RedirectURL != "" {
<input type="hidden" name="redirect" value={ props.RedirectURL }/>
}
// Type
<div class="flex gap-4">
<div class="flex items-start gap-3">

9
internal/ui/pages/app_space_overview.templ
View file

@ -9,6 +9,7 @@ import (
"git.juancwu.dev/juancwu/budgit/internal/ui/components/chart"
"git.juancwu.dev/juancwu/budgit/internal/ui/components/icon"
"git.juancwu.dev/juancwu/budgit/internal/ui/layouts"
"git.juancwu.dev/juancwu/budgit/internal/ui/blocks/dialogs"
)
type OverviewData struct {
@ -19,6 +20,9 @@ type OverviewData struct {
Budgets []*model.BudgetWithSpent
UpcomingRecurring []*model.RecurringExpenseWithTagsAndMethod
ShoppingLists []model.ListCardData
Tags []*model.Tag
Methods []*model.PaymentMethod
ListsWithItems []model.ListWithUncheckedItems
}
func overviewProgressBarColor(status model.BudgetStatus) string {
@ -135,7 +139,10 @@ templ overviewSectionHeader(title, href string) {
templ overviewBalanceCard(data OverviewData) {
<div class="border rounded-lg p-4 bg-card text-card-foreground">
<h3 class="font-semibold mb-3">Current Balance</h3>
<div class="flex items-center justify-between">
<h3 class="font-semibold mb-3">Current Balance</h3>
@dialogs.AddTransaction(data.Space, data.Tags, data.ListsWithItems, data.Methods)
</div>
<p class={ "text-3xl font-bold", templ.KV("text-destructive", data.Balance < 0) }>
{ fmt.Sprintf("$%.2f", float64(data.Balance)/100.0) }
</p>