Skip to main content

v1.6 Release Implementation Plan

For agentic workers: REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (- [ ]) syntax for tracking.
Goal: Fill 14 missing help-center articles, wire info-button helpUrls across Financial Hub and Settings nav items, add per-module info buttons in settings module headers, publish v1.6 release notes, and bump the version tag. Architecture: Three parallel workstreams — (A) write docs, (B) wire UI info buttons, (C) release notes + version bump — then a final commit + deploy. Tasks A and B are fully independent and can be dispatched simultaneously. Task C depends on A (needs the URLs to be real) but not on B. Tech Stack: React + TypeScript (Vite), Mintlify MDX docs (q.odontox.io), lucide-react icons

File Map

New files (docs):
  • docs/admin/settings.mdx
  • docs/admin/permission-templates.mdx
  • docs/admin/signatures.mdx
  • docs/admin/discount-policies.mdx
  • docs/admin/prescription-template.mdx
  • docs/admin/finance-letterhead.mdx
  • docs/admin/medicine-library.mdx
  • docs/admin/service-catalog.mdx
  • docs/admin/laboratories.mdx
  • docs/admin/operatories.mdx
  • docs/admin/whatsapp.mdx
  • docs/admin/appearance.mdx
  • docs/admin/billing.mdx
  • docs/finance/financial-hub.mdx
  • docs/finance/daily-close.mdx
  • docs/releases/v1-6.mdx
Modified files (UI):
  • ui/src/hooks/useNavItems.ts — add helpUrl to finance children, finance parent, settings, services, eod (all three roles)
  • ui/src/components/layout/AppLayout.tsx — remove !hasChildren guard so HelpCircle renders on parent nav items too
  • ui/src/components/settings/SettingsModule.tsx — add docsUrl to every card; render HelpCircle link in module header
Modified files (version):
  • ui/src/components/ui/sign-in.tsx:79'v1.5''v1.6'

Task 1: Settings admin docs — Part 1 (hub + permission-templates + signatures + discount-policies)

Files:
  • Create: docs/admin/settings.mdx
  • Create: docs/admin/permission-templates.mdx
  • Create: docs/admin/signatures.mdx
  • Create: docs/admin/discount-policies.mdx
  • Step 1: Write docs/admin/settings.mdx
---
title: "Settings"
description: "Configure every aspect of your clinic — profile, staff, billing, documents, and integrations — from the Settings hub."
icon: "gear"
---

Settings is the control center for your clinic. Everything from your clinic's branding to staff permissions and document formats is managed here.

<Note>
**Admin** can access all settings. **Doctors** and **receptionists** see only the settings relevant to their role.
</Note>

## What you can configure

<CardGroup cols={3}>
  <Card title="Clinic Profile" icon="building-columns" href="/admin/clinic-settings">
    Name, address, logo, currency, and operating hours.
  </Card>
  <Card title="Staff & Permissions" icon="users" href="/admin/staff-management">
    Invite staff, manage roles, and set per-user permission overrides.
  </Card>
  <Card title="Permission Templates" icon="shield-halved" href="/admin/permission-templates">
    Default permission sets that new staff inherit automatically.
  </Card>
  <Card title="Signature Center" icon="pen-line" href="/admin/signatures">
    Upload digital signatures for documents and consents.
  </Card>
  <Card title="Documentation" icon="file-text" href="/finance/document-numbering">
    Number formats and prefixes for invoices, receipts, and quotations.
  </Card>
  <Card title="Discount Policies" icon="percent" href="/admin/discount-policies">
    Automated discount rules for billing scenarios.
  </Card>
  <Card title="Prescription Template" icon="file-medical" href="/admin/prescription-template">
    Upload your clinic's prescription pad or letterhead.
  </Card>
  <Card title="Finance Letterhead" icon="file-text" href="/admin/finance-letterhead">
    Branded header for invoices, receipts, and quotations.
  </Card>
  <Card title="Medicine Library" icon="pills" href="/admin/medicine-library">
    Drug catalog used in the prescription wizard.
  </Card>
  <Card title="Services & Pricing" icon="book-open" href="/admin/service-catalog">
    Procedure catalog with prices for treatment plans and invoices.
  </Card>
  <Card title="Laboratories" icon="flask-conical" href="/admin/laboratories">
    Registered dental labs linked to lab work orders.
  </Card>
  <Card title="Operatories" icon="armchair" href="/admin/operatories">
    Treatment rooms and chair assignments.
  </Card>
  <Card title="Bridge Devices" icon="wifi" href="/admin/bridge-devices">
    X-ray and scanner connections via the Bridge desktop app.
  </Card>
  <Card title="WhatsApp" icon="message-circle" href="/admin/whatsapp">
    Meta Business API for appointment reminders.
  </Card>
  <Card title="Notifications" icon="bell" href="/admin/notifications">
    Email reminders and alert preferences.
  </Card>
  <Card title="Audit Logs" icon="scroll-text" href="/admin/audit-logs">
    Full activity history for compliance and security.
  </Card>
  <Card title="Appearance" icon="palette" href="/admin/appearance">
    Personal color scheme and theme.
  </Card>
  <Card title="Security" icon="lock" href="/admin/security">
    Two-factor authentication and passkeys.
  </Card>
  <Card title="My Billing" icon="credit-card" href="/admin/billing">
    Clinic plan, license usage, and subscription status.
  </Card>
</CardGroup>

## Related articles

- [Getting Started — Clinic Setup](/getting-started/clinic-setup)
- [Roles & Permissions](/getting-started/roles-and-permissions)
- [Staff Management](/admin/staff-management)
  • Step 2: Write docs/admin/permission-templates.mdx
---
title: "Permission Templates"
description: "Define default permission sets for each staff role so every new team member starts with the right access level automatically."
icon: "shield-halved"
---

Permission templates let you set the default access level for each staff role. When you invite or create a new staff member, they automatically inherit the permissions defined in their role's template — no manual configuration needed.

<Note>
**Admin only** — Only administrators can view and edit permission templates.
</Note>

## How templates work

Each clinic role (Doctor, Receptionist) has one permission template. The template defines which features and actions that role can access by default. You can still override individual permissions per user in **Staff Management** after the staff member is created.

Templates answer the question: *what should a typical Doctor or Receptionist be able to do in this clinic?*

## Editing a template

1. Open **Settings > Permission Templates**.
2. Select the role you want to configure (Doctor or Receptionist).
3. Toggle individual permissions on or off. Changes apply to the role template, not to existing staff members.
4. Click **Save**.

<Note>
Changing a template does not retroactively update existing staff members who have already been assigned. It only affects new staff invited or created after the change.
</Note>

## Permission categories

Permissions are grouped by feature area:

| Category | Controls access to |
|---|---|
| Appointments | View, create, update, and cancel appointments |
| Patients | View and edit patient records |
| Billing | View invoices, record payments, manage quotations |
| Clinical | Treatment plans, prescriptions, clinical notes |
| Files | Patient files, X-rays, lab results |
| Reports | Financial and clinic performance reports |
| Inventory | View and adjust stock |
| Settings | Which settings modules the role can access |

## Per-user overrides

If one staff member needs a permission that differs from the role default — for example, a receptionist who also records payments — you can grant or revoke individual permissions from their profile in **Staff Management** without changing the template for all receptionists.

## Related articles

