feat: space settings page

This commit is contained in:
juancwu 2026-05-03 18:24:15 +00:00
commit 2a9c2ca263
5 changed files with 272 additions and 0 deletions

View file

@ -0,0 +1,75 @@
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 UpdateSpaceProps struct {
SpaceID string
Name string
NameErr string
GeneralErr string
SuccessMsg string
}
templ UpdateSpace(props UpdateSpaceProps) {
<form
id="update-space-form"
hx-post={ routeurl.URL("action.app.spaces.space.settings.rename", "spaceID", props.SpaceID) }
hx-swap="outerHTML"
>
@card.Card(card.Props{Class: "rounded-sm"}) {
@card.Header() {
@card.Title() {
Space Details
}
@card.Description() {
Update the space name.
}
}
@card.Content(card.ContentProps{Class: "space-y-4"}) {
if props.GeneralErr != "" {
@form.Message(form.MessageProps{Variant: form.MessageVariantError}) {
{ props.GeneralErr }
}
}
if props.SuccessMsg != "" {
@form.Message(form.MessageProps{Variant: form.MessageVariantInfo}) {
{ props.SuccessMsg }
}
}
@form.Item() {
@form.Label(form.LabelProps{For: "name"}) {
Space Name
}
@input.Input(input.Props{
ID: "name",
Name: "name",
Type: input.TypeText,
Class: "rounded-sm",
Value: props.Name,
HasError: props.NameErr != "",
Required: true,
Attributes: templ.Attributes{
"autocomplete": "off",
},
})
if props.NameErr != "" {
@form.Message(form.MessageProps{Variant: form.MessageVariantError}) {
{ props.NameErr }
}
}
}
}
@card.Footer(card.FooterProps{Class: "flex justify-end gap-2"}) {
@button.Button(button.Props{Type: button.TypeSubmit}) {
Save changes
}
}
}
</form>
}

View file

@ -64,6 +64,16 @@ templ spaceSpecificSidebarContent(spaceID string) {
<span>Space Overview</span>
}
}
@sidebar.MenuItem() {
@sidebar.MenuButton(sidebar.MenuButtonProps{
Href: routeurl.URL("page.app.spaces.space.settings", "spaceID", spaceID),
IsActive: ctxkeys.URLPath(ctx) == routeurl.URL("page.app.spaces.space.settings", "spaceID", spaceID),
Tooltip: "Space Settings",
}) {
@icon.Settings()
<span>Settings</span>
}
}
}
}
}

View file

@ -0,0 +1,82 @@
package pages
import "git.juancwu.dev/juancwu/budgit/internal/routeurl"
import "git.juancwu.dev/juancwu/budgit/internal/ui/forms"
import "git.juancwu.dev/juancwu/budgit/internal/ui/layouts"
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/dialog"
import "git.juancwu.dev/juancwu/budgit/internal/ui/components/icon"
type SpaceSettingsPageProps struct {
SpaceID string
SpaceName string
CanDelete bool
UpdateForm forms.UpdateSpaceProps
}
templ SpaceSettingsPage(props SpaceSettingsPageProps) {
@layouts.App("Space Settings", spaceOverviewSidebarContent(), spaceSpecificSidebarContent(props.SpaceID)) {
<div class="container max-w-3xl px-6 py-8 mx-auto space-y-8">
<div>
<h1 class="text-3xl font-bold">Space Settings</h1>
<p class="text-muted-foreground mt-2">
Manage settings for { props.SpaceName }.
</p>
</div>
@forms.UpdateSpace(props.UpdateForm)
if props.CanDelete {
@card.Card(card.Props{Class: "rounded-sm border-destructive"}) {
@card.Header() {
@card.Title(card.TitleProps{Class: "text-destructive"}) {
Danger Zone
}
@card.Description() {
Deleting a space permanently removes the space and all of its accounts, transactions, and members. This cannot be undone.
}
}
@card.Footer(card.FooterProps{Class: "flex justify-end pt-8"}) {
@dialog.Dialog() {
@dialog.Trigger() {
@button.Button(button.Props{
Variant: button.VariantDestructive,
Class: "flex gap-2 items-center",
}) {
@icon.Trash2()
Delete Space
}
}
@dialog.Content() {
@dialog.Header() {
@dialog.Title() {
Delete { props.SpaceName }?
}
@dialog.Description() {
This permanently removes the space along with all of its accounts, transactions, and members. This cannot be undone.
}
}
@dialog.Footer(dialog.FooterProps{Class: "mt-2"}) {
@dialog.Close() {
@button.Button(button.Props{Variant: button.VariantOutline}) {
Cancel
}
}
<form hx-post={ routeurl.URL("action.app.spaces.space.settings.delete", "spaceID", props.SpaceID) }>
@button.Button(button.Props{
Type: button.TypeSubmit,
Variant: button.VariantDestructive,
Class: "flex gap-2 items-center",
}) {
@icon.Trash2()
Delete Space
}
</form>
}
}
}
}
}
}
</div>
}
}