Skip to main content
The Invoices page lists all customer invoices for the organization. It is accessible at route /fa/invoices.

Overview

The page includes:
  • Status filter: draft, sent, partial, paid, void (and “All Statuses”)
  • Customer filter: Dropdown of active customers
  • Invoice list: InvoicesTable with send, void, and delete row actions
  • New Invoice button: Links to /fa/invoices/new
  • Guided Tour: invoiceProcessingTour triggered via a Help button
Row actions call useSendInvoice, useVoidInvoice, and useDeleteInvoice respectively. Send requires the current userId. Primary hooks: useInvoiceList, useCustomerList, useSendInvoice, useVoidInvoice, useDeleteInvoice

Who it’s for

Access follows your organization’s role and module configuration.

Before you start

  • At least one customer must exist to filter by customer.
  • Invoices can only be sent or voided according to their current status.
  • At least one active customer and configured GL revenue accounts are needed to create invoices.

Steps

  1. Navigate to /fa/receivables?tab=invoices (canonical) or via the Receivables hub.
  2. Use the Status and Customer dropdowns to filter the list.
  3. Click New Invoice to create a new invoice.
  4. Use row actions to send (draft invoices), void (sent/partial), or delete (draft) invoices.
  5. Click an invoice row to open /fa/invoices/:id for full detail.

Viewing an invoice

The Invoice Details page at /fa/invoices/:id shows the full details of a single customer invoice and provides lifecycle actions. The page loads invoice data via useInvoice(id, organizationId). Key sections:
  • Header: Invoice number, status badge (InvoiceStatusBadge), invoice date. Available action buttons depend on status:
    • draft: Print PDF, Edit (links to /fa/invoices/:id/edit), Send Invoice
    • sent or partial: Print PDF, Void
  • Invoice Details card: Bill-to customer name/number/address, invoice date, due date, linked site.
  • Line Items card: DataTable of fa_invoice_lines rows with Description, Account (account_number – name), Quantity, Unit Price, Amount. Subtotal, optional Tax, Total, and Balance Due summary.
  • GL Posting Indicator: Shown when a journal_entry_id is present.
  • Payment History: InvoicePaymentHistory component.
  • Credit Memos Applied: InvoiceCreditHistory component.
  • Notes: Displayed if present on the record.
Key concepts:
  • Balance Due: invoice.balance_due — the remaining unpaid amount after payments applied.
  • GL Posting: When journal_entry_id is present, a GLPostingIndicator shows the linked posted entry.
To view an invoice: navigate to /fa/invoices and click an invoice row, or go directly to /fa/invoices/:id. To send an invoice: open a draft invoice, click Send Invoice, and confirm in the alert dialog. The invoice status changes to sent and it can no longer be edited. To void an invoice: open a sent or partial invoice, click Void, and confirm in the alert dialog. To print PDF: click Print PDF. The page generates a PDF via useInvoicePdf and triggers a browser download/print.

Creating an invoice

The New Invoice page (/fa/invoices/new) creates a customer invoice. The page renders InvoiceForm inside a “Invoice Details” card. The invoice number is auto-generated via useGenerateInvoiceNumber. Form schema (validated with Zod):
  • invoice_number (required — auto-generated)
  • customer_id (required)
  • invoice_date (required — date)
  • due_date (required — date)
  • notes (optional)
  • tax_amount (number, default 0)
  • lines (array, min 1): line_number, description (required), account_id (required), quantity, unit_price, line_amount
On submit, useCreateInvoice creates the header with status: "draft", then useCreateInvoiceLine creates each line. Navigates to /fa/invoices/:id on success. Key concepts:
  • Invoice number: Auto-generated — not user-entered by default.
  • Status on create: draft — must be sent to be considered issued.
  • Line amount: Derived from quantity × unit price (computed in InvoiceLineEditor).
  1. Navigate to /fa/invoices/new.
  2. Complete the Invoice Details form: customer (required), invoice date, due date; optional notes and tax amount.
  3. Add at least one line item (description, account, quantity, unit price).
  4. Submit. On success, you are redirected to the new invoice’s detail page.
  5. From the detail page, send the invoice when ready.

Finance & Revenue

Finance & Revenue core overview.

Governance & parity

This page documents shipped product behavior. It is not medical, legal, or billing advice. Verify against your organization’s policies and applicable regulations before using it for clinical, compliance, or billing decisions. Protected health information (PHI) shown in the product is governed by your tenant’s access controls and is never exposed in this documentation.
  • src/routes/fa.tsx
  • src/cores/fa/pages/InvoicesPage.tsx
  • src/cores/fa/pages/InvoiceDetailPage.tsx
  • src/cores/fa/pages/InvoiceCreatePage.tsx
  • src/cores/fa/hooks/useInvoices.ts
  • src/cores/fa/hooks/useInvoiceLines.ts
  • src/cores/fa/hooks/useInvoicePdf.ts
  • src/cores/fa/hooks/useCustomers.ts
  • src/cores/fa/components/InvoiceStatusBadge.tsx
  • src/cores/fa/components/InvoicePaymentHistory.tsx
  • src/cores/fa/components/InvoiceCreditHistory.tsx
  • src/cores/fa/components/InvoiceForm.tsx
  • src/cores/fa/components/InvoiceLineEditor.tsx