- [Staff Management](/admin/staff-management)
- [Roles & Permissions](/getting-started/roles-and-permissions)
- [Clinic Settings](/admin/clinic-settings)
  • Step 3: Write docs/admin/signatures.mdx
---
title: "Signature Center"
description: "Upload and manage digital signatures that appear on treatment consents, invoices, and exported PDF documents."
icon: "pen-line"
---

The Signature Center is where staff members upload their digital signatures. Once uploaded, a signature can be applied to exported PDFs — including treatment consent forms, invoices, and clinical documents — without needing a wet signature every time.

<Note>
**All staff roles** can access Signature Center to manage their own signature. Admins can see all clinic signatures.
</Note>

## Uploading a signature

1. Open **Settings > Signature Center**.
2. Click **Upload Signature**.
3. Choose an image file (PNG with a transparent background works best).
4. Crop and adjust the placement if needed.
5. Click **Save**.

<Tip>
Use a white or transparent background for your signature image. A dark signature on a transparent background produces the cleanest result on PDF exports.
</Tip>

## Using a signature on documents

Once uploaded, your signature is available when generating PDFs. The system places it in the designated signature field on:

- Treatment consent forms
- Invoice PDFs
- Quotation PDFs

## Managing multiple signatures

Clinics with multiple doctors can store one signature per staff member. When a document is generated, the system uses the signature of the staff member who created or signed off on that document.

## Removing a signature

Select the signature in Signature Center and click **Remove**. This does not affect documents that were already exported — only future PDF exports.

## Related articles

- [Clinic Settings](/admin/clinic-settings)
- [Invoices](/finance/invoices)
- [Treatment Plans](/clinical/treatment-plans)
  • Step 4: Write docs/admin/discount-policies.mdx
---
title: "Discount Policies"
description: "Set up automatic discount rules for full payments, installment plans, and custom billing scenarios so discounts apply consistently without manual entry."
icon: "percent"
---

Discount policies let you define rules that apply discounts automatically when billing patients. Instead of relying on staff to remember the correct discount for each scenario, you configure the rule once and the system applies it every time the conditions are met.

<Note>
**Admin only** — Only administrators can create and manage discount policies.
</Note>

## Types of discount policies

| Type | When it applies |
|---|---|
| **Full payment** | Patient pays the entire invoice balance in one receipt |
| **Installment plan** | Invoice is converted to an installment schedule |
| **Custom** | Any scenario you define with a manual trigger |

## Creating a policy

1. Open **Settings > Discount Policies**.
2. Click **New Policy**.
3. Select the policy type.
4. Set the discount value — either a fixed amount or a percentage.
5. Add an optional description so staff understand when to apply it.
6. Click **Save**.

## How discounts are applied

When a staff member records a payment or creates an installment plan, the system checks whether any active policy conditions are met and pre-fills the discount field. Staff can override the suggested discount if needed.

<Tip>
Percentage discounts are calculated on the invoice subtotal before tax. If your clinic applies VAT, the tax is recalculated on the discounted subtotal.
</Tip>

## Deactivating a policy

Policies can be toggled active or inactive from the policy list. Inactive policies are not applied to new billing actions but remain visible for reference.

## Related articles

- [Invoices](/finance/invoices)
- [Installment Plans](/finance/installment-plans)
- [Receipts & Payments](/finance/receipts)
- [Discounts & Taxes](/finance/discounts-and-taxes)
  • Step 5: Commit
git add docs/admin/settings.mdx docs/admin/permission-templates.mdx docs/admin/signatures.mdx docs/admin/discount-policies.mdx
git commit -m "docs: add settings hub, permission-templates, signatures, discount-policies articles"

Task 2: Settings admin docs — Part 2 (prescription-template + finance-letterhead + medicine-library + service-catalog)

Files:
  • Create: docs/admin/prescription-template.mdx
  • Create: docs/admin/finance-letterhead.mdx
  • Create: docs/admin/medicine-library.mdx
  • Create: docs/admin/service-catalog.mdx
  • Step 1: Write docs/admin/prescription-template.mdx
---
title: "Prescription Template"
description: "Upload your clinic's letterhead or prescription pad design so every exported prescription PDF carries your clinic's branding automatically."
icon: "file-medical"
---

The Prescription Template setting lets you upload an image of your clinic's letterhead or pre-printed prescription pad. When a doctor exports a prescription PDF, the system overlays the prescription details on top of your template — producing a document that matches your physical stationery.

<Note>
**Admins and Doctors** can access Prescription Template settings.
</Note>

## Uploading a template

1. Open **Settings > Prescription Template**.
2. Click **Upload Template**.
3. Choose a PNG or JPEG image of your prescription pad or letterhead. Use a scan at 150 DPI or higher for clean output.
4. Adjust the positioning so the prescription text area aligns with the blank space on your letterhead.
5. Click **Save**.

## Template requirements

| Requirement | Detail |
|---|---|
| Format | PNG or JPEG |
| Orientation | Portrait (A4 or Letter) |
| Resolution | 150 DPI minimum, 300 DPI recommended |
| Content | Leave a clear space where prescription text will be printed |

<Tip>
If your clinic uses pre-printed paper for prescriptions, scan a blank sheet and upload it as the template. Doctors can then print on plain paper that shows your letterhead when exported as PDF.
</Tip>

## How the template is used

When a doctor opens a prescription and clicks **Download PDF**, the system renders:

1. Your uploaded template as the background layer
2. Patient name, date, medication list, dosage, and doctor signature on top

The resulting PDF looks like it was printed on your clinic's official stationery.

## Removing or replacing a template

Upload a new image to replace the current template. To remove it entirely and return to the plain prescription PDF format, click **Remove Template**.

## Related articles

- [Prescriptions](/clinical/prescriptions)
- [Signature Center](/admin/signatures)
- [Medicine Library](/admin/medicine-library)
  • Step 2: Write docs/admin/finance-letterhead.mdx
---
title: "Finance Document Letterhead"
description: "Upload a branded letterhead image for invoices, receipts, and quotations so patients receive documents that match your clinic's identity."
icon: "file-text"
---

Finance Document Letterhead adds your clinic's branding to financial PDF exports. Once you upload a letterhead image, staff get a second download option on every invoice, receipt, and quotation — a **branded PDF** that overlays the document details on your letterhead background.

<Note>
**Admin only** — Only administrators can upload or change the finance document letterhead.
</Note>

## How it works

Without a letterhead, financial PDFs are generated with the OdontoX standard layout and your clinic's name and logo in the header.

With a letterhead:
- The standard PDF remains available (unchanged)
- A second **Download on Letterhead** option appears on every invoice, receipt, and quotation
- The letterhead PDF overlays the document on your uploaded background image

Staff can choose which version to give the patient depending on the situation.

## Uploading a letterhead

1. Open **Settings > Finance Document Letterhead**.
2. Click **Upload Letterhead**.
3. Select a PNG or JPEG of your clinic's letterhead (portrait orientation, A4 or Letter size).
4. Review the preview to confirm the document content aligns correctly.
5. Click **Save**.

## File requirements

| Requirement | Detail |
|---|---|
| Format | PNG or JPEG |
| Orientation | Portrait (A4 or Letter) |
| Resolution | 150 DPI minimum, 300 DPI recommended |
| Background | Leave clear space where invoice details will be printed |

<Tip>
Design your letterhead with a header and footer area for your branding, and leave the center portion blank for invoice content. A margin of at least 2 cm on each side prevents content from overlapping your design elements.
</Tip>

