> ## Documentation Index
> Fetch the complete documentation index at: https://docs.encoreos.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Customers

> List, create, view, and manage AR customer records with invoices, payment history, credit memos, and search/filter controls.

Customers lists and manages accounts-receivable customer records with search, customer-type, and active/inactive filters. Route: `/fa/customers`

## Overview

The route `/fa/customers` redirects to `/fa/receivables?tab=customers` in the router. The `CustomersPage` component fetches customers via `useCustomerList(organizationId, { search, type, isActive })`. Filters: text search, `CustomerType` dropdown (from `fa_customer_type` enum), and active/inactive toggle (default: `active`). The **New Customer** button and the edit action per row open `CustomerDialog`. Delete calls `useDeleteCustomer`.

## Who it's for

Access follows your organization's role and module configuration.

## Before you start

* The current organization must be set.
* Customer type definitions come from the `fa_customer_type` database enum.
* Navigate to the Receivables Hub at `/fa/receivables?tab=customers` to access customer management.

## Steps

<Steps>
  <Step title="Navigate to Customers">
    Go to `/fa/customers` or the Customers tab in the Receivables hub.
  </Step>

  <Step title="Search and filter">
    Enter a search term, select a customer type, and toggle between active and inactive customers.
  </Step>

  <Step title="Create a customer">
    Click **New Customer** to open `CustomerDialog` with a blank form.
  </Step>

  <Step title="Edit a customer">
    Click the edit action on a row to open `CustomerDialog` pre-populated.
  </Step>

  <Step title="Delete a customer">
    Click delete on a row to call `useDeleteCustomer`.
  </Step>

  <Step title="View customer detail">
    Click a customer name to navigate to `/fa/customers/:id`.
  </Step>
</Steps>

## Key concepts

* **`useCustomerList`** — Primary list hook; accepts `organizationId` and `{ search, type, isActive }`.
* **`CustomerType`** — From `fa_customer_type` database enum.
* **`useDeleteCustomer`** — Mutation hook for customer deletion.
* **`CustomerDialog`** — Create/edit dialog for customer records.

## Viewing a customer

The detail view at `/fa/customers/:id` shows all information for a single customer record including associated invoices, payments, credit memos, and an edit action.

The page loads the customer via `useCustomer(id, currentOrganization?.id)`. Related data is fetched in parallel: invoices via `useInvoiceList` (filtered by `customerId`), payments via `useCustomerPayments`, and credit memos via `useCreditMemoList`. The breadcrumb shows `customer_name`. A tabbed interface displays: Invoices (`InvoicesTable`), Payments (`CustomerPaymentsTable`), and Credit Memos (`CreditMemosTable`). Invoice actions include send (`useSendInvoice`), void (`useVoidInvoice`), and delete (`useDeleteInvoice`). The edit button opens `CustomerDialog`.

Key concepts:

* **`useCustomer`** — Primary data hook; fetches a single customer by `id` and `organizationId`.
* **`InvoicesTable`** — Component rendering the customer's invoice list.
* **`CustomerPaymentsTable`** — Component rendering payment history.
* **`CreditMemosTable`** — Component rendering credit memos filtered by customer.
* **`CustomerDialog`** — Edit dialog for customer record fields.

Customer detail fields visible on `CustomerDetailPage`: `customer_name`, `customer_number`, `billing_address_line1`, `billing_address_line2`, `billing_city`, `billing_state`, `billing_postal_code`.

1. Go to `/fa/customers/:id` or click a customer row from the Customers list.
2. Review the header section showing customer name and key attributes.
3. Review the **Invoices** tab for all customer invoices with send, void, and delete actions.
4. Review the **Payments** tab for customer payment history via `CustomerPaymentsTable`.
5. Review the **Credit Memos** tab for applicable credit memos via `CreditMemosTable`.
6. Click Edit to open `CustomerDialog` and update the customer record.

## Creating a customer

New customer creation is accessible via the Receivables Hub. The `/fa/customers` route redirects to `/fa/receivables?tab=customers`. Customer creation is handled via `CustomerDialog` within that tab.

<Warning>
  SME: The creation interface within `ReceivablesHubPage` is not fully observable from the `CustomerDetailPage` component. Confirm the creation flow with the implementation team.
</Warning>

1. Navigate to `/fa/receivables?tab=customers`.
2. Use the Receivables Hub interface to create a new customer.

## Related

<Columns cols={2}>
  <Card title="Finance & Revenue" icon="building-columns" href="/fa/overview">
    Finance & Revenue core overview.
  </Card>

  <Card title="Governance & parity" icon="scale-balanced" href="/governance/index" />
</Columns>

<Note>
  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.
</Note>

<Accordion title="Documentation sources">
  * src/routes/fa.tsx
  * src/cores/fa/pages/CustomersPage.tsx
  * src/cores/fa/pages/CustomerDetailPage.tsx
  * src/cores/fa/pages/ReceivablesHubPage.tsx
  * src/cores/fa/hooks/useCustomers.ts
  * src/cores/fa/hooks/useInvoices.ts
  * src/cores/fa/hooks/useCustomerPayments.ts
  * src/cores/fa/hooks/useCreditMemos.ts
  * src/cores/fa/components/CustomersTable.tsx
  * src/cores/fa/components/CustomerDialog.tsx
  * src/integrations/supabase/types.ts
</Accordion>