Add accounts UI with list, create, edit, detail tabs for all sub-entities

Accounts list with paginated table, search, sort. Account detail page with
tabs for members, payment methods, tax exemptions, and processor links.
All sub-entities have create/edit dialogs and delete actions. Forms use
shared Zod schemas via react-hook-form.
This commit is contained in:
Ryan Moon
2026-03-28 07:45:52 -05:00
parent e734ef4606
commit 9abdf6c050
23 changed files with 1688 additions and 6 deletions

View File

@@ -0,0 +1,33 @@
import { createFileRoute, useNavigate } from '@tanstack/react-router'
import { useMutation, useQueryClient } from '@tanstack/react-query'
import { accountMutations, accountKeys } from '@/api/accounts'
import { AccountForm } from '@/components/accounts/account-form'
import { toast } from 'sonner'
export const Route = createFileRoute('/_authenticated/accounts/new')({
component: NewAccountPage,
})
function NewAccountPage() {
const navigate = useNavigate()
const queryClient = useQueryClient()
const mutation = useMutation({
mutationFn: accountMutations.create,
onSuccess: (account) => {
queryClient.invalidateQueries({ queryKey: accountKeys.lists() })
toast.success('Account created')
navigate({ to: '/accounts/$accountId', params: { accountId: account.id } })
},
onError: (err) => {
toast.error(err.message)
},
})
return (
<div className="space-y-6">
<h1 className="text-2xl font-bold">New Account</h1>
<AccountForm onSubmit={mutation.mutate} loading={mutation.isPending} />
</div>
)
}