## Removing a letterhead

Click **Remove** to delete the current letterhead. The branded PDF option disappears from all documents immediately. The standard PDF remains unaffected.

## Related articles

- [Invoices](/finance/invoices)
- [Receipts & Payments](/finance/receipts)
- [Quotations](/finance/quotations)
- [Prescription Template](/admin/prescription-template)
  • Step 3: Write docs/admin/medicine-library.mdx
---
title: "Medicine Library"
description: "Build and maintain your clinic's drug catalog — add medicines individually or import from CSV — so doctors can prescribe quickly with consistent names and dosages."
icon: "pills"
---

The Medicine Library is your clinic's custom drug catalog. When a doctor creates a prescription, they search this library to add medications — ensuring consistent drug names, standard dosages, and faster prescription entry.

<Note>
**Admins and Doctors** can access the Medicine Library.
</Note>

## Adding a medicine

1. Open **Settings > Medicine Library**.
2. Click **Add Medicine**.
3. Fill in the details:

| Field | Description |
|---|---|
| **Name** | Generic or brand name of the drug |
| **Strength** | Dose (e.g. 500 mg, 10 mg/5 ml) |
| **Form** | Tablet, capsule, syrup, injection, etc. |
| **Default instructions** | Pre-filled dosage directions for this drug |

4. Click **Save**.

The medicine is immediately available in the prescription wizard.

## Bulk import from CSV

For large catalogs, you can import medicines in bulk.

1. Click **Import CSV**.
2. Download the template CSV file and fill in your medicines.
3. Upload the completed CSV.
4. Review the import preview and confirm.

The CSV template columns match the individual add form: `name`, `strength`, `form`, `default_instructions`.

<Tip>
Import your most-prescribed drugs first. The prescription search ranks recent prescriptions higher, so commonly used drugs surface faster over time.
</Tip>

## Editing and removing medicines

Select any medicine in the list to edit its details. Changes take effect immediately for new prescriptions — past prescriptions are not affected.

To remove a medicine, select it and click **Delete**. Deleted medicines no longer appear in the prescription search but remain visible on historical prescriptions for reference.

## Related articles

- [Prescriptions](/clinical/prescriptions)
- [Prescription Template](/admin/prescription-template)
  • Step 4: Write docs/admin/service-catalog.mdx
---
title: "Service Catalog"
description: "Build and manage your clinic's procedure and service list — set prices, organize by category, and control which services appear in treatment plans and invoices."
icon: "book-open"
---

The Service Catalog is where you define every procedure and service your clinic offers. Services from this catalog appear as autocomplete suggestions when building treatment plans and creating invoice line items — keeping your pricing consistent and reducing data entry.

<Note>
**Admins and Doctors** can manage the service catalog.
</Note>

## Adding a service

1. Open **Settings > Services & Pricing** (or navigate to **Services** in the sidebar).
2. Click **New Service**.
3. Fill in the details:

| Field | Description |
|---|---|
| **Name** | Procedure or service name (e.g. Composite Filling) |
| **Category** | Group for filtering (e.g. Restorative, Preventive, Orthodontics) |
| **Price** | Default price charged to patients |
| **Cost** | Internal cost — used for margin tracking, not shown to patients |
| **Duration** | Estimated appointment time in minutes |
| **Notes** | Internal notes for staff |

4. Click **Save**.

## Categories

Categories help staff find the right service quickly when building a treatment plan or invoice. Create as many categories as your specialty requires — common examples include:

- Preventive (cleaning, fluoride, sealants)
- Restorative (fillings, crowns, bridges)
- Endodontic (root canals)
- Orthodontic (braces, aligners)
- Surgical (extractions, implants)
- Diagnostic (X-rays, consultations)

## Price visibility

Service prices are visible to all staff when creating invoices and treatment plans. The **cost** field is visible only to admins and is never shown in patient-facing documents.

## Editing and deactivating

Edit any service to update its price, category, or details. To remove a service from autocomplete without deleting it, mark it as **inactive**. Inactive services are hidden from search but remain on existing treatment plans and invoices.

<Tip>
Update prices in the catalog rather than overriding them on individual invoices. Consistent catalog prices make your financial reports more reliable.
</Tip>

## Related articles

- [Treatment Plans](/clinical/treatment-plans)
- [Invoices](/finance/invoices)
- [Quotations](/finance/quotations)
- [Financial Hub](/finance/financial-hub)
  • Step 5: Commit
git add docs/admin/prescription-template.mdx docs/admin/finance-letterhead.mdx docs/admin/medicine-library.mdx docs/admin/service-catalog.mdx
git commit -m "docs: add prescription-template, finance-letterhead, medicine-library, service-catalog articles"

Task 3: Settings admin docs — Part 3 (laboratories + operatories + whatsapp + appearance + billing)

Files:
  • Create: docs/admin/laboratories.mdx
  • Create: docs/admin/operatories.mdx
  • Create: docs/admin/whatsapp.mdx
  • Create: docs/admin/appearance.mdx
  • Create: docs/admin/billing.mdx
  • Step 1: Write docs/admin/laboratories.mdx
---
title: "Laboratories"
description: "Register dental laboratories, assign them to lab work orders, and track turnaround times for outsourced clinical work."
icon: "flask-conical"
---

The Laboratories section lets you maintain a list of the dental labs your clinic works with. Once registered, a lab can be assigned to lab work orders — making it easy to track which lab is handling each case and when to expect it back.

<Note>
**Admins, Doctors, and Receptionists** with the appropriate permission can view the laboratory list.
</Note>

## Adding a laboratory

1. Open **Settings > Laboratories**.
2. Click **Add Lab**.
3. Fill in the details:

| Field | Description |
|---|---|
| **Name** | Lab name (e.g. Bright Smile Dental Lab) |
| **Contact name** | Primary point of contact |
| **Phone** | Lab phone number |
| **Email** | Lab email for order confirmations |
| **Address** | Physical address (optional) |
| **Notes** | Specialties, turnaround policy, or other notes |

4. Click **Save**.

## Assigning a lab to a work order

When creating a lab work order from **Lab Work** in the sidebar, you can select a registered lab from a dropdown. The system records which lab is handling the case and tracks the expected return date.

<Tip>
Add a note to each lab with their typical turnaround time — for example, "3–5 business days for crowns". This helps staff set accurate expected return dates when creating work orders.
</Tip>

## Editing and removing labs

Select any lab in the list to update its details. Removing a lab does not affect existing lab work orders — historical records retain the lab name.

## Related articles

- [Lab Work](/clinical/lab-cases)
- [Staff Management](/admin/staff-management)
  • Step 2: Write docs/admin/operatories.mdx
---
title: "Operatories & Chairs"
description: "Define the treatment rooms and dental chairs in your clinic, assign identifying colors, and use them to organize appointments on the calendar."
icon: "armchair"
---

Operatories represent the physical treatment rooms and dental chairs in your clinic. Once defined, they appear as color-coded options when scheduling appointments — helping staff assign patients to the right chair and giving you a visual layout of room utilization on the calendar.

<Note>
**Admin only** — Only administrators can add, edit, or remove operatories.
</Note>

## Adding an operatory

1. Open **Settings > Operatories / Chairs**.
2. Click **Add Operatory**.
3. Fill in the details:

