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

chore: refactor add expense dialog to its own ui block

Browse source
This commit is contained in:
juancwu 2026-02-23 18:38:10 +00:00
commit 0008e93973
2 changed files with 38 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

33
internal/ui/blocks/dialogs/add_transaction.templ Normal file
View file

@ -0,0 +1,33 @@
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"
templ AddTransaction(space *model.Space, tags []*model.Tag, listsWithItems []model.ListWithUncheckedItems, methods []*model.PaymentMethod) {
@dialog.Dialog(dialog.Props{ID: "add-transaction-dialog"}) {
@dialog.Trigger() {
@button.Button() {
Add Transaction
}
}
@dialog.Content() {
@dialog.Header() {
@dialog.Title() {
Add Transaction
}
@dialog.Description() {
Add a new expense or top-up to your space.
}
}
@expense.AddExpenseForm(expense.AddExpenseFormProps{
Space: space,
Tags: tags,
ListsWithItems: listsWithItems,
PaymentMethods: methods,
DialogID: "add-transaction-dialog",
})
}
}
}

32
internal/ui/pages/app_space_expenses.templ
View file

@ -11,6 +11,7 @@ import (
"git.juancwu.dev/juancwu/budgit/internal/ui/components/icon"
"git.juancwu.dev/juancwu/budgit/internal/ui/components/pagination"
"git.juancwu.dev/juancwu/budgit/internal/ui/layouts"
"git.juancwu.dev/juancwu/budgit/internal/ui/blocks/dialogs"
)
templ SpaceExpensesPage(space *model.Space, expenses []*model.ExpenseWithTagsAndMethod, balance int, allocated int, tags []*model.Tag, listsWithItems []model.ListWithUncheckedItems, methods []*model.PaymentMethod, currentPage, totalPages int) {
@ -18,30 +19,7 @@ templ SpaceExpensesPage(space *model.Space, expenses []*model.ExpenseWithTagsAnd
<div class="space-y-4">
<div class="flex justify-between items-center">
<h1 class="text-2xl font-bold">Expenses</h1>
@dialog.Dialog(dialog.Props{ID: "add-expense-dialog"}) {
@dialog.Trigger() {
@button.Button() {
Add Expense
}
}
@dialog.Content() {
@dialog.Header() {
@dialog.Title() {
Add Transaction
}
@dialog.Description() {
Add a new expense or top-up to your space.
}
}
@expense.AddExpenseForm(expense.AddExpenseFormProps{
Space: space,
Tags: tags,
ListsWithItems: listsWithItems,
PaymentMethods: methods,
DialogID: "add-expense-dialog",
})
}
}
@dialogs.AddTransaction(space, tags, listsWithItems, methods)
</div>
// Balance Card
@expense.BalanceCard(space.ID, balance, allocated, false)
@ -122,12 +100,12 @@ templ ExpenseListItem(spaceID string, exp *model.ExpenseWithTagsAndMethod, metho
{ exp.Date.Format("Jan 02, 2006") }
if exp.PaymentMethod != nil {
if exp.PaymentMethod.LastFour != nil {
<span> &middot; { exp.PaymentMethod.Name } (*{ *exp.PaymentMethod.LastFour })</span>
<span>&middot; { exp.PaymentMethod.Name } (*{ *exp.PaymentMethod.LastFour })</span>
} else {
<span> &middot; { exp.PaymentMethod.Name }</span>
<span>&middot; { exp.PaymentMethod.Name }</span>
}
} else {
<span> &middot; Cash</span>
<span>&middot; Cash</span>
}
</p>
if len(exp.Tags) > 0 {