# Frontend Map

## Direct answer

The current repository has 14 main browser surfaces: 10 backoffice pages, 2 customer portal pages, and 2 public marketing pages. Browser pages are static HTML/CSS/JavaScript; authenticated pages call the PHP API. The existing map says 13 pages and includes conceptual `customer-login.html` and `register.html` entries that do not exist as separate files: **MAP/CODE CONFLICT**. Login and registration are both handled by `customer/index.html`.

| Page | Route / file | Purpose | API used | DB entity | Main actions | Navigation |
|---|---|---|---|---|---|---|
| Staff Login | `backoffice/login.html` | Authenticate staff | POST staff login | employees, roles, auth failures | sign in | success → dashboard |
| Dashboard | `backoffice/dashboard.html` | KPI/financial overview and follow-up summary | GET dashboard summary; GET follow-ups/today | contracts, payments, schedules, cash sales, follow-ups | filter period, inspect metrics/queue | backoffice menu |
| Customers | `backoffice/customers.html` | Customer registry, service summaries, KYC entry, credential reset | customer list/create/delete/reset | customers and profile/service tables | create, view, delete eligible record, reset password | contracts/savings context |
| Contracts & Savings | `backoffice/contracts.html` | Savings-account creation/list, contract lifecycle, schedules, payment verification | contracts, savings, products, promotions, intents | savings/accounts/transactions; contracts/schedules/payments | create savings/contract, activate, update, verify, cancel, quote/payoff intent | main backoffice workflow |
| Cash Sales | `backoffice/cash-sales.html` | Cash-sale capture and lifecycle | customers, products, promotions, events, cash sales | cash_sales, refunds, promotion tables | create, print, void, refund | backoffice menu |
| Products | `backoffice/products.html` | Product/variant catalogue | GET/POST products | products | list/create | backoffice menu |
| Promotions | `backoffice/promotions.html` | Campaign, package, benefit and event management | promotions/events/package routes | promotion tables | create campaign/package/benefit, toggle | backoffice menu |
| Employees | `backoffice/employees.html` | Staff and access management | GET/POST employees; PATCH toggle | employees, roles | create, enable/disable | admin menu |
| Follow-ups | `backoffice/follow-ups.html` | Collections and satisfaction queue | follow-ups today/satisfaction/create | follow_up_logs, customers, contracts, schedules | open queue, record result | backoffice menu |
| Schema Explorer | `backoffice/db-schema-explorer.html` | Internal schema ledger/developer reference | no current API caller | documented schema | search/browse schema | developer utility |
| Customer Entry | `customer/index.html` | Customer login and self-registration | customer login/register/change-password | customers, auth metadata | register, login, mandatory password change | success → customer dashboard |
| Customer Dashboard | `customer/customer-dashboard.html` | Customer profile, savings progress, contract schedule, payment submission, promotions, pause request | customer detail, contracts/schedules/quote/intents, slip upload, promotion events, payment pause | customers, savings, contracts, schedules, intents, follow-ups | view plan, claim event, upload slip, pay, request pause | tabbed portal |
| Public Site | `index/index.html` | Public TOP TECH marketing site | none found | none | browse content | public |
| Sales Landing Page | `landingpage/index.html` | Product/sales campaign landing page | none found | none | browse CTA/content | public |

## Shared frontend infrastructure

- `backoffice/js/backoffice.js` resolves the API base, adds authentication, normalizes responses, and handles unauthorized sessions.
- `backoffice/js/auth-guard.js` protects backoffice pages at the client-navigation layer; the API remains the enforcement boundary.
- `customer/js/portal.js` handles customer entry/change-password/profile editing.
- `customer/js/customer-dashboard.js` loads customer, contract, promotion, payment, upload, and support workflows.

## Caller gaps

The active API has no direct current frontend caller found for savings detail, savings verification, or savings conversion. It also exposes alias routes/methods for promotion package and benefit updates that are not called by current pages. These are documented as active backend capabilities, not invented UI flows.