| Field | Description |
|---|---|
| **Name** | Identifying name (e.g. Chair 1, Room A, Hygiene Bay) |
| **Color** | Appointment color for this chair on the calendar |
| **Notes** | Any details relevant to staff (e.g. equipment limitations) |

4. Click **Save**.

The operatory is immediately available when scheduling appointments.

## Using colors for quick reference

Each operatory has a color that appears as a badge on appointment cards in the calendar view. Choose distinct colors for each chair so staff can see at a glance which room an appointment is in without opening the appointment detail.

<Tip>
Use descriptive names like "Dr. Ahmed's Room" or "X-Ray Room" rather than generic labels like "Chair 1". Descriptive names reduce confusion for front-desk staff who are not familiar with the physical layout.
</Tip>

## Editing and removing operatories

Edit an operatory to change its name or color. Removing an operatory does not affect existing appointments — historical appointments retain the operatory name for reference. Future appointments that referenced the removed operatory will need to be reassigned.

## Related articles

- [Appointments](/clinical/appointments)
- [Clinic Settings](/admin/clinic-settings)
  • Step 3: Write docs/admin/whatsapp.mdx
---
title: "WhatsApp"
description: "Connect your Meta Business API to send appointment reminders, receive patient messages, and run WhatsApp conversations from within OdontoX."
icon: "message-circle"
---

The WhatsApp integration connects your clinic to the Meta Business API, enabling two-way WhatsApp messaging with patients. Once connected, you can send appointment reminders via WhatsApp and receive and reply to patient messages from within the platform.

<Note>
**Admin only** — Only administrators can connect or disconnect the WhatsApp integration.

This feature requires an active Meta Business account and a WhatsApp Business API number. Your clinic plan must include WhatsApp to enable this setting.
</Note>

## What WhatsApp enables

- Automated appointment reminder messages sent to patients at configurable intervals
- Two-way patient messaging via the **Messaging** module in the sidebar
- Message history stored against patient records

## Connecting your Meta Business account

1. Open **Settings > WhatsApp**.
2. Click **Connect WhatsApp**.
3. You will be redirected to Meta's authorization flow. Log in with your Meta Business account.
4. Select the WhatsApp Business number you want to use.
5. Approve the required permissions.
6. You are redirected back to OdontoX. The connection status shows **Active**.

<Note>
If you do not have a Meta Business account or WhatsApp Business API number, visit [business.whatsapp.com](https://business.whatsapp.com) to get started. Meta requires business verification before granting API access.
</Note>

## Appointment reminder messages

Once connected, WhatsApp reminders are sent automatically based on your notification settings. Each message includes the appointment date, time, and doctor name. Patients can reply and their message appears in the Messaging module.

## Disconnecting

Click **Disconnect** to remove the Meta API connection. Automated WhatsApp messages stop immediately. Patient message history is retained.

## Related articles

- [Notifications](/admin/notifications)
- [Messaging](/admin/messaging)
- [Appointments](/clinical/appointments)
  • Step 4: Write docs/admin/appearance.mdx
---
title: "Appearance"
description: "Personalise your workspace color scheme and switch between light and dark mode — changes apply only to your account and do not affect other users."
icon: "palette"
---

The Appearance setting lets each user customize their own workspace. You can switch between light and dark mode and choose an accent color. These preferences are personal — they apply only to your account and have no effect on what other staff or patients see.

<Note>
**All staff roles** can access Appearance settings to personalize their own workspace.
</Note>

## Theme

Switch between **Light**, **Dark**, and **System** modes:

| Option | Behavior |
|---|---|
| Light | Always shows the light interface |
| Dark | Always shows the dark interface |
| System | Follows your device's current dark/light mode setting |

## Accent color

Choose an accent color that appears on active navigation items, buttons, and highlights throughout the interface. Select from the preset palette or enter a custom hex value.

<Tip>
If your clinic has specific brand colors, you can set your accent to match — though this only affects your own view, not the clinic-wide theme (which is controlled in **Clinic Profile**).
</Tip>

## Resetting to defaults

Click **Reset to Default** to return to the standard theme and accent color. The clinic-wide default theme is Light with the OdontoX blue accent.

## Related articles

- [Clinic Settings](/admin/clinic-settings) — Clinic-wide branding and logo
  • Step 5: Write docs/admin/billing.mdx
---
title: "My Billing"
description: "View your clinic's current plan, license seat usage, billing history, and subscription status — and manage upgrades directly from the platform."
icon: "credit-card"
---

My Billing gives you a full picture of your clinic's subscription — what plan you are on, how many seats you are using, when your next renewal is, and your billing document history.

<Note>
**Admin only** — Only administrators can view and manage clinic billing.
</Note>

## What you can see

### Current plan

Shows your active plan name (Starter, Growth, or Pro), the billing cycle (monthly or annual), and the renewal date. If you are on a trial, the remaining trial days and trial end date are shown.

### License usage

A live count of how many of your licensed staff seats are currently occupied. If you are approaching your seat limit, an alert appears here.

### Billing history

A list of past invoices with amount, date, and status. Click any invoice to download the PDF for your records.

## Upgrading your plan

Click **Upgrade Plan** to review available plans and submit an upgrade request. Our team processes upgrade requests and confirms the change via email.

## Cancellations and changes

To cancel your subscription or discuss plan changes, contact us at [[email protected]](mailto:[email protected]). We do not support self-serve cancellations at this time.

<Note>
Downgrading to a lower plan may restrict access to modules included in your current plan. Our team will confirm any impact before applying a change.
</Note>

## Related articles

- [Trial & Plans](/getting-started/trial-and-plans)
- [Upgrading](/getting-started/upgrading)
- [Subscriptions](/admin/subscriptions)
  • Step 6: Commit
git add docs/admin/laboratories.mdx docs/admin/operatories.mdx docs/admin/whatsapp.mdx docs/admin/appearance.mdx docs/admin/billing.mdx
git commit -m "docs: add laboratories, operatories, whatsapp, appearance, billing articles"

Task 4: Finance docs (financial-hub + daily-close)

Files:
  • Create: docs/finance/financial-hub.mdx
  • Create: docs/finance/daily-close.mdx
  • Step 1: Write docs/finance/financial-hub.mdx
---
title: "Financial Hub"
description: "The Financial Hub consolidates quotations, invoices, and receipts into a single tabbed workspace so your team can manage all billing activity from one place."
icon: "banknote"
---

The Financial Hub is your clinic's central billing workspace. It brings together quotations, invoices, and receipts under one view so staff can handle the entire patient billing journey without switching between separate screens.

<Note>
**Admins** have full access including the Revenue Overview. **Doctors** and **Receptionists** see only the billing documents relevant to their role and permissions.
</Note>

## Sections

<CardGroup cols={2}>
  <Card title="Revenue Overview" icon="chart-line" href="/finance/reports">
    A summary of clinic revenue, outstanding balances, and collection trends. Visible to admins.
  </Card>
  <Card title="Quotations" icon="file-text" href="/finance/quotations">
    Create and send cost estimates to patients before treatment begins.
  </Card>
  <Card title="Invoices" icon="receipt" href="/finance/invoices">
    Bill patients for completed procedures and track payment status.
  </Card>
  <Card title="Receipts" icon="badge-check" href="/finance/receipts">
    Record and confirm payments received against invoices.
  </Card>
</CardGroup>

## Navigating the hub

Click any tab — **Quotations**, **Invoices**, or **Receipts** — to switch between document types. The URL updates automatically, so you can bookmark or share a direct link to any tab.

You can also navigate directly from a patient's record. The patient Finance tab links to the hub with the relevant document pre-filtered to that patient.

## Typical billing workflow

<Steps>

### Create a quotation

When a patient needs a cost estimate before agreeing to treatment, create a quotation. Add the planned procedures and their prices. The patient receives the estimate by email and can accept or discuss it with your team.

### Convert to invoice

Once the patient agrees and treatment is complete, convert the accepted quotation directly to an invoice. The line items carry over — no re-entry needed.

### Record payment

When the patient pays, record a receipt against the invoice. The invoice status updates automatically (Partial → Paid) and the receipt is available for the patient to download.

</Steps>

## Related articles

- [Quotations](/finance/quotations)
- [Invoices](/finance/invoices)
- [Receipts & Payments](/finance/receipts)
- [Installment Plans](/finance/installment-plans)
- [Financial Reports](/finance/reports)
- [Daily Close](/finance/daily-close)
  • Step 2: Write docs/finance/daily-close.mdx
---
title: "Daily Close"
description: "Run a Daily Close at the end of each working day to review revenue collected, expenses recorded, and generate an end-of-day summary report for your records."
icon: "book-open-check"
---

The Daily Close is your clinic's end-of-day financial review. It summarizes all payments collected, refunds issued, and expenses recorded during the day, and generates a report you can save or print for your records.

<Note>
**Admins** have full access to Daily Close. **Receptionists** with reporting permission can also run the close.
</Note>

## What the Daily Close includes

| Section | What it shows |
|---|---|
| **Receipts** | All payments recorded during the day, grouped by payment method |
| **Invoices issued** | New invoices created on this date |
| **Expenses** | Any expenses logged for the day |
| **Net total** | Receipts minus expenses |

## Running a Daily Close

1. Navigate to **Daily Close** in the sidebar (under Operations).
2. Select the date — defaults to today.
3. Review each section for accuracy.
4. Click **Generate Report** to produce a PDF summary.
5. Download or print the report for your records.

<Tip>
Run the Daily Close before your last staff member leaves for the day. Reviewing it in real time makes it easier to catch missing payments or unrecorded expenses before the next morning.
</Tip>

## Reviewing past closes

You can select any past date to review a historical close. Past closes show the data as it stood at the end of that day.

<Note>
The Daily Close is a reporting view — it does not lock or post transactions. All payment, invoice, and expense records can still be edited after a close is run.
</Note>

## Related articles

- [Financial Hub](/finance/financial-hub)
- [Receipts & Payments](/finance/receipts)
- [Financial Reports](/finance/reports)
- [Invoices](/finance/invoices)
  • Step 3: Commit
git add docs/finance/financial-hub.mdx docs/finance/daily-close.mdx
git commit -m "docs: add financial-hub and daily-close articles"

Task 5: Wire helpUrls in useNavItems.ts

Files:
  • Modify: ui/src/hooks/useNavItems.ts
This file defines nav items for admin, doctor, and receptionist roles. Financial Hub and its children lack helpUrl. Settings, services, and eod nav items also lack helpUrl. Add them now.
  • Step 1: Add helpUrls to admin role — Finance section
In ui/src/hooks/useNavItems.ts, find the admin role Finance section (around line 132). Change:
hasModule('finance') && {
    id: 'finance',
    label: 'Financial Hub',
    icon: ic(Banknote),
    children: [
        { id: 'finance-quotations', label: 'Quotations', icon: ic(FileText, 'h-4 w-4') },
        { id: 'finance-invoices', label: 'Invoices', icon: ic(ReceiptText, 'h-4 w-4') },
        { id: 'finance-receipts', label: 'Receipts', icon: ic(BadgeCheck, 'h-4 w-4') },
    ]
},
To:
hasModule('finance') && {
    id: 'finance',
    label: 'Financial Hub',
    icon: ic(Banknote),
    helpUrl: 'https://q.odontox.io/finance/financial-hub',
    children: [
        { id: 'finance-quotations', label: 'Quotations', icon: ic(FileText, 'h-4 w-4'), helpUrl: 'https://q.odontox.io/finance/quotations' },
        { id: 'finance-invoices', label: 'Invoices', icon: ic(ReceiptText, 'h-4 w-4'), helpUrl: 'https://q.odontox.io/finance/invoices' },
        { id: 'finance-receipts', label: 'Receipts', icon: ic(BadgeCheck, 'h-4 w-4'), helpUrl: 'https://q.odontox.io/finance/receipts' },
    ]
},
  • Step 2: Add helpUrls to admin role — Operations + bottom sections
Find (admin role):
{ id: 'services', label: 'Service Catalog', icon: ic(BookOpen) },
Change to:
{ id: 'services', label: 'Service Catalog', icon: ic(BookOpen), helpUrl: 'https://q.odontox.io/admin/service-catalog' },
Find (admin role):
{ id: 'eod', label: 'Daily Close', icon: ic(BookOpenCheck) },
Change to:
{ id: 'eod', label: 'Daily Close', icon: ic(BookOpenCheck), helpUrl: 'https://q.odontox.io/finance/daily-close' },
Find (admin role, bottom section):
{ id: 'settings', label: 'Settings', icon: ic(Settings) },
Change to:
{ id: 'settings', label: 'Settings', icon: ic(Settings), helpUrl: 'https://q.odontox.io/admin/settings' },
  • Step 3: Add helpUrls to doctor role — Finance children + settings
Find the doctor role Finance section (around line 218):
hasModule('finance') && {
    id: 'finance',
    label: 'Financial Hub',
    icon: ic(Banknote),
    children: [
        { id: 'finance-quotations', label: 'Quotations', icon: ic(FileText, 'h-4 w-4') },
        { id: 'finance-invoices', label: 'Invoices', icon: ic(ReceiptText, 'h-4 w-4') },
        { id: 'finance-receipts', label: 'Receipts', icon: ic(BadgeCheck, 'h-4 w-4') },
    ]
},
Change to:
hasModule('finance') && {
    id: 'finance',
    label: 'Financial Hub',
    icon: ic(Banknote),
    helpUrl: 'https://q.odontox.io/finance/financial-hub',
    children: [
        { id: 'finance-quotations', label: 'Quotations', icon: ic(FileText, 'h-4 w-4'), helpUrl: 'https://q.odontox.io/finance/quotations' },
        { id: 'finance-invoices', label: 'Invoices', icon: ic(ReceiptText, 'h-4 w-4'), helpUrl: 'https://q.odontox.io/finance/invoices' },
        { id: 'finance-receipts', label: 'Receipts', icon: ic(BadgeCheck, 'h-4 w-4'), helpUrl: 'https://q.odontox.io/finance/receipts' },
    ]
},
Find doctor role bottom section:
{ id: 'settings', label: 'Settings', icon: ic(Settings) },
Change to:
{ id: 'settings', label: 'Settings', icon: ic(Settings), helpUrl: 'https://q.odontox.io/admin/settings' },
  • Step 4: Add helpUrls to receptionist role — Finance children + settings
Find the receptionist role Finance section (around line 257):
hasModule('finance') && has('billing.invoices.view') && {
    id: 'finance',
    label: 'Financial Hub',
    icon: ic(Banknote),
    children: [
        { id: 'finance-quotations', label: 'Quotations', icon: ic(FileText, 'h-4 w-4') },
        { id: 'finance-invoices', label: 'Invoices', icon: ic(ReceiptText, 'h-4 w-4') },
        has('billing.payments.record') && { id: 'finance-receipts', label: 'Receipts', icon: ic(BadgeCheck, 'h-4 w-4') },
    ].filter(Boolean)
},
Change to:
hasModule('finance') && has('billing.invoices.view') && {
    id: 'finance',
    label: 'Financial Hub',
    icon: ic(Banknote),
    helpUrl: 'https://q.odontox.io/finance/financial-hub',
    children: [
        { id: 'finance-quotations', label: 'Quotations', icon: ic(FileText, 'h-4 w-4'), helpUrl: 'https://q.odontox.io/finance/quotations' },
        { id: 'finance-invoices', label: 'Invoices', icon: ic(ReceiptText, 'h-4 w-4'), helpUrl: 'https://q.odontox.io/finance/invoices' },
        has('billing.payments.record') && { id: 'finance-receipts', label: 'Receipts', icon: ic(BadgeCheck, 'h-4 w-4'), helpUrl: 'https://q.odontox.io/finance/receipts' },
    ].filter(Boolean)
},
Find receptionist role bottom section:
{ id: 'settings', label: 'Settings', icon: ic(Settings) },
Change to:
{ id: 'settings', label: 'Settings', icon: ic(Settings), helpUrl: 'https://q.odontox.io/admin/settings' },
  • Step 5: Commit
git add ui/src/hooks/useNavItems.ts
git commit -m "feat(ui): add helpUrls to Financial Hub children, settings, services, and eod nav items"

Task 6: Update AppLayout.tsx — show HelpCircle on parent nav items

Files:
  • Modify: ui/src/components/layout/AppLayout.tsx:271
Currently, the HelpCircle icon is hidden for nav items that have children (!hasChildren guard). The Financial Hub parent has helpUrl but also has children, so the icon never renders. Remove the guard.
  • Step 1: Remove !hasChildren guard
Find in ui/src/components/layout/AppLayout.tsx (around line 271):
{item.helpUrl && !hasChildren && (
  <a
    href={item.helpUrl}
    target="_blank"
    rel="noopener noreferrer"
    onClick={e => e.stopPropagation()}
    className="flex-shrink-0 text-muted-foreground hover:text-foreground transition-colors opacity-0 group-hover:opacity-100"
    title="View help article"
    tabIndex={-1}
  >
    {React.createElement(HelpCircle as any, { className: 'h-3.5 w-3.5' })}
  </a>
)}
{hasChildren && (
  React.createElement(ChevronDown as any, {
    className: `h-4 w-4 text-muted-foreground transition-transform duration-200 ${isExpanded ? 'rotate-180' : ''}`,
  })
)}
Change to (remove !hasChildren):
{item.helpUrl && (
  <a
    href={item.helpUrl}
    target="_blank"
    rel="noopener noreferrer"
    onClick={e => e.stopPropagation()}
    className="flex-shrink-0 text-muted-foreground hover:text-foreground transition-colors opacity-0 group-hover:opacity-100"
    title="View help article"
    tabIndex={-1}
  >
    {React.createElement(HelpCircle as any, { className: 'h-3.5 w-3.5' })}
  </a>
)}
{hasChildren && (
  React.createElement(ChevronDown as any, {
    className: `h-4 w-4 text-muted-foreground transition-transform duration-200 ${isExpanded ? 'rotate-180' : ''}`,
  })
)}
This renders HelpCircle and ChevronDown side by side on expandable items that have a helpUrl. The e.stopPropagation() on the anchor already prevents clicks on the icon from toggling the parent expansion.
  • Step 2: Commit
git add ui/src/components/layout/AppLayout.tsx
git commit -m "feat(ui): show helpUrl icon on expandable nav items (Financial Hub)"

Task 7: Update SettingsModule.tsx — docsUrl on cards + info button in module header

Files:
  • Modify: ui/src/components/settings/SettingsModule.tsx
Two changes: (1) add docsUrl to every card in allCards, (2) add HelpCircle link in the module header when inside a module.
  • Step 1: Add HelpCircle to imports
Find the existing lucide-react import in ui/src/components/settings/SettingsModule.tsx:
import {
  UsersRound,
  Armchair,
  Bell,
  FileSignature,
  ScrollText,
  ChevronRight,
  ArrowLeft,
  Lock,
  WalletCards,
  MessageSquare,
  Home,
  Coins,
  Sparkles,
  FileText,
  Building2,
  ShieldCog,
  Wifi,
  BookOpen,
} from 'lucide-react';
Change to (add HelpCircle):
import {
  UsersRound,
  Armchair,
  Bell,
  FileSignature,
  ScrollText,
  ChevronRight,
  ArrowLeft,
  Lock,
  WalletCards,
  MessageSquare,
  Home,
  Coins,
  Sparkles,
  FileText,
  Building2,
  ShieldCog,
  Wifi,
  BookOpen,
  HelpCircle,
} from 'lucide-react';
  • Step 2: Add docsUrl to every card in allCards
Replace the entire allCards array (lines ~122–278) with the version below — identical to the original except each object gains a docsUrl property:
const allCards = [
  {
    id: 'profile',
    title: 'Clinic Profile',
    description: "Update your clinic's name, address, phone number, logo, and branding assets used across invoices and patient communications.",
    icon: <Home className="h-6 w-6 text-sky-500" />,
    component: <ClinicProfileSettings />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/admin/clinic-settings',
  },
  {
    id: 'staff',
    title: 'Staff, Patients & Permissions',
    description: 'Add, edit, and deactivate team members. Control access levels, manage patient records, and handle staff invitations.',
    icon: <UsersRound className="h-6 w-6 text-indigo-500" />,
    component: <StaffManagement onViewChange={updateSettingsRoute} />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/admin/staff-management',
  },
  {
    id: 'permission-templates',
    title: 'Permission Templates',
    description: 'Define default permission sets for each staff role. New team members automatically inherit the permissions assigned to their role.',
    icon: <ShieldCog className="h-6 w-6 text-violet-500" />,
    component: <PermissionTemplatesPage />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/admin/permission-templates',
  },
  {
    id: 'documents',
    title: 'Signature Center',
    description: 'Upload and manage digital signatures used to sign treatment consents, invoices, and exported PDF documents.',
    icon: <FileSignature className="h-6 w-6 text-amber-600" />,
    component: <DocumentationSettings />,
    roles: ['admin', 'doctor', 'receptionist'],
    permission: 'settings.signatures.view' as const,
    docsUrl: 'https://q.odontox.io/admin/signatures',
  },
  {
    id: 'document-numbering',
    title: 'Documentation',
    description: 'Configure numbering sequences, prefixes, and formatting for invoices, receipts, quotations, and all clinic documents.',
    icon: <FileText className="h-6 w-6 text-emerald-600" />,
    component: <DocumentSettingsContainer />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/finance/document-numbering',
  },
  {
    id: 'discount-policies',
    title: 'Discount Policies',
    description: 'Set up discount rules for full payments, installment plans, and custom scenarios. Applied automatically when billing patients.',
    icon: <Coins className="h-6 w-6 text-amber-500" />,
    component: <DiscountPoliciesSettings />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/admin/discount-policies',
  },
  {
    id: 'prescription-template',
    title: 'Prescription Template',
    description: "Upload your clinic's letterhead or prescription pad design. Applied automatically when exporting prescription PDFs for patients.",
    icon: <FileText className="h-6 w-6 text-blue-500" />,
    component: <PrescriptionTemplateSettings />,
    roles: ['admin', 'superadmin', 'doctor'],
    docsUrl: 'https://q.odontox.io/admin/prescription-template',
  },
  {
    id: 'document-letterhead',
    title: 'Finance Document Letterhead',
    description: "Upload a letterhead image for invoices, receipts, and quotations. Staff get a second download option to export on your clinic's branded paper.",
    icon: <FileText className="h-6 w-6 text-violet-500" />,
    component: <DocumentLetterheadSettings />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/admin/finance-letterhead',
  },
  {
    id: 'medicine-library',
    title: 'Medicine Library',
    description: "Manage your clinic's medicine catalog. Add drugs individually or bulk-import from CSV. Used in the prescription wizard.",
    icon: <BookOpen className="h-6 w-6 text-teal-500" />,
    settings: <MedicineLibrarySettings />,
    component: <MedicineLibraryPage />,
    roles: ['admin', 'superadmin', 'doctor'],
    docsUrl: 'https://q.odontox.io/admin/medicine-library',
  },
  {
    id: 'services',
    title: 'Services & Pricing',
    description: 'Build and manage your service catalog — add procedures, set prices, assign categories, and control visibility in treatment plans.',
    icon: <Coins className="h-6 w-6 text-emerald-500" />,
    component: <ServiceCatalog />,
    roles: ['admin', 'superadmin', 'doctor'],
    docsUrl: 'https://q.odontox.io/admin/service-catalog',
  },
  {
    id: 'laboratories',
    title: 'Laboratories',
    description: 'Register and manage dental laboratories. Assign labs to lab work orders and track turnaround times for outsourced work.',
    icon: <Building2 className="h-6 w-6 text-purple-500" />,
    component: <LaboratoryCatalog />,
    roles: ['admin', 'superadmin', 'doctor', 'receptionist'],
    permission: 'lab.laboratories.view' as const,
    docsUrl: 'https://q.odontox.io/admin/laboratories',
  },
  {
    id: 'operatories',
    title: 'Operatories / Chairs',
    description: 'Define treatment rooms and dental chairs in your clinic. Assign colors for easier scheduling and appointment management.',
    icon: <Armchair className="h-6 w-6 text-orange-500" />,
    component: <OperatorySettings />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/admin/operatories',
  },
  {
    id: 'bridge-devices',
    title: 'Bridge Devices',
    description: 'Connect X-ray machines and intraoral scanners. Generate and manage API keys for the Bridge desktop app.',
    icon: <Wifi className="h-6 w-6 text-sky-500" />,
    component: <BridgeDevicesSettings />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/admin/bridge-devices',
  },
  {
    id: 'whatsapp',
    title: 'WhatsApp',
    description: 'Connect your Meta Business API to send appointment reminders and receive patient messages via WhatsApp.',
    icon: <MessageSquare className="h-6 w-6 text-green-500" />,
    component: <WhatsAppSettings user={user} />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/admin/whatsapp',
  },
  {
    id: 'notifications',
    title: 'Notifications',
    description: 'Set up automated email reminders for appointments, configure notification preferences, and manage alert subscriptions.',
    icon: <Bell className="h-6 w-6 text-rose-500" />,
    component: <NotificationSettings />,
    roles: ['admin', 'superadmin', 'doctor', 'receptionist'],
    docsUrl: 'https://q.odontox.io/admin/notifications',
  },
  {
    id: 'audit',
    title: 'Audit Logs',
    description: 'Track all actions taken within your clinic — logins, record edits, deletions, and staff activity for compliance and security.',
    icon: <ScrollText className="h-6 w-6 text-slate-500" />,
    component: <AuditLogs />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/admin/audit-logs',
  },
  {
    id: 'appearance',
    title: 'Appearance',
    description: 'Personalise your workspace color scheme and theme. Applies only to your account and does not affect other users.',
    icon: <Sparkles className="h-6 w-6 text-violet-500" />,
    component: <ThemeCustomizerSettings />,
    roles: ['admin', 'superadmin', 'doctor', 'receptionist'],
    docsUrl: 'https://q.odontox.io/admin/appearance',
  },
  {
    id: 'security',
    title: 'Security',
    description: 'Set up two-factor authentication, manage passkeys, and configure session security to protect your account.',
    icon: <Lock className="h-6 w-6 text-red-500" />,
    component: <SecuritySettingsPage />,
    roles: ['admin', 'superadmin', 'doctor', 'receptionist', 'patient'],
    docsUrl: 'https://q.odontox.io/admin/security',
  },
  {
    id: 'billing',
    title: 'My Billing',
    description: 'View your clinic plan, billing documents, license usage, and subscription status.',
    icon: <WalletCards className="h-6 w-6 text-teal-600" />,
    component: <AdminBillingSettings />,
    roles: ['admin', 'superadmin'],
    docsUrl: 'https://q.odontox.io/admin/billing',
  },
];
  • Step 3: Add HelpCircle link in module header
Find the active module view header block (around line 454):
<div className="flex items-center gap-4 border-b pb-4">
  <Button variant="ghost" size="icon" onClick={() => updateSettingsRoute(null)}>
    <ArrowLeft className="h-4 w-4" />
  </Button>
  <div className="space-y-1">
    <Breadcrumb>
      <BreadcrumbList>
        <BreadcrumbItem>
          <BreadcrumbLink onClick={() => updateSettingsRoute(null)} className="cursor-pointer">Settings</BreadcrumbLink>
        </BreadcrumbItem>
        <BreadcrumbSeparator />
        <BreadcrumbItem>
          <BreadcrumbPage>{activeSection?.title}</BreadcrumbPage>
        </BreadcrumbItem>
      </BreadcrumbList>
    </Breadcrumb>
  </div>
</div>
Change to (add ml-auto docs link after the breadcrumb div):
<div className="flex items-center gap-4 border-b pb-4">
  <Button variant="ghost" size="icon" onClick={() => updateSettingsRoute(null)}>
    <ArrowLeft className="h-4 w-4" />
  </Button>
  <div className="space-y-1">
    <Breadcrumb>
      <BreadcrumbList>
        <BreadcrumbItem>
          <BreadcrumbLink onClick={() => updateSettingsRoute(null)} className="cursor-pointer">Settings</BreadcrumbLink>
        </BreadcrumbItem>
        <BreadcrumbSeparator />
        <BreadcrumbItem>
          <BreadcrumbPage>{activeSection?.title}</BreadcrumbPage>
        </BreadcrumbItem>
      </BreadcrumbList>
    </Breadcrumb>
  </div>
  {activeSection?.docsUrl && (
    <a
      href={activeSection.docsUrl}
      target="_blank"
      rel="noopener noreferrer"
      className="ml-auto text-muted-foreground hover:text-foreground transition-colors"
      title="View documentation"
    >
      <HelpCircle className="h-4 w-4" />
    </a>
  )}
</div>
  • Step 4: Commit
git add ui/src/components/settings/SettingsModule.tsx
git commit -m "feat(ui): add docsUrl to all settings cards and info button in module headers"

Task 8: Write v1.6 release notes

Files:
  • Create: docs/releases/v1-6.mdx
  • Step 1: Write the release notes
---
title: "v1.6 — TIFF/DICOM Viewer, Real-time Messaging, and Help Center Expansion"
description: "Server-side TIFF and DICOM conversion with a dedicated viewer tab, real-time messaging with read receipts, inventory expiry alerts, medical history at registration, a redesigned login page, and 15 new help center articles covering every settings module."
icon: "rocket"
---

## Overview

v1.6 is a depth release — filling in the gaps between the platform's major features with the kinds of improvements that make everyday clinical work smoother. The headline additions are a native TIFF/DICOM viewer (no third-party app required), real-time in-app messaging with read receipts, and a meaningful expansion of the help center so that every settings module and financial workflow now has its own dedicated article.

---

## TIFF and DICOM — Native Viewer and Server-Side Conversion

X-ray files from the Bridge desktop app are now viewable directly in OdontoX without downloading or opening an external application.

**Server-side PNG conversion:** When a TIFF or DICOM file is uploaded via Bridge, the server immediately converts it to a high-quality PNG preview in the background. This preview is used everywhere the file appears — Bridge Inbox thumbnails, the Radiology Workstation, and email previews — so you always see the image, not a generic file icon.

**Dedicated TIFF viewer tab:** Click any TIFF file in the File Manager or Bridge Inbox to open it in a full-resolution viewer tab. The viewer handles large multi-frame TIFFs and displays them clearly with proper contrast.

**Bridge Inbox badges:** Each file in the Bridge Inbox now shows a conversion status badge (Converted, Pending, or Failed) so staff know at a glance whether a preview is ready.

**Corrupt TIFF recovery:** If a preview image is detected as corrupt during load, the system automatically triggers a re-conversion and refreshes the preview without any manual action.

---

## Real-time Messaging

The in-app messaging module now updates in real time with read receipts and attachment previews.

- **Read receipts:** Messages show a delivered/read status. When the other party opens a message thread, the receipt updates immediately.
- **Attachment thumbnails:** Images and documents shared in a conversation show inline previews instead of generic file links.
- **Message toast notifications:** A small toast appears when a new message arrives while you are working in another part of the platform.
- **Chat polling pauses:** The messaging background poll pauses automatically when the browser tab is hidden, reducing unnecessary network activity.

---

## Inventory — Expiry Alerts and Bulk Actions

**Expiry alerts:** Items in the Inventory module now show a color-coded expiry status — items expiring within 30 days are highlighted amber, expired items red. A summary panel at the top of Inventory shows counts by status so you can act before stock goes to waste.

**Bulk assign:** Select multiple inventory items and assign them to a patient or location in one action.

**Hard delete:** Items that are fully consumed or removed from service can now be permanently deleted from the inventory list, not just deactivated.

**Knowledge base sidebar links:** Each section of Inventory now includes a quick link to the relevant help article.

---

## Medical History at Registration

When creating a new patient, the registration form now includes the full medical history section — allergies, medications, medical conditions, and notes. Previously, medical history could only be added after the patient was created. This removes the two-step workflow for new patients and ensures clinical information is captured before the first appointment.

---

## Login Page Redesign

The sign-in page has been updated with a cleaner layout and improved readability:

- **Welcome heading** replaces the old logo-only top section, giving the page a clearer entry point
- **Dark input fields** provide better contrast and reduce visual noise against the page background
- **Clinic logo in the hero panel** — multi-clinic users see their primary clinic's branding on the right-side visual panel
- **Version tag** at the bottom of the form makes it easy to confirm which release your clinic is running

---

## Bridge Desktop App — v1.0.2

- Queue deduplication prevents the same file from being uploaded twice when the Bridge tray app retries on a flaky connection
- TIFF retry logic now correctly handles files that failed conversion on the first attempt
- Windows release workflow: the Bridge app now ships a signed `.exe` installer built automatically on every release
- The tray menu shows the current app version for easier support troubleshooting

---

## Help Center Expansion — 15 New Articles

Every settings module and key financial workflow now has a dedicated help article. New articles:

**Settings:**
- [Settings Overview](/admin/settings)
- [Permission Templates](/admin/permission-templates)
- [Signature Center](/admin/signatures)
- [Discount Policies](/admin/discount-policies)
- [Prescription Template](/admin/prescription-template)
- [Finance Document Letterhead](/admin/finance-letterhead)
- [Medicine Library](/admin/medicine-library)
- [Service Catalog](/admin/service-catalog)
- [Laboratories](/admin/laboratories)
- [Operatories & Chairs](/admin/operatories)
- [WhatsApp](/admin/whatsapp)
- [Appearance](/admin/appearance)
- [My Billing](/admin/billing)

**Finance:**
- [Financial Hub](/finance/financial-hub)
- [Daily Close](/finance/daily-close)

**In-app info buttons:** Every settings module now shows a help icon (?) in its header that opens the relevant article. The Financial Hub sidebar items (Quotations, Invoices, Receipts) and the Settings, Service Catalog, and Daily Close nav items also now carry help links.

---

## Reliability and Bug Fixes

- **Chunk recovery:** Stale JS chunks after a deploy now trigger a hard page reload instead of showing a blank error screen. No-cache headers on all routes prevent browsers from serving outdated chunks.
- **Passkey sign-in:** Passkey authentication now always uses unconstrained discovery, so any registered device is offered regardless of which clinic you are signing in to.
- **AI tracing:** Langfuse tracing errors are now non-fatal — an AI feature failing to log a trace no longer blocks the underlying response from reaching the user.
- **Invitation acceptance:** Clicking an already-accepted invitation link now shows a clear "already accepted" message instead of an error page.
- **WebGL guard:** Shader-based background components now detect missing WebGL support and fall back gracefully instead of crashing.
  • Step 2: Commit
git add docs/releases/v1-6.mdx
git commit -m "docs: add v1.6 release notes"

Task 9: Bump version tag

Files:
  • Modify: ui/src/components/ui/sign-in.tsx:79
  • Step 1: Update APP_VERSION
In ui/src/components/ui/sign-in.tsx, find line 79:
const APP_VERSION = 'v1.5';
Change to:
const APP_VERSION = 'v1.6';
  • Step 2: Commit
git add ui/src/components/ui/sign-in.tsx
git commit -m "chore(ui): bump APP_VERSION to v1.6"

Task 10: Deploy

  • Step 1: Run deploy via odontox-commit-deploy skill
Invoke the odontox-commit-deploy skill for the final deployment step. This handles staging verification, Cloudflare Pages promotion, and canonical URL confirmation.

Self-Review

Spec coverage check:
Spec sectionTask
14 new docsTasks 1–4
helpUrl on finance children (admin/doctor/receptionist)Task 5
helpUrl on finance parentTask 5
helpUrl on settings nav itemTask 5
helpUrl on services nav itemTask 5
helpUrl on eod nav itemTask 5
AppLayout !hasChildren guard removalTask 6
docsUrl on all settings cardsTask 7
HelpCircle in settings module headerTask 7
v1.6 release notes (no superadmin)Task 8
APP_VERSION bumpTask 9
DeployTask 10
Placeholder scan: No TBD or TODO present. All code blocks show exact content. Type consistency: docsUrl string property used consistently in cards and header render. helpUrl string property used consistently across useNavItems and AppLayout. Superadmin check: Release notes (Task 8) contain no mention of superadmin. Docs (Tasks 1–4) address admin/doctor/receptionist only.