Compare commits
39 Commits
1791dd7319
...
f1ed2a5f87
| Author | SHA1 | Date | |
|---|---|---|---|
|
f1ed2a5f87 | ||
|
|
4036c16f39 | ||
|
|
5f9bbb97bd | ||
|
|
4911083d0f | ||
|
|
3a7fef59b0 | ||
|
|
c081334020 | ||
|
|
2d1b50745a | ||
|
|
40ae860a88 | ||
|
|
c7ca7c1f96 | ||
|
|
22b019a27e | ||
|
|
a3424b80d5 | ||
|
|
5bcdfefde3 | ||
|
|
22f944fde2 | ||
|
|
cda44e721b | ||
|
|
0406778c44 | ||
|
|
259cd7b8bb | ||
|
|
e42b8fde84 | ||
|
|
f354f4adab | ||
|
|
38cd36a616 | ||
|
|
77b6ef5026 | ||
|
|
978df1c4d7 | ||
|
|
df0b408b7a | ||
|
|
1151768159 | ||
|
|
9e69c13202 | ||
|
|
6212c118e5 | ||
|
|
6795db9aa8 | ||
|
|
d8f0cdd7d2 | ||
|
|
2dc53842c0 | ||
|
|
aa15807063 | ||
|
|
2a3fae4d6a | ||
|
|
da7262f18f | ||
|
|
398d6322f1 | ||
|
|
deafc5ef38 | ||
|
|
9b87b14c99 | ||
|
|
da44e8ecbe | ||
|
|
af2db06244 | ||
|
|
0eff6050ae | ||
|
|
d8ac62f6f4 | ||
|
|
dd138547fb |
@@ -0,0 +1,171 @@
|
||||
# Country / Phone / Timezone — i18n form polish
|
||||
|
||||
**Status:** Agenda — awaiting prioritization (likely Phase B or B.5)
|
||||
**Date:** 2026-04-28
|
||||
**Phase:** Cross-cutting; touches every form that captures contact data
|
||||
|
||||
## Why
|
||||
|
||||
Today every CRM form takes free-text strings for nationality, phone, and timezone. That's fine for a marina with one operator typing it in once, but it leaks operator inconsistencies into reports and breaks any later system that consumes these fields (Documenso prefill, public website inquiry, portal sync, exports). For a multi-port platform that's about to onboard non-Polish-speaking residential clients, the data quality matters.
|
||||
|
||||
Three coupled UX upgrades:
|
||||
|
||||
1. **Nationality → ISO-3166 country dropdown.** Searchable. Stores ISO alpha-2 code (`'GB'`), displays localized country name.
|
||||
2. **Phone → country-code dropdown + format-as-you-type.** E.164 storage on the wire, formatted display per country.
|
||||
3. **Timezone → autofilled from country with override dropdown.** Most countries are single-zone; the few that aren't (US, RU, AU, BR, CA, ID, KZ, MN, MX, CD) get a sub-select. Stores IANA TZ string (`'Europe/Warsaw'`).
|
||||
|
||||
## Scope
|
||||
|
||||
### In scope
|
||||
|
||||
- New shared primitives: `<CountryCombobox>`, `<PhoneInput>`, `<TimezoneCombobox>`
|
||||
- ISO-3166 country list bundled (no API call); names from `Intl.DisplayNames` with locale fallback to English
|
||||
- Country → primary IANA timezone map (~250 entries, JSON)
|
||||
- Phone parsing/validation/formatting via `libphonenumber-js` (server + client)
|
||||
- Wire into every form that captures contact data:
|
||||
- `<ClientForm>` (name, nationality, phone)
|
||||
- `<ResidentialClientDetail>` inline editor (nationality, phone, place_of_residence — country-aware)
|
||||
- `<CompanyForm>` (incorporation_country)
|
||||
- `<PortalActivateForm>` (phone)
|
||||
- public inquiry form (form-template renderer, when phone field present)
|
||||
- DB migration: store ISO codes (`countries`, `nationality_iso`), E.164 phone (`phone_e164`), IANA timezone (`timezone`)
|
||||
- Backfill: best-effort parse existing free-text into the new columns; keep originals as `_legacy` for one release cycle
|
||||
- Display: localized country name in tables/detail pages; phone formatted per country (e.g. `+44 20 7946 0958`); timezone shown as friendly `'London (UTC+1)'` when current
|
||||
- Tests: unit (parser edge cases), integration (form submit → E.164 storage), smoke (typing + selecting flows)
|
||||
|
||||
### Out of scope (deferred)
|
||||
|
||||
- Multilingual UI surface (only the country _names_ localize via `Intl.DisplayNames`; rest of the UI stays English for now)
|
||||
- Subdivision picker (states/provinces) — only top-level country
|
||||
- Phone number geocoding / carrier lookup
|
||||
- Address autocomplete (Google Places, etc.)
|
||||
- Currency localization
|
||||
- RTL layout
|
||||
|
||||
## Library choices
|
||||
|
||||
| Concern | Library | Why |
|
||||
| --------------------------- | -------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| Phone input + flag dropdown | `omeralpi/shadcn-phone-input` | Built on shadcn-ui's `Input` primitive (zero styling friction with our component library), wraps `libphonenumber-js`, ships with country dropdown + format-as-you-type. Small bundle. |
|
||||
| Phone parsing/validation | `libphonenumber-js` | Google's library, ~88 benchmark, used by every popular React phone input. Server-side validation in zod. |
|
||||
| Country list | Bundled JSON of ISO-3166 alpha-2 codes + 3-letter codes + display names (English baseline) | No need for the heavier `country-state-city` databases — we don't need cities or states yet. |
|
||||
| Country → timezone | Hand-curated `country-timezones.json` (250 entries, ~10kb) sourced from `country-tz` or moment-timezone's data | Static, no network call. For multi-zone countries, expose a sub-select. |
|
||||
| Timezone formatting | `Intl.DateTimeFormat` (built-in) | Browser API; renders `'Europe/Warsaw (UTC+1)'`-style labels. |
|
||||
| Timezone list | `Intl.supportedValuesOf('timeZone')` (built-in, ~600 entries) | Used as the override dropdown when a user wants a non-primary zone. |
|
||||
|
||||
Bundle impact: `libphonenumber-js` mobile build is ~80 KB gz; `shadcn-phone-input` is ~5 KB; country/timezone JSONs ~30 KB. All client-side, lazy-loaded on first form render via `next/dynamic`.
|
||||
|
||||
## Schema deltas
|
||||
|
||||
```sql
|
||||
-- clients
|
||||
ALTER TABLE clients ADD COLUMN nationality_iso text; -- 'GB'
|
||||
ALTER TABLE clients ADD COLUMN timezone text; -- 'Europe/London'
|
||||
-- existing 'nationality' free-text column stays for a release; new code reads ISO
|
||||
|
||||
-- client_contacts (or wherever phone lives)
|
||||
ALTER TABLE client_contacts ADD COLUMN value_e164 text; -- '+442079460958'
|
||||
ALTER TABLE client_contacts ADD COLUMN value_country text; -- 'GB' (where the number was parsed against)
|
||||
-- existing 'value' stays as the human-displayable formatted form
|
||||
|
||||
-- residential_clients — same pattern
|
||||
ALTER TABLE residential_clients ADD COLUMN nationality_iso text;
|
||||
ALTER TABLE residential_clients ADD COLUMN timezone text;
|
||||
ALTER TABLE residential_clients ADD COLUMN phone_e164 text;
|
||||
ALTER TABLE residential_clients ADD COLUMN phone_country text;
|
||||
|
||||
-- companies
|
||||
ALTER TABLE companies ADD COLUMN incorporation_country_iso text;
|
||||
```
|
||||
|
||||
Indexes: `idx_clients_nationality_iso`, `idx_clients_timezone` (cheap; powers analytics filters later).
|
||||
|
||||
## Component primitives
|
||||
|
||||
```tsx
|
||||
<CountryCombobox
|
||||
value={iso} // 'GB' | undefined
|
||||
onChange={(iso) => …}
|
||||
locale="en" // for name lookup; default to navigator.language
|
||||
variant="default" | "compact" // compact = icon-only flag, default = name
|
||||
/>
|
||||
|
||||
<PhoneInput
|
||||
value={e164} // '+442079460958'
|
||||
onChange={({ e164, country }) => …}
|
||||
defaultCountry={'GB'} // pre-selects the dropdown
|
||||
required={false}
|
||||
/>
|
||||
|
||||
<TimezoneCombobox
|
||||
value={iana} // 'Europe/London'
|
||||
onChange={(iana) => …}
|
||||
countryHint={'GB'} // when set, narrows the dropdown to matching zones first
|
||||
/>
|
||||
```
|
||||
|
||||
All three are shadcn-styled, keyboard-accessible, support form integration with react-hook-form + zod.
|
||||
|
||||
## Validators
|
||||
|
||||
```ts
|
||||
// src/lib/validators/contact.ts
|
||||
import { isValidPhoneNumber } from 'libphonenumber-js';
|
||||
|
||||
export const phoneE164Schema = z
|
||||
.string()
|
||||
.refine((v) => isValidPhoneNumber(v), 'Invalid phone number');
|
||||
|
||||
export const isoCountrySchema = z
|
||||
.string()
|
||||
.length(2)
|
||||
.toUpperCase()
|
||||
.refine((c) => ISO_COUNTRIES.has(c), 'Unknown country');
|
||||
|
||||
export const ianaTimezoneSchema = z
|
||||
.string()
|
||||
.refine((tz) => Intl.supportedValuesOf('timeZone').includes(tz), 'Unknown timezone');
|
||||
```
|
||||
|
||||
## Backfill plan
|
||||
|
||||
A migration script (`scripts/backfill-iso-and-e164.ts`) that:
|
||||
|
||||
1. For each client/residential_client, attempt `libphonenumber-js` `parsePhoneNumber(rawPhone, { defaultCountry: 'PL' })` → if valid, write `phone_e164` + `phone_country`.
|
||||
2. For each free-text `nationality`, fuzzy-match against the country name list (exact match first, then Levenshtein ≤2). Write `nationality_iso` if confident.
|
||||
3. For each timezone, exact-match against IANA list. Otherwise leave null and let user fill it.
|
||||
4. Log unparseable rows to `backfill-iso-report.csv` for manual review.
|
||||
|
||||
Run on staging first; require dry-run flag.
|
||||
|
||||
## Build sequence
|
||||
|
||||
| # | PR | Effort | Depends on |
|
||||
| --- | ------------------------------------------------------------ | ------ | ---------- |
|
||||
| 1 | Country list JSON + ISO sets + `<CountryCombobox>` primitive | 0.5d | — |
|
||||
| 2 | `libphonenumber-js` integration + `<PhoneInput>` primitive | 1d | — |
|
||||
| 3 | Country → timezone JSON + `<TimezoneCombobox>` primitive | 0.5d | 1 |
|
||||
| 4 | Schema deltas + drizzle migrations + zod validators | 0.5d | — |
|
||||
| 5 | Wire into ClientForm + ClientDetail inline editors | 1d | 1, 2, 3, 4 |
|
||||
| 6 | Wire into ResidentialClientDetail | 0.5d | 5 |
|
||||
| 7 | Wire into CompanyForm | 0.5d | 1 |
|
||||
| 8 | Public inquiry form template renderer support | 0.5d | 2 |
|
||||
| 9 | Backfill script + dry-run runbook | 1d | 4 |
|
||||
| 10 | Smoke + integration tests | 1d | 5–9 |
|
||||
|
||||
Total: ~7 dev days. Self-contained; no external dependencies on Phase B (analytics/alerts).
|
||||
|
||||
## Risk register
|
||||
|
||||
| Risk | Mitigation |
|
||||
| --------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------- |
|
||||
| Bundle bloat from libphonenumber data | Use the `mobile` metadata build, lazy-import via `next/dynamic` |
|
||||
| Existing free-text data is too messy to backfill | Keep the legacy column for one release; expose a "needs review" badge in admin |
|
||||
| Multi-zone country UX confusion | Sub-select only appears when country is multi-zone; otherwise zone is hidden behind "Override" |
|
||||
| Public inquiry form breaks if phone is required and user can't find their country | Default to PL, search by country name and dial code |
|
||||
|
||||
## Open questions for the user
|
||||
|
||||
- Which port's locale should drive the _default_ country in `<PhoneInput>` (Poland for now, or detect from browser)?
|
||||
- Should existing free-text `nationality` field be removed once backfilled, or kept indefinitely as a fallback?
|
||||
- Is there an appetite for adding the same treatment to subdivision (state/region/voivodship) selectors, or strictly country-level for now?
|
||||
775
docs/superpowers/specs/2026-04-28-documents-hub-design.md
Normal file
775
docs/superpowers/specs/2026-04-28-documents-hub-design.md
Normal file
@@ -0,0 +1,775 @@
|
||||
# Documents Hub, Reservation Agreements, and Visual Polish (Phase A)
|
||||
|
||||
**Status:** Draft — awaiting final review
|
||||
**Date:** 2026-04-28
|
||||
**Phase:** A of D (B = Insights & Alerts; C = Website integration; D = Pre-prod ops)
|
||||
|
||||
## Overview
|
||||
|
||||
Phase A delivers a unified Documents Hub that tracks every signature-based document (EOI, Reservation Agreements, NDAs, ad-hoc uploads), generalises the existing single-purpose EOI dialog into a multi-format create-document wizard, builds the missing CRM-side reservation detail page with an end-to-end agreement workflow, polishes the reminder framework so non-EOI docs auto-remind correctly, and applies a system-wide visual upgrade to the polished-SaaS aesthetic the project already has tokens for.
|
||||
|
||||
The project already ships a usable CRM with auth, multi-tenancy, full client/yacht/company/interest/berth/reservation data model, an EOI dual-path (Documenso template + in-app PDF), socket-driven real-time updates, and 130 smoke specs. What's missing for the next release: a single place to see what documents need signing and chase the people who haven't signed.
|
||||
|
||||
## Scope boundaries
|
||||
|
||||
### In scope (this spec)
|
||||
|
||||
- New `/[port]/documents` hub page replacing the existing list
|
||||
- New `/[port]/documents/[id]` document detail page
|
||||
- Generalised create-document wizard supporting four template formats (HTML, PDF AcroForm fillable, PDF overlay-positioned, Documenso-rendered) plus ad-hoc PDF upload
|
||||
- New `/[port]/berth-reservations/[id]` reservation detail page with agreement-generation flow
|
||||
- Reservation Agreement as a first-class document type with default template seeded
|
||||
- Email composer extended with attachments and a System-vs-User From selector (admin-gated)
|
||||
- Reminder framework: per-template cadence, per-doc override, per-doc disable, per-signer manual reminders
|
||||
- Documenso version-aware abstraction layer covering field placement and document voiding across v1.13.1 and v2.x
|
||||
- System-wide visual polish: shadow scale, gradient layer, animation tokens, primitive components (`<StatusPill>`, `<KPITile>`, `<EmptyState>`, polished `<PageHeader>`), applied across all list and detail pages
|
||||
- Mobile-responsive sweep across every page touched
|
||||
- Comprehensive test coverage: unit, integration, smoke, exhaustive click-through, real-API round-trips, visual baseline regeneration
|
||||
|
||||
### Explicitly out of scope (deferred to later phases)
|
||||
|
||||
- Analytics dashboard, alert framework, interests-by-berth view, expense duplicate detection (Phase B)
|
||||
- Website-side integration: `/api/form/[token]/data` prefill endpoint, `/api/webhook/document-signed` callback receiver, public-endpoint shape compat (Phase C)
|
||||
- NocoDB to Postgres data migration, email deliverability (DKIM/SPF/DMARC), Sentry error reporting, audit log retention, performance baseline at 5k clients / 50k interests, backup/restore automation, production deploy readiness (Phase D)
|
||||
- Native in-CRM PDF field-placement editor (deferred until upload-path pain emerges; Phase A v1 ships with auto-placed footer signature fields and a "Customize fields in Documenso" link)
|
||||
- Word `.docx` template upload (deferred; PDF prioritized because Word adds LibreOffice/CloudConvert toolchain dependency without saving the field-placement step)
|
||||
- Per-interest "silence all reminders" toggle (was implicit in old `interests.reminderEnabled` gating which this spec drops; can be re-added as a bulk action if anyone misses it)
|
||||
|
||||
## Information architecture
|
||||
|
||||
### URL surface
|
||||
|
||||
```
|
||||
/[port]/documents hub (replaces existing list)
|
||||
/[port]/documents/[id] document detail (new)
|
||||
/[port]/documents/new create-document wizard (new)
|
||||
/[port]/berth-reservations/[id] reservation detail (new)
|
||||
/[port]/admin/templates existing; extended for new template formats
|
||||
/[port]/admin/email existing; one new toggle
|
||||
```
|
||||
|
||||
### Schema deltas
|
||||
|
||||
```
|
||||
documents — additions:
|
||||
+ reservation_id text null references berth_reservations(id)
|
||||
+ reminders_disabled boolean default false
|
||||
+ reminder_cadence_override int null
|
||||
|
||||
document_templates — additions:
|
||||
+ reminder_cadence_days int null (null = no auto-reminders)
|
||||
+ template_format text default 'html' ('html'|'pdf_form'|'pdf_overlay'|'documenso_render')
|
||||
+ source_file_id text null references files(id)
|
||||
+ documenso_template_id text null
|
||||
+ field_mapping jsonb default '{}' (pdf_form: { acroFieldName: mergeToken })
|
||||
+ overlay_positions jsonb default '[]' (pdf_overlay: [{token, page, x, y, fontSize}])
|
||||
|
||||
document_templates.body_html — relax to nullable (only required when template_format='html')
|
||||
|
||||
document_watchers — new table:
|
||||
document_id text not null references documents(id) on delete cascade
|
||||
user_id text not null references users(id)
|
||||
added_by text not null references users(id)
|
||||
added_at timestamptz default now()
|
||||
primary key (document_id, user_id)
|
||||
|
||||
documents indexes — additions:
|
||||
+ idx_docs_reservation on (reservation_id)
|
||||
+ idx_docs_status_port on (port_id, status) — powers tab counts cheaply
|
||||
|
||||
document_watchers indexes:
|
||||
+ idx_doc_watchers_doc on (document_id)
|
||||
+ idx_doc_watchers_user on (user_id)
|
||||
|
||||
documents.documentType enum — already includes 'reservation_agreement'; no migration needed
|
||||
documents.status enum — already accepts 'expired'; no migration needed
|
||||
documentSigners.status enum — pending|signed|declined; no migration needed
|
||||
```
|
||||
|
||||
Backfill (one statement, safe to run in same migration):
|
||||
|
||||
```sql
|
||||
UPDATE document_templates SET reminder_cadence_days = 1 WHERE template_type = 'eoi';
|
||||
```
|
||||
|
||||
This preserves the existing 1-day-effective reminder cadence for existing EOI templates. Admins can edit per-template later.
|
||||
|
||||
After running migration on a dev/staging server, restart `next dev` to flush postgres.js prepared-statement cache (existing project convention).
|
||||
|
||||
### Polymorphic ownership pattern
|
||||
|
||||
Documents already use the multi-FK pattern (`interest_id`, `client_id`, `yacht_id`, `company_id` as separate nullable columns). Adding `reservation_id` matches this. No conversion to polymorphic discriminator columns despite yachts and invoices using that pattern; staying consistent with the existing documents shape avoids a destructive migration.
|
||||
|
||||
### Service-layer changes
|
||||
|
||||
- `documents.service.ts`:
|
||||
- `createFromWizard(portId, data, meta)` — dispatches across template/upload paths
|
||||
- `createFromUpload(portId, data, meta)` — new upload-driven path; calls Documenso `createDocument`, stores file in MinIO via `files` service, mirrors to `documents` + `documentSigners`, optionally calls `sendDocument` if `sendImmediately`
|
||||
- `cancelDocument(documentId, portId, meta)` — user-initiated cancel; calls Documenso void, updates DB status, logs event
|
||||
- `composeSignedDocEmail(documentId, portId)` — returns prefilled `{ to, cc, subject, body, attachments, defaultSenderType }` for the composer
|
||||
- `getDocumentDetail(id, portId)` — single-roundtrip aggregator returning doc + signers + events + watchers + linked-entity summary
|
||||
|
||||
- `document-templates.ts`:
|
||||
- `generateAndSign` extended for new `template_format` values
|
||||
- `fillAcroForm(sourceFile, fieldMapping, mergeContext)` — pdf-lib AcroForm fill
|
||||
- `drawOverlay(sourceFile, overlayPositions, mergeContext)` — pdf-lib text-draw at positions
|
||||
- Documenso-render path uses existing `generateDocumentFromTemplate`
|
||||
|
||||
- `documenso-client.ts`:
|
||||
- `placeFields(docId, fields, portId?)` — version-aware bulk field placement
|
||||
- `placeDefaultSignatureFields(docId, recipientIds, portId?)` — auto-position one SIGNATURE per recipient at footer
|
||||
- `voidDocument(docId, portId?)` — version-aware doc void/delete
|
||||
- Coordinate normalization helpers (caller passes percent 0-100; converted to pixels for v1 using cached page dimensions)
|
||||
|
||||
- `document-reminders.ts`:
|
||||
- `sendReminderIfAllowed(documentId, portId, options?)` — extended signature with optional `signerId` and `auto: boolean`
|
||||
- `processReminderQueue(portId)` — query rewritten around `documents.reminder_cadence_override ?? template.reminder_cadence_days`; drops `interests.reminderEnabled` gating
|
||||
|
||||
- `notifications.service.ts`:
|
||||
- `notifyDocumentEvent(docId, eventType)` — fans out to creator + entity-assignee + watchers; existing socket events keep firing
|
||||
|
||||
- New: `reservation-agreement-context.ts`:
|
||||
- `buildReservationAgreementContext(reservationId, portId)` — joins reservation -> client + yacht + berth -> port; returns context shape for template merge
|
||||
|
||||
- `email-compose.service.ts`:
|
||||
- Validator extended: `{ senderType: 'system'|'user', accountId? (when user), attachments[] }`
|
||||
- System path: calls `lib/email/index.ts → sendEmail()` with `portId` + attachments; logs `documentEvents` row `signed_doc_emailed`; skips `email_messages`/`email_threads` writes
|
||||
- User path: existing flow, with attachments resolution from `files` table
|
||||
- Port-isolation: cross-port `fileId` returns 403
|
||||
|
||||
- `lib/email/index.ts`:
|
||||
- `SendEmailOptions.attachments?: Array<{ fileId, filename? }>` — fetches files from MinIO, passes to nodemailer
|
||||
|
||||
## Documents hub page
|
||||
|
||||
Replaces existing `/[port]/documents` list.
|
||||
|
||||
### Layout
|
||||
|
||||
```
|
||||
[ Header strip: title, KPI sub-line, "+ New document" button ]
|
||||
|
||||
[ Tabs: All | Awaiting them (count) | Awaiting me (count) | Completed | Expired ]
|
||||
|
||||
[ Search · Type · Status · Sent · Watcher filter chips · saved-view selector · overflow ]
|
||||
|
||||
[ Table:
|
||||
checkbox | Document | Type pill | Subject pill | Status (X/Y signed + dot) | Sent
|
||||
▾ expand row inline to show signers + watchers strip
|
||||
]
|
||||
|
||||
[ Sticky bulk-action bar appears when ≥1 row checked:
|
||||
"N selected" | Remind unsigned | Cancel | Export | pagination
|
||||
]
|
||||
```
|
||||
|
||||
### Tab queries
|
||||
|
||||
- All — every document in port
|
||||
- Awaiting them — `status IN ('sent','partially_signed')` AND has pending signer != current user
|
||||
- Awaiting me — at least one `documentSigners` row matching `signer_email = current user email` AND `status = 'pending'`
|
||||
- Completed — `status IN ('completed','signed')`
|
||||
- Expired — `status = 'expired'` OR (`status IN ('sent','partially_signed')` AND `expires_at < now()`)
|
||||
|
||||
Counts run cheap thanks to `idx_docs_status_port`.
|
||||
|
||||
### Filters and saved views
|
||||
|
||||
- Search: fuzzy match on title, subject name, signer email
|
||||
- Type: multi-select doc types
|
||||
- Status: multi-select status enum
|
||||
- Sent: date-range chips (Today, 7d, 30d, custom)
|
||||
- Watcher: filter by watching user
|
||||
- "Signature-based only" chip defaults to ON; toggle off to see non-signed docs (welcome letters etc.) as well, rendered with a "Delivered" pill
|
||||
- Saved-view integration: filter combos save to existing `saved_views` table
|
||||
|
||||
### Row anatomy
|
||||
|
||||
- Collapsed: name (links to detail), type pill (colored per type), subject pill (links to entity), status indicator (X/Y signed with progress dot), sent age
|
||||
- Expanded: per-signer rows with email, status pill, sent timestamp, signed timestamp, `[Remind]` and overflow `[...]` (resend invite, copy signing link, skip — skip is UI-only flag, not implemented in v1)
|
||||
- Watchers strip at bottom of expansion: chips + `+ Add watcher` autocomplete
|
||||
- Hover: row gets soft brand-soft gradient bg
|
||||
|
||||
### Real-time
|
||||
|
||||
Subscribes to existing `documents.service.ts`-emitted socket events: `document:created`, `document:updated`, `document:deleted`, `document:sent`, `document:completed`, `document:expired`, `document:cancelled`, `document:rejected`, `document:signer:signed`, `document:signer:opened`. All already fire today.
|
||||
|
||||
### Empty states
|
||||
|
||||
- No docs yet: illustration + 1-line explanation + `[+ New document]` CTA
|
||||
- Filtered empty: "No docs match these filters. Clear filters?"
|
||||
|
||||
### Mobile (< 768px)
|
||||
|
||||
- Tabs collapse into `<select>`
|
||||
- Filters collapse behind `[Filters]` button into a sheet
|
||||
- Rows stack as cards: title + status + age, expand to show signers
|
||||
- "+ New document" floats as FAB bottom-right
|
||||
|
||||
## Document detail page
|
||||
|
||||
New `/[port]/documents/[id]` page. No detail page exists today.
|
||||
|
||||
### Layout
|
||||
|
||||
```
|
||||
[ Breadcrumb: All documents ]
|
||||
|
||||
[ Header strip with gradient: title (editable inline), type pill, status pill, subtitle (subject link, creator, age) ]
|
||||
|
||||
[ Action bar — context-aware ]
|
||||
|
||||
[ Two-column body:
|
||||
Left (2fr):
|
||||
Signers panel (vertical list, replaces existing horizontal SigningProgress)
|
||||
Linked entity card
|
||||
Right (1fr):
|
||||
Watchers panel (chips + add)
|
||||
Activity timeline (from documentEvents)
|
||||
Notes (auto-saving editable text)
|
||||
Preview (PDF; tabbed Original/Signed when completed)
|
||||
]
|
||||
```
|
||||
|
||||
### Action bar by status
|
||||
|
||||
- `draft` — `[Send for signing]` `[Edit signers]` `[Delete]`
|
||||
- `sent | partially_signed` — `[Send reminder to all]` `[Resend invite]` `[Cancel]`
|
||||
- `completed` — `[Download signed PDF]` `[Email signed PDF to all signatories]`
|
||||
- `cancelled | rejected | expired` — `[Duplicate]`
|
||||
- Always `[...]` overflow: Duplicate, Move to other entity, View Documenso URL, Audit log
|
||||
|
||||
### Signers panel (vertical, replaces horizontal stepper)
|
||||
|
||||
Per-row:
|
||||
|
||||
- Numbered status circle (pending grey, signed green, declined red)
|
||||
- Name, email, role
|
||||
- Sent age, last-reminded age, signed timestamp
|
||||
- `[Remind]` button — disabled with countdown if cooldown active (24h-or-cadence) for auto mode; bypassed in manual mode
|
||||
- `[Copy signing link]` — copies `signingUrl` (hosted Documenso); overflow offers "Copy embed link" if `embeddedUrl` present (used by website embed at `/sign/[type]/[token]`)
|
||||
- `[...]` overflow: Resend invite, View signing history, Replace email (draft only)
|
||||
- Sequential mode: only current pending signer's `[Remind]` active; others greyed with tooltip
|
||||
|
||||
### Send-signed-PDF email flow
|
||||
|
||||
Action visible only when `status='completed' AND signedFileId IS NOT NULL`.
|
||||
|
||||
Click opens email composer drawer prefilled:
|
||||
|
||||
- From: dropdown defaulting to System (port-config noreply identity); Personal accounts available only when port admin enables `email.allowPersonalAccountSends`
|
||||
- To: union of `documentSigners.signerEmail` for the doc
|
||||
- Cc: empty; "Cc watchers" toggle adds users from `document_watchers`
|
||||
- Subject: `"Signed {document type} — {document title}"`
|
||||
- Body: from `signed_doc_completion` per-port template (new template type; default seeded for new ports)
|
||||
- Attachments: signed PDF auto-attached from `documents.signedFileId` (chip with filename + size; removable)
|
||||
|
||||
Send dispatch:
|
||||
|
||||
- System path: `lib/email/index.ts → sendEmail()` with portId + attachments; writes `documentEvents` row; skips email_messages/threads writes (no IMAP sync expected)
|
||||
- User path: `email-compose.service.ts` existing flow; writes email_messages + thread; subject to `allowPersonalAccountSends` gate (server-side enforces 403 on user senderType when toggle off)
|
||||
|
||||
### Backend additions
|
||||
|
||||
- `POST /api/v1/documents/[id]/cancel` — calls `cancelDocument` service; service calls Documenso void via new client function
|
||||
- `POST /api/v1/documents/[id]/remind` — accepts optional `{ signerId }`; passes `auto: false` to service
|
||||
- `GET /api/v1/documents/[id]/watchers` — list
|
||||
- `POST /api/v1/documents/[id]/watchers` — add `{ userId }`
|
||||
- `DELETE /api/v1/documents/[id]/watchers/[userId]` — remove
|
||||
- `POST /api/v1/documents/[id]/compose-completion-email` — returns prefilled draft
|
||||
|
||||
## Create-document wizard
|
||||
|
||||
Replaces `<EoiGenerateDialog>`. Single drawer/dialog, three steps.
|
||||
|
||||
### Step 1 — Type and source
|
||||
|
||||
```
|
||||
Render: ● Generate the PDF here (using template format below)
|
||||
○ Use a Documenso-stored template (Documenso renders + signs)
|
||||
|
||||
Format (when "Generate the PDF here" selected):
|
||||
● HTML (write inline)
|
||||
○ PDF (AcroForm fillable upload)
|
||||
○ PDF (overlay positioning)
|
||||
|
||||
Template: [ pick from port's templates of selected format ]
|
||||
OR
|
||||
Upload PDF: [ drop or pick file; preview renders inline ]
|
||||
|
||||
Document type: [ auto-derived from template, or picked from DOCUMENT_TYPES enum ]
|
||||
```
|
||||
|
||||
Signing destination is always Documenso. The "Render in CRM" vs "Render in Documenso" axis is about PDF generation only.
|
||||
|
||||
### Step 2 — Recipients
|
||||
|
||||
```
|
||||
Attached to: [ Interest #142 — Smith family Change ]
|
||||
↑ pre-filled if launched from a detail page
|
||||
|
||||
Signers: (hidden for documenso-render path; signers embedded in template)
|
||||
① name email role [✕]
|
||||
② name email role [✕]
|
||||
[+ Add signer] (autocomplete from clients/companies/users; or manual entry)
|
||||
Drag to reorder; signing-order assigned by row position
|
||||
|
||||
Signing mode: ● Sequential ○ Parallel
|
||||
|
||||
Watchers (optional): [chips] [+ Add watcher] (CRM users)
|
||||
|
||||
Reminder cadence:
|
||||
● Use template default (every 7 days)
|
||||
○ Override: [_____] days
|
||||
○ Disable for this document
|
||||
|
||||
[ For upload path only ]
|
||||
☑ Auto-place signature fields at footer (default; refine later in Documenso)
|
||||
```
|
||||
|
||||
### Step 3 — Review and send
|
||||
|
||||
```
|
||||
Title: [ EOI — Smith family ____________ ] (editable; default rendered from merge tokens)
|
||||
Notes (internal): [_____________]
|
||||
Preview: [ rendered PDF inline · 4 pages · scrollable ]
|
||||
Signing-order banner (multi-signer in-app/upload only): "Sequential — Carol must sign before Bob" [Switch to parallel]
|
||||
[← Back] [Save as draft] [Send →]
|
||||
```
|
||||
|
||||
Save as draft → status='draft'; `[Send for signing]` available later from detail page. Send → calls Documenso, status='sent', socket event fires.
|
||||
|
||||
### Documenso version-aware field placement
|
||||
|
||||
For upload path, `placeDefaultSignatureFields` auto-positions one SIGNATURE per recipient at last-page footer (staggered to avoid overlap). User can refine in Documenso via "Customize fields in Documenso" link on detail page.
|
||||
|
||||
`placeFields` and `placeDefaultSignatureFields` in `documenso-client.ts` hide v1/v2 differences:
|
||||
|
||||
- v1: `POST /api/v1/documents/{id}/fields` per field; pixel coordinates; requires page dimension lookup
|
||||
- v2: `POST /api/v2/envelope/field/create-many` bulk; percentage 0-100 coordinates; rich `fieldMeta`
|
||||
- Caller passes percentage; abstraction converts for v1 using cached page dimensions
|
||||
|
||||
### `createDocumentSchema` extension
|
||||
|
||||
```ts
|
||||
export const createDocumentSchema = z.object({
|
||||
source: z.enum(['template', 'upload']),
|
||||
templateId: z.string().uuid().optional(),
|
||||
uploadedFileId: z.string().uuid().optional(),
|
||||
|
||||
documentType: z.enum(DOCUMENT_TYPES),
|
||||
title: z.string().min(1).max(200),
|
||||
notes: z.string().optional(),
|
||||
|
||||
// Subject (exactly one required)
|
||||
interestId: z.string().uuid().optional(),
|
||||
reservationId: z.string().uuid().optional(),
|
||||
clientId: z.string().uuid().optional(),
|
||||
companyId: z.string().uuid().optional(),
|
||||
yachtId: z.string().uuid().optional(),
|
||||
|
||||
// Signers (required when render=in-app or source=upload)
|
||||
signers: z.array(z.object({
|
||||
signerName: z.string().min(1),
|
||||
signerEmail: z.string().email(),
|
||||
signerRole: z.enum(['client', 'sales', 'approver', 'developer', 'other']),
|
||||
signingOrder: z.number().int().min(1),
|
||||
})).optional(),
|
||||
signingMode: z.enum(['sequential', 'parallel']).default('sequential'),
|
||||
|
||||
pathway: z.enum(['documenso-template', 'inapp', 'upload']).optional(),
|
||||
|
||||
watchers: z.array(z.string().uuid()).optional(),
|
||||
|
||||
reminderCadenceOverride: z.number().int().min(1).max(365).nullable().optional(),
|
||||
remindersDisabled: z.boolean().default(false),
|
||||
|
||||
autoPlaceFields: z.boolean().default(true),
|
||||
|
||||
sendImmediately: z.boolean().default(true),
|
||||
}).refine(...one-subject-FK-required...);
|
||||
```
|
||||
|
||||
## Template formats
|
||||
|
||||
### Authoring paths
|
||||
|
||||
| Format | Authoring | Merge fields | Best for |
|
||||
| ---------------------------- | ------------------------------------------------------------------------------------------- | --------------------------------------------------- | ------------------------------------------------ |
|
||||
| HTML (existing) | Inline rich-text editor with merge tokens | Server-side substitution, rendered to PDF via pdfme | Welcome letters, acknowledgments, correspondence |
|
||||
| PDF (AcroForm fillable) | Admin uploads fillable PDF; UI scans AcroForm field names; admin maps each to a merge token | pdf-lib fills form at gen time | EOI, Reservation Agreement, NDA |
|
||||
| PDF (overlay positioning) | Admin uploads any PDF; UI specifies merge token positions per page+x+y+fontSize | pdf-lib draws text over PDF at positions | Quick wins where preparing AcroForm is overkill |
|
||||
| Documenso template reference | Admin enters Documenso template ID + label | None in CRM; Documenso owns it | Documenso-rendered signing flows |
|
||||
|
||||
### Generator dispatch
|
||||
|
||||
```ts
|
||||
switch (template.template_format) {
|
||||
case 'html': generatePdf(template.body_html, mergeContext);
|
||||
case 'pdf_form': fillAcroForm(template.source_file_id, template.field_mapping, mergeContext);
|
||||
case 'pdf_overlay': drawOverlay(template.source_file_id, template.overlay_positions, mergeContext);
|
||||
case 'documenso_render': documenso.generateDocumentFromTemplate(template.documenso_template_id, ...);
|
||||
}
|
||||
```
|
||||
|
||||
All four formats end at Documenso for signing — only PDF generation location differs. Non-signature templates (welcome letters etc.) skip the upload-to-Documenso step entirely; they render to PDF then get emailed.
|
||||
|
||||
### Admin template editor extension
|
||||
|
||||
Format picker added to `/admin/templates` editor:
|
||||
|
||||
- For PDF (AcroForm): file upload field, then two-column mapping UI (AcroForm field names ↔ merge tokens autocomplete from existing `MERGE_FIELDS` catalog)
|
||||
- For PDF (overlay): file upload, then per-token form with page/x/y/fontSize inputs (visual placement editor deferred)
|
||||
- For Documenso template: single text input + Test connection button calling `getDocumensoTemplate`
|
||||
- For HTML: existing inline editor unchanged
|
||||
|
||||
### Word (.docx) deferred
|
||||
|
||||
Reasons: LibreOffice headless adds significant install/memory/security surface; CloudConvert adds paid dependency and third-party data exposure; `docxtemplater` merge syntax incompatible with existing `{{token}}` convention; field placement still needs PDF flow afterwards. If marinas push back, the feasible path is `.docx → server-side conversion → PDF → existing AcroForm/overlay flow`. Not worth the engineering until requested.
|
||||
|
||||
## Reservation agreements as a doc type
|
||||
|
||||
### What differs from EOI's pattern
|
||||
|
||||
| Aspect | EOI | Reservation Agreement |
|
||||
| --------------------- | ----------------------------- | ------------------------------------------------------------------------------------------ |
|
||||
| Subject FK | `interestId` | `reservationId` |
|
||||
| Default template | Documenso EOI per port | Documenso reservation_agreement per port (seeded) |
|
||||
| Default signers | client + sales/approver | client + port admin |
|
||||
| Trigger | Manual on interest detail | Manual on reservation detail |
|
||||
| Lifecycle integration | None | Active reservations without an agreement get flagged in dashboard alert |
|
||||
| Final-PDF storage | `documents.signedFileId` only | `documents.signedFileId` AND mirrored to `berth_reservations.contractFileId` on completion |
|
||||
|
||||
### New CRM-side reservation detail page
|
||||
|
||||
`/[port]/berth-reservations/[id]` doesn't exist today (only the portal's `/portal/my-reservations`). Phase A builds it.
|
||||
|
||||
Layout:
|
||||
|
||||
```
|
||||
[ Header: "Reservation #88 · M/Y Tate" status pill subtitle: berth, client, dates, tenure ]
|
||||
[ Action bar: Activate | Generate agreement | Cancel | ... ]
|
||||
[ Two columns:
|
||||
Left: Reservation details card
|
||||
Linked interest card
|
||||
Activity timeline
|
||||
Right: Agreement card (state-dependent: no agreement / in-flight / completed)
|
||||
]
|
||||
```
|
||||
|
||||
Agreement card states:
|
||||
|
||||
- No agreement yet: warning + `[Generate agreement →]`
|
||||
- In-flight (sent/partially_signed): "X/Y signed", per-signer status, `[View document →]` `[Send reminder]` `[Cancel]`
|
||||
- Completed: "Completed YYYY-MM-DD", `[Download signed PDF]` `[Email to all signatories]`, "Signed contract attached to reservation."
|
||||
|
||||
Generate-agreement button launches the wizard with prefills:
|
||||
|
||||
- `documentType='reservation_agreement'`
|
||||
- `templateId=<port's default>`
|
||||
- `reservationId=<current>`
|
||||
- Default signers from linked client + configurable port-admin user
|
||||
- Wizard step 1 pre-validated; user lands on step 2
|
||||
|
||||
### Backend additions
|
||||
|
||||
- Merge field catalog extended in `src/lib/templates/merge-fields.ts`:
|
||||
- `{{reservation.startDate}}` `{{reservation.endDate}}` `{{reservation.tenureType}}` `{{reservation.termSummary}}` `{{reservation.signedDate}}`
|
||||
- New service `reservation-agreement-context.ts.buildReservationAgreementContext(reservationId, portId)`
|
||||
- New seeder for default `reservation_agreement` template on port creation (HTML format; admins can switch to AcroForm/overlay later); template stored at `assets/templates/reservation-agreement-default.html`
|
||||
- Webhook handler extension: `handleDocumentCompleted` detects `documentType='reservation_agreement'` and sets `berth_reservations.contractFileId = doc.signedFileId` for the linked reservation
|
||||
- Dashboard alert query: active reservations without a completed agreement (LEFT JOIN against documents filtered on type+status); rows surface as a warning card
|
||||
|
||||
### Trade-off
|
||||
|
||||
`berth_reservations.contractFileId` becomes a denormalized convenience pointer duplicated with `documents.signedFileId` for the linked reservation. Updating it on completion costs one extra UPDATE. Benefit: anyone querying reservations directly (portal "My Reservations") doesn't need to join through documents to know which file is the contract.
|
||||
|
||||
## Reminder framework polish
|
||||
|
||||
### Problems with today's logic
|
||||
|
||||
1. Eligibility gated by `interests.reminderEnabled` — reservation agreements, NDAs, ad-hoc upload docs (no interest link) never auto-remind
|
||||
2. Hardcoded 24h cooldown — effective cadence is 1 day; can't slow down for low-urgency docs
|
||||
3. Always reminds lowest-pending signer — parallel-signing docs can't nudge a specific signer
|
||||
4. No per-doc disable
|
||||
|
||||
### New eligibility logic
|
||||
|
||||
```
|
||||
function isReminderDue(doc, template, lastReminderAt) {
|
||||
if (!['sent','partially_signed'].includes(doc.status)) return false;
|
||||
if (doc.documenso_id == null) return false;
|
||||
if (doc.reminders_disabled) return false;
|
||||
|
||||
const effectiveCadence = doc.reminder_cadence_override ?? template.reminder_cadence_days;
|
||||
if (effectiveCadence === null) return false;
|
||||
|
||||
if (lastReminderAt == null) return true;
|
||||
return (now - lastReminderAt) >= effectiveCadence * 24h;
|
||||
}
|
||||
```
|
||||
|
||||
`processReminderQueue` query rewritten:
|
||||
|
||||
```sql
|
||||
SELECT d.* FROM documents d
|
||||
LEFT JOIN document_templates t ON t.id = d.template_id
|
||||
WHERE d.port_id = $1
|
||||
AND d.status IN ('sent','partially_signed')
|
||||
AND d.documenso_id IS NOT NULL
|
||||
AND d.reminders_disabled = false
|
||||
AND COALESCE(d.reminder_cadence_override, t.reminder_cadence_days) IS NOT NULL;
|
||||
```
|
||||
|
||||
`interests.reminderEnabled` is dropped from the gating logic but the column stays for now (no migration). Future cleanup PR can drop the column.
|
||||
|
||||
### `sendReminderIfAllowed` extended signature
|
||||
|
||||
```ts
|
||||
export async function sendReminderIfAllowed(
|
||||
documentId: string,
|
||||
portId: string,
|
||||
options: {
|
||||
auto?: boolean; // true = cron; false (default) = manual
|
||||
signerId?: string; // optional — target a specific pending signer
|
||||
} = {},
|
||||
): Promise<{ sent: boolean; reason?: string; signerId?: string }>;
|
||||
```
|
||||
|
||||
Behaviour matrix:
|
||||
|
||||
| Mode | 9-16 window | Cadence cooldown | Manual cooldown |
|
||||
| ----------- | ----------- | ---------------- | ------------------------ |
|
||||
| auto: true | enforced | enforced | n/a |
|
||||
| auto: false | bypassed | bypassed | 30s client-side debounce |
|
||||
|
||||
Per-signer logic:
|
||||
|
||||
- If `signerId` provided in sequential-mode doc, signer must be the lowest-pending signer (otherwise reason='Signer is not next in sequence')
|
||||
- In parallel-mode doc, any pending signer can be reminded independently
|
||||
- Returns `{ sent, reason }` so caller can show toast on skip
|
||||
|
||||
### Admin and per-doc UI
|
||||
|
||||
Admin `/admin/templates` editor:
|
||||
|
||||
```
|
||||
Auto-reminders for this template:
|
||||
☑ Enabled Cadence: every [_____] days (1-365; default 7)
|
||||
☐ Disabled (manual reminders only)
|
||||
```
|
||||
|
||||
Doc detail page (Section 3) "Reminders" panel under signers, with edit drawer for per-doc override.
|
||||
|
||||
## Visual polish system
|
||||
|
||||
### Token additions
|
||||
|
||||
```
|
||||
--radius-sm: 0.375rem (existing)
|
||||
--radius-md: 0.5rem (NEW — default cards)
|
||||
--radius-lg: 0.625rem (NEW — sheets, dialogs)
|
||||
--radius-xl: 0.875rem (NEW — KPI tiles, hero strips)
|
||||
|
||||
--shadow-xs: 0 1px 2px 0 rgb(15 23 42 / 0.04)
|
||||
--shadow-sm: 0 2px 4px -1px rgb(15 23 42 / 0.06)
|
||||
--shadow-md: 0 4px 12px -2px rgb(15 23 42 / 0.08)
|
||||
--shadow-lg: 0 12px 32px -8px rgb(15 23 42 / 0.12)
|
||||
--shadow-glow: 0 0 0 4px rgb(58 123 200 / 0.12)
|
||||
|
||||
--gradient-brand: linear-gradient(135deg, #3a7bc8 0%, #2f6ab5 100%)
|
||||
--gradient-brand-soft: linear-gradient(135deg, #d8e5f4 0%, #ffffff 100%)
|
||||
--gradient-success: linear-gradient(135deg, #e8f5e9 0%, #ffffff 100%)
|
||||
--gradient-warning: linear-gradient(135deg, #fef3c7 0%, #ffffff 100%)
|
||||
|
||||
--ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1)
|
||||
--ease-smooth: cubic-bezier(0.4, 0, 0.2, 1)
|
||||
--duration-fast: 150ms
|
||||
--duration-base: 200ms
|
||||
--duration-slow: 300ms
|
||||
```
|
||||
|
||||
All exposed as Tailwind utilities.
|
||||
|
||||
### Existing token foundation (already in place; not changing)
|
||||
|
||||
- Full HSL shadcn token system (primary, secondary, muted, accent, destructive, border, input, ring, popover, card)
|
||||
- Brand palette `brand` (50-700, default `#3a7bc8`)
|
||||
- Navy palette `navy` (50-600, default `#1e2844` for sidebar)
|
||||
- Maritime accents: `sage`, `mint`, `teal`, `purple` with light/default/dark variants
|
||||
- Semantic `success` / `warning` with bg+border
|
||||
- Recharts chart-1 through chart-6 token system
|
||||
- Dark mode wired
|
||||
- Sidebar tokens separate from main palette
|
||||
|
||||
### New primitive components
|
||||
|
||||
- `<StatusPill status="...">` — colored-by-state pill (pending grey, sent brand, partial teal, completed success, expired warning, rejected destructive, cancelled muted-darker, active success, archived muted)
|
||||
- `<KPITile title value delta sparkline?>` — rounded-xl, shadow-sm, gradient-brand-soft border-top accent stripe; recharts mini sparkline using `--chart-1`
|
||||
- `<EmptyState icon title body actions>` — large icon in brand-soft circle, title, body, action buttons
|
||||
- `<PageHeader>` polished — gradient-brand-soft background, eyebrow optional, KPI sub-line, primary action right-aligned
|
||||
|
||||
### Component pattern updates
|
||||
|
||||
- List rows: hover gradient (subtle brand-soft 4% opacity), shadow-xs lift, animation `transition-all duration-base ease-smooth`; row-update from socket events animates 1s fade-in highlight
|
||||
- Detail pages: two-column responsive grammar (header strip → 2fr main + 1fr side; cards stack vertical < 768px)
|
||||
- Sidebar (already dark navy): active item gets 4px brand left-edge stripe instead of bg shift; section headers smaller-caps + brand-200 text
|
||||
- Topbar: search inset shadow + brand focus ring; "+ New" trigger gets `bg-gradient-brand`; notification bell gets badge spring animation; user avatar gets shadow-sm + 2px white ring
|
||||
- Forms: focus ring uses `--shadow-glow`; primary submit buttons get `bg-gradient-brand` with hover scale-1.01; inline validation gets destructive-bg pill with caret pointing up
|
||||
|
||||
### Loading skeleton system
|
||||
|
||||
- List pages: 8 skeleton rows matching column widths with subtle pulse
|
||||
- Detail pages: header strip skeleton + 2-column section skeletons
|
||||
- Dashboard: KPI tile skeletons + chart skeletons
|
||||
- Replaces today's mix of "Loading..." text and spinners
|
||||
|
||||
### Mobile responsive (full sweep)
|
||||
|
||||
Breakpoints:
|
||||
|
||||
- < 640px (phone): single column, sticky bottom action bar, sheet overlays for filters
|
||||
- 640-1024px (tablet): single column with wider gutters, side column under main
|
||||
- ≥ 1024px (desktop): full two-column
|
||||
|
||||
Per-page rules:
|
||||
|
||||
- List tables → card stack < 768px
|
||||
- Detail page header collapses subtitle to "Show more"
|
||||
- Tabs collapse to `<select>` < 640px
|
||||
- Sidebar slides over content < 1024px
|
||||
- Primary "+ New" actions float as FAB bottom-right < 640px
|
||||
|
||||
## Test plan
|
||||
|
||||
### Unit (`tests/unit/`)
|
||||
|
||||
- `document-reminders-cadence.test.ts` — `isReminderDue` math; manual-vs-auto window/cooldown bypass
|
||||
- `documenso-place-fields.test.ts` — v1/v2 dispatch (mocked HTTP); coord normalization; default field staggering for 1/2/3/5 recipients
|
||||
- `email-attachments-resolver.test.ts` — fileId → MinIO buffer; cross-port 403; 10 MB cap warning
|
||||
|
||||
### Integration (`tests/integration/`)
|
||||
|
||||
- Extend `document-templates-generate-and-sign.test.ts` — new template formats (`pdf_form`, `pdf_overlay`, `documenso_render`); upload-path test
|
||||
- New `document-watchers.test.ts` — add/remove endpoints; notification fan-out; port isolation
|
||||
- New `document-cancel.test.ts` — user-initiated cancel; mocked Documenso void; status + event log; reject 409 if completed
|
||||
- New `reservation-agreement-contract-mirror.test.ts` — `handleDocumentCompleted` mirrors `signedFileId` to `berth_reservations.contractFileId` only for `reservation_agreement` type
|
||||
- New `reminder-cron-cadence.test.ts` — seed varied templates; simulated time advance; assert correct docs reminded
|
||||
|
||||
### E2E smoke (`tests/e2e/smoke/`)
|
||||
|
||||
- Extend `04-documents.spec.ts` — hub tabs, expand row, per-signer remind with cooldown, type/status filters, saved-view round-trip, bulk-remind with per-row toast reasons
|
||||
- Extend `05-eoi-generate.spec.ts` — wizard invocation prefills (template, interest); existing flow regression
|
||||
- New `27-document-create-wizard.spec.ts` — template path full flow; upload path full flow; watcher addition; reminder-override radios produce correct DB state
|
||||
- New `28-reservation-agreements.spec.ts` — reservation detail → Generate agreement → wizard prefilled → Send → agreement section state transitions; post-completion contract attached + email button visible
|
||||
- New `29-email-attachments.spec.ts` — system path send (documentEvents row, no email_messages); user path send when toggle on (email_messages with attachment_file_ids); cross-port 403
|
||||
|
||||
### E2E exhaustive (`tests/e2e/exhaustive/`) — click-everything sweep
|
||||
|
||||
- New `10-documents-hub.spec.ts` — crawl each tab, filter dropdowns, saved-view, expand row, signer-row buttons, bulk-action bar
|
||||
- New `11-document-detail.spec.ts` — crawl in three states (draft/sent/completed); watcher add/remove; notes auto-save; preview download; "Email signed PDF" launch
|
||||
- New `12-document-create-wizard.spec.ts` — crawl each wizard step under both template and upload paths; picker dropdowns, signer add/remove, drag-handle, reminder-cadence radios
|
||||
- New `13-reservation-detail.spec.ts` — crawl in three states (pending no agreement / agreement-in-flight / agreement-completed); Activate/Cancel/Generate buttons; inline notes
|
||||
- New `14-email-composer.spec.ts` — crawl composer drawer with attachments; From dropdown; attach button; recipient chips
|
||||
- Extend exhaustive `05-eoi-generate.spec.ts` — parallel-mode + signing-order edge cases (greyed-out reminder buttons; out-of-order remind rejection)
|
||||
|
||||
### E2E real-API (`tests/e2e/realapi/`)
|
||||
|
||||
Each spec gates on env vars; clean skip if missing.
|
||||
|
||||
- Extend `documenso-real-api.spec.ts`:
|
||||
- Generate from Documenso template (real send) and assert in real Documenso
|
||||
- Generate from in-app PDF AcroForm fill, upload to real Documenso, assert
|
||||
- Generate from upload path with auto-placed signature fields, assert fields visible in Documenso
|
||||
- v1 and v2 explicit version-flag tests (via `DOCUMENSO_API_VERSION`)
|
||||
- Manually sign in real Documenso (or simulate webhook) and assert local DB updates
|
||||
- Cancel real in-flight doc, assert local + remote state
|
||||
- Send reminder via real Documenso, assert HTTP + documentEvents row
|
||||
|
||||
- New `smtp-system-send.spec.ts` — system-path send → IMAP fetch → assert subject + attachment; verify port-config from-identity; cleanup via IMAP delete
|
||||
- New `smtp-user-send.spec.ts` — user-path send (requires connected account, allowPersonalAccountSends=true) → IMAP fetch → email_messages row with attachment_file_ids
|
||||
- New `minio-file-lifecycle.spec.ts` — upload, list, preview, download (byte-equal), delete; port isolation; mime-type validation
|
||||
- New `documenso-webhook-ingress.spec.ts` — requires cloudflared tunnel; configure tunnel URL as Documenso webhook target; trigger doc completion; assert webhook fires + handler updates DB; verify timing-safe secret check rejects wrong secret with 401; verify event normalisation (uppercase enum + lowercase-dotted both accepted)
|
||||
- New `email-attachments-roundtrip.spec.ts` — compose with fileId attachment; SMTP send; IMAP fetch; assert attachment bytes match; reject cross-port fileId with 403 before SMTP touched
|
||||
|
||||
### Visual baselines (`tests/e2e/visual/`)
|
||||
|
||||
`snapshots.spec.ts-snapshots/` regenerated as polish ships per page; one PR per surface group, baselines reviewed in PR diff. New baselines added: documents hub, doc detail, create-document wizard (each step), reservation detail, email composer with attachments.
|
||||
|
||||
### Test data fixtures
|
||||
|
||||
`global-setup.ts` extended with:
|
||||
|
||||
- Seed default `reservation_agreement` template (HTML format)
|
||||
- Seed default `signed_doc_completion` template
|
||||
- Seed one in-flight EOI doc with two pending signers (for hub-tab tests)
|
||||
- Seed one `berth_reservation` with `status='active'` and no agreement (for lifecycle alert query)
|
||||
|
||||
### CI vs local runs
|
||||
|
||||
| Project | When |
|
||||
| ---------------------------------------------- | ----------------------------------------------------------------------------------------------------------- |
|
||||
| `setup` + `smoke` (~14 min) | Every PR via CI |
|
||||
| `exhaustive` (with new click-everything specs) | Every PR via CI; ~25 min budget |
|
||||
| `visual` | Every PR; baselines reviewed in PR diffs |
|
||||
| `realapi` | Locally before merging touch-points; pre-release; not on CI (avoids burning Documenso quota and SMTP costs) |
|
||||
|
||||
## Build sequence
|
||||
|
||||
| # | Title | Effort | Depends on |
|
||||
| ----- | ------------------------------------------------- | ------ | -------------- |
|
||||
| 1 | Data model + service skeletons | 1d | — |
|
||||
| 2 | Documenso v1/v2 abstraction layer | 1d | — |
|
||||
| 3 | Visual primitives + token additions | 1.5d | — |
|
||||
| 4 | Documents hub page | 2d | 1, 3 |
|
||||
| 5 | Document detail page | 2d | 1, 3 |
|
||||
| 6 | Create-document wizard + new template formats | 2.5d | 1, 2, 3 |
|
||||
| 7 | Reservation detail + agreement flow | 1.5d | 1, 6 |
|
||||
| 8 | Email composer attachments + From selector | 1d | 1, 3 |
|
||||
| 9 | Reminder framework polish | 1d | 1 |
|
||||
| 10a-e | Visual polish sweep (5 PRs across surface groups) | 3-4d | 3 |
|
||||
| 11 | Real-API integration tests | 1.5d | 2, 4-9 shipped |
|
||||
|
||||
### Critical path
|
||||
|
||||
```
|
||||
1 → 2 → 6 → 7 (data model → Documenso → wizard → reservation)
|
||||
1 → 3 → 4 → 5 → 9 (data model → primitives → hub → detail → reminders)
|
||||
1 → 8 (composer)
|
||||
3 → 10a-e (sweep)
|
||||
all → 11 (realapi)
|
||||
```
|
||||
|
||||
Wall-clock minimum ~9 days; realistic with overhead ~17 days; calendar ~3.5-5 weeks.
|
||||
|
||||
### Acceptance gates per PR
|
||||
|
||||
- `pnpm tsc --noEmit` and `pnpm lint` clean
|
||||
- Vitest unit + integration green
|
||||
- Playwright smoke green for surface touched
|
||||
- Visual baselines regenerated and reviewed in PR diff
|
||||
- For PRs touching external integrations (2, 6 upload, 7 contract mirror, 8 SMTP, 11): relevant `realapi` spec verified locally before merge
|
||||
|
||||
### Risk register
|
||||
|
||||
| Risk | Mitigation |
|
||||
| ---------------------------------------------------------- | ----------------------------------------------------------------------------------------- |
|
||||
| Documenso v2 endpoint shape drifts from docs | PR2 validates against real v2 instance during dev; realapi spec re-runs nightly post-ship |
|
||||
| Visual polish scope creeps | One PR per surface group (10a-e), each independently shippable |
|
||||
| Cron migration changes effective behaviour | Backfill sets EOI cadence to 1 day matching today's effective; run on staging first |
|
||||
| Mobile responsive regressions | Visual baselines include phone-viewport snapshots; PR10e is the responsive sweep |
|
||||
| EOI dialog → wizard migration breaks "Generate EOI" button | Wizard launched with prefills from interest detail; PR6 includes regression spec |
|
||||
| AcroForm template format confuses non-technical admins | HTML default; inline help; default templates seeded |
|
||||
| Phase A wall-clock past 5 weeks | Tier-2 sweep items + optional realapi specs deferrable to follow-up release |
|
||||
|
||||
## Glossary
|
||||
|
||||
- **Documenso** — open-source document signing service, self-hosted instance at `signatures.portnimara.dev`
|
||||
- **EOI** — Expression of Interest, a pre-reservation signed document
|
||||
- **Reservation Agreement** — contract signed when a berth reservation is committed
|
||||
- **Hub** — the new `/[port]/documents` page
|
||||
- **Watcher** — a CRM user added to a doc to receive notifications on signature events without being a signer themselves
|
||||
- **Signing order** — sequential index across signers; sequential mode requires lower order to sign first; parallel mode lets all sign concurrently
|
||||
- **Cadence** — interval in days between auto-reminders to unsigned signers
|
||||
- **System send / User send** — email dispatch identity: System uses port-config noreply SMTP; User uses connected personal email account (gated by admin toggle)
|
||||
- **Render location** — where the PDF is generated (CRM-local via HTML/AcroForm/overlay, or in Documenso). Signing is always Documenso; render location is independent.
|
||||
@@ -0,0 +1,435 @@
|
||||
# Phase B — Insights, Alerts, and Operational Awareness
|
||||
|
||||
**Status:** Draft — awaiting review
|
||||
**Date:** 2026-04-28
|
||||
**Phase:** B of D (A = Documents hub + visual polish ✓ shipped; C = Website integration; D = Pre-prod ops)
|
||||
|
||||
## Overview
|
||||
|
||||
Phase A made the CRM look polished and finished the documents/signing surface. Phase B turns it into a tool that _tells operators what's happening_ — instead of forcing them to navigate every list to find pipeline drift, expiring documents, or stalled reservations. It also closes the seven highest-priority Nuxt→Next gaps the 2026-04-28 audit surfaced (analytics, berth-interests, EOI queue, OCR, alerts, audit log, expense dedup).
|
||||
|
||||
The product story changes from "system of record" to "system of attention." Operators land on the dashboard and immediately see what needs them today — not a flat list they have to filter.
|
||||
|
||||
## Scope boundaries
|
||||
|
||||
### In scope (this spec)
|
||||
|
||||
- **Analytics dashboard** — chart-driven KPI page replacing the current 4-tile placeholder; pipeline funnel, occupancy timeline, revenue breakdown, lead-source attribution, with date-range and per-port filters
|
||||
- **Alert framework** — rule engine that evaluates conditions on a schedule and surfaces actionable cards (alerts) in the dashboard's right rail; dismissible per-user; deep-links into the offending entity
|
||||
- **Interests-by-berth view** — `/[port]/berths/[id]/interests` panel showing every interest targeting a berth, sortable by stage/score/age
|
||||
- **Expense duplicate detection** — heuristic match on (vendor + amount + date ± 3 days); surfaces in expense detail with "Merge" action; background scan on new expense
|
||||
- **EOI queue** — saved-view filter on the existing documents hub for `documentType='eoi' AND status IN ('sent','partially_signed')`, surfaced as a hub tab and a dashboard alert link
|
||||
- **OCR for expense receipts** — Claude Vision integration on the existing `/expenses/scan` route to extract vendor, amount, date, currency, line items from uploaded receipts; user confirms before save
|
||||
- **Audit log read view** — admin-gated UI for the existing `audit_logs` table with filters (user, action, entity type, date range, entity id search) and per-port + global (super-admin) scopes
|
||||
|
||||
### Explicitly out of scope (deferred to later phases)
|
||||
|
||||
- Custom user-defined alert rules (Phase B v1 ships with a fixed catalog of ~10 rules; user-rule creation deferred to Phase D)
|
||||
- Real-time alert push notifications (only socket-fired updates of the alert list; SMS/email push deferred)
|
||||
- Alert grouping / digests (each alert is its own card)
|
||||
- Predictive analytics, ML scoring (separate from existing AI feature flag)
|
||||
- Cross-port roll-up dashboards for super-admins (per-port only in v1)
|
||||
- Full audit-log retention / archival policy (Phase D)
|
||||
- OCR for PDF receipts (only image formats: jpg/png/heic; PDF expense uploads bypass OCR and stay manual until Phase D)
|
||||
- Excel/CSV import for bulk expense backfill
|
||||
- Country / phone / timezone work (separate cross-cutting agenda at `2026-04-28-country-phone-timezone-design.md`)
|
||||
|
||||
## Information architecture
|
||||
|
||||
### URL surface
|
||||
|
||||
```
|
||||
/[port]/dashboard replaces existing; analytics-driven
|
||||
/[port]/insights deep-link analytics page (charts only, no alerts)
|
||||
/[port]/alerts full alert list (admin filter, dismissed history)
|
||||
/[port]/berths/[id]/interests new tab on berth detail
|
||||
/[port]/expenses/scan extend existing route with Claude Vision OCR
|
||||
/[port]/admin/audit admin-gated audit log viewer
|
||||
/[port]/documents extended: 'EOI queue' tab pre-filters to EOI in flight
|
||||
```
|
||||
|
||||
### Schema deltas
|
||||
|
||||
```sql
|
||||
-- alerts: surfaces operational warnings the user should act on
|
||||
CREATE TABLE alerts (
|
||||
id text PRIMARY KEY DEFAULT generate_id('alrt'),
|
||||
port_id text NOT NULL REFERENCES ports(id) ON DELETE CASCADE,
|
||||
rule_id text NOT NULL, -- 'reservation.no_agreement', 'interest.stale', ...
|
||||
severity text NOT NULL, -- 'info' | 'warning' | 'critical'
|
||||
title text NOT NULL,
|
||||
body text,
|
||||
link text NOT NULL, -- relative path the card deep-links to
|
||||
entity_type text, -- optional FK target ('interest', 'reservation', ...)
|
||||
entity_id text,
|
||||
fingerprint text NOT NULL, -- hash of (rule_id + entity_type + entity_id) — dedupe
|
||||
fired_at timestamptz NOT NULL DEFAULT now(),
|
||||
dismissed_at timestamptz,
|
||||
dismissed_by text REFERENCES users(id),
|
||||
acknowledged_at timestamptz, -- "I'm on it" without dismissing
|
||||
acknowledged_by text REFERENCES users(id),
|
||||
resolved_at timestamptz, -- auto-set when underlying condition clears
|
||||
metadata jsonb DEFAULT '{}' -- per-rule extras (e.g. days_stale, amount_at_risk)
|
||||
);
|
||||
CREATE UNIQUE INDEX idx_alerts_fingerprint_open ON alerts (port_id, fingerprint) WHERE resolved_at IS NULL;
|
||||
CREATE INDEX idx_alerts_port_fired ON alerts (port_id, fired_at DESC);
|
||||
CREATE INDEX idx_alerts_port_severity_open ON alerts (port_id, severity) WHERE resolved_at IS NULL AND dismissed_at IS NULL;
|
||||
|
||||
-- expense duplicate detection (column-only, no new table)
|
||||
ALTER TABLE expenses ADD COLUMN duplicate_of text REFERENCES expenses(id);
|
||||
ALTER TABLE expenses ADD COLUMN dedup_scanned_at timestamptz;
|
||||
CREATE INDEX idx_expenses_dedup ON expenses (port_id, vendor_name, amount, expense_date)
|
||||
WHERE duplicate_of IS NULL;
|
||||
|
||||
-- analytics support: materialized refresh tracking (avoids recomputing on every dashboard hit)
|
||||
CREATE TABLE analytics_snapshots (
|
||||
port_id text NOT NULL REFERENCES ports(id) ON DELETE CASCADE,
|
||||
metric_id text NOT NULL, -- 'pipeline_funnel.30d', 'occupancy_timeline.90d', ...
|
||||
computed_at timestamptz NOT NULL DEFAULT now(),
|
||||
data jsonb NOT NULL,
|
||||
PRIMARY KEY (port_id, metric_id)
|
||||
);
|
||||
|
||||
-- audit_logs already exists; add a tsvector column for fast search
|
||||
ALTER TABLE audit_logs ADD COLUMN search_text tsvector
|
||||
GENERATED ALWAYS AS (
|
||||
to_tsvector('simple',
|
||||
coalesce(action, '') || ' ' ||
|
||||
coalesce(entity_type, '') || ' ' ||
|
||||
coalesce(entity_id::text, '') || ' ' ||
|
||||
coalesce(actor_email, ''))
|
||||
) STORED;
|
||||
CREATE INDEX idx_audit_search ON audit_logs USING gin(search_text);
|
||||
|
||||
-- ocr extracted fields on receipt files (most fields already on expenses)
|
||||
ALTER TABLE expenses ADD COLUMN ocr_status text DEFAULT 'pending'; -- 'pending'|'ok'|'failed'|'low_confidence'
|
||||
ALTER TABLE expenses ADD COLUMN ocr_raw jsonb; -- the model's full response
|
||||
ALTER TABLE expenses ADD COLUMN ocr_confidence numeric; -- 0..1
|
||||
```
|
||||
|
||||
After running migration on dev/staging, restart `next dev` to flush postgres.js prepared-statement cache (project convention).
|
||||
|
||||
### Service-layer changes
|
||||
|
||||
**New services:**
|
||||
|
||||
- `alerts.service.ts` — CRUD + fanout: `evaluateRules(portId)`, `dismissAlert(id, userId)`, `acknowledgeAlert(id, userId)`, `resolveStaleAlerts(portId)`
|
||||
- `alert-rules.ts` — fixed catalog of evaluator functions, each takes `(portId, db)` and returns `Array<{ rule_id, severity, fingerprint, ... }>`
|
||||
- `analytics.service.ts` — `getPipelineFunnel(portId, range)`, `getOccupancyTimeline(portId, range)`, `getRevenueBreakdown(portId, range)`, `getLeadSourceAttribution(portId, range)`; reads `analytics_snapshots` first, recomputes if stale
|
||||
- `analytics-snapshot-job.ts` — BullMQ recurring job that recomputes snapshots every 15 min per port
|
||||
- `expense-dedup.service.ts` — `scanForDuplicates(expenseId)`, returns candidate matches with confidence; called from BullMQ on `expense:created`
|
||||
- `expense-ocr.service.ts` — Claude Vision wrapper: takes file URL, returns parsed expense fields; uses prompt caching for the system prompt to keep cost down
|
||||
- `audit-search.service.ts` — wraps drizzle query with tsvector match + filters
|
||||
|
||||
**Extended services:**
|
||||
|
||||
- `documents.service.ts` — adds `getEoiQueueRows(portId, opts)` that joins documents + signers + last-reminder for the EOI queue tab
|
||||
- `expenses.service.ts` — `createExpense` triggers OCR + dedup BullMQ jobs after row insert
|
||||
- `notifications.service.ts` — fires `alert:created` and `alert:resolved` socket events
|
||||
|
||||
### Alert rule catalog (v1)
|
||||
|
||||
| Rule ID | Severity | Trigger | Resolves when | Why it matters |
|
||||
| ---------------------------- | -------- | -------------------------------------------------------------------------------------------- | -------------------------------------------- | ---------------------------- |
|
||||
| `reservation.no_agreement` | warning | active reservation > 3d old without a `reservation_agreement` doc in any non-cancelled state | doc reaches `sent` | flagged in Phase A spec |
|
||||
| `interest.stale` | info | `pipelineStage IN ('details_sent','in_communication','visited')` AND last activity > 14d | activity timestamp updates | dropped leads |
|
||||
| `document.expiring_soon` | warning | `expires_at` within 7 days, `status IN ('sent','partially_signed')` | doc completed/cancelled or expires_at passes | nudge before contracts lapse |
|
||||
| `document.signer_overdue` | warning | signer pending > 14d AND last reminder > 7d ago | signer signs/declines | classic chase target |
|
||||
| `berth.under_offer_stalled` | info | berth `status='under_offer'` > 30d | status changes | reservation never closed |
|
||||
| `expense.duplicate` | info | `expense.duplicate_of IS NOT NULL` | merged or marked-not-duplicate | bookkeeping cleanup |
|
||||
| `expense.unscanned` | info | expense with file but `ocr_status='pending'` > 1h | `ocr_status='ok'` | OCR failed silently |
|
||||
| `interest.high_value_silent` | critical | `leadCategory='hot_lead'` AND last activity > 7d | activity update | revenue at risk |
|
||||
| `eoi.unsigned_long` | warning | EOI doc `status='sent'` > 21d | doc completed/cancelled | EOI funnel leak |
|
||||
| `audit.suspicious_login` | critical | >3 failed logins from same IP in 1h | manual dismiss | security awareness |
|
||||
|
||||
Rules are pure functions; the engine takes their outputs, upserts on `(port_id, fingerprint)` to avoid spam, and auto-resolves alerts whose rule no longer fires.
|
||||
|
||||
## Per-feature design
|
||||
|
||||
### Analytics dashboard
|
||||
|
||||
Replaces the current 4-tile dashboard. Layout:
|
||||
|
||||
```
|
||||
[ Gradient PageHeader: "Dashboard" · last-updated stamp · Date range picker (Today / 7d / 30d / 90d / custom) ]
|
||||
|
||||
[ KPI row (4 KPITiles, sparkline + delta vs prior period):
|
||||
Total Clients Active Interests Pipeline Value Occupancy Rate
|
||||
]
|
||||
|
||||
[ Pipeline funnel (recharts FunnelChart): | Alert rail (right column):
|
||||
horizontal bars per stage with conversion % | Critical (red) cards
|
||||
click bar → filtered interests list | Warning (amber) cards
|
||||
| Info (blue) cards
|
||||
| "Show dismissed" toggle
|
||||
] |
|
||||
|
||||
[ Revenue breakdown (recharts BarChart, stacked by source) ] | (continues)
|
||||
|
||||
[ Occupancy timeline (recharts AreaChart, daily/weekly) ] |
|
||||
|
||||
[ Lead source attribution (recharts PieChart with legend) ]
|
||||
```
|
||||
|
||||
Charts are server-rendered via the recharts already-in-bundle. Data comes from `analytics.service.ts` which reads `analytics_snapshots` (refreshed every 15 min by cron) — first hit warms the cache, subsequent hits are sub-100ms.
|
||||
|
||||
Date-range picker re-runs `analytics.service` queries with the selected range; cache key includes the range so 30d and 90d don't fight.
|
||||
|
||||
Export: each chart card has a `[...]` overflow menu with "Download as CSV" and "Download as PNG"; uses recharts' `getDataUrl()` for PNG.
|
||||
|
||||
### Alert rail
|
||||
|
||||
Right column on `/dashboard`, full page at `/alerts`. Each alert is a card:
|
||||
|
||||
```
|
||||
[severity-color stripe-left]
|
||||
[rule-icon] Title (entity name)
|
||||
Body — body text describing the condition
|
||||
Last fired N days ago · entity: link
|
||||
[Acknowledge] [Dismiss] [Open →]
|
||||
```
|
||||
|
||||
- Acknowledge: marks `acknowledged_at` but stays visible (someone's on it)
|
||||
- Dismiss: hides from the rail; appears in `/alerts` "Dismissed" tab
|
||||
- Auto-resolve: when the rule re-evaluates and the condition no longer fires, alert moves to "Resolved" history
|
||||
|
||||
Real-time: socket emits `alert:created` / `alert:resolved` from the cron worker; React Query invalidates the alert list.
|
||||
|
||||
### Interests-by-berth view
|
||||
|
||||
New tab on `/[port]/berths/[id]` called "Interests" — count badge in tab.
|
||||
|
||||
```
|
||||
[ Berth header (existing) ]
|
||||
|
||||
[ Tabs: Overview | Reservations | Interests (N) | Notes | Files | Activity ]
|
||||
|
||||
[ Interests tab body:
|
||||
[Filter: All stages | Active only | Lost] [Sort: Newest | Stage progress | Lead score]
|
||||
Table: client name | stage pill | source | category | last activity | score badge
|
||||
Click row → interest detail
|
||||
]
|
||||
```
|
||||
|
||||
Pure read; no mutations. The list filters interests where `interest.berthId = berth.id`. Already exists in DB; just needs the UI tab.
|
||||
|
||||
### Expense duplicate detection
|
||||
|
||||
When a new expense is created, BullMQ job `expense.dedup` runs:
|
||||
|
||||
```ts
|
||||
async function scanForDuplicates(expenseId: string) {
|
||||
const e = await db.query.expenses.findFirst({ where: eq(expenses.id, expenseId) });
|
||||
const candidates = await db.query.expenses.findMany({
|
||||
where: and(
|
||||
eq(expenses.portId, e.portId),
|
||||
eq(expenses.vendorName, e.vendorName),
|
||||
eq(expenses.amount, e.amount),
|
||||
between(expenses.expenseDate, addDays(e.expenseDate, -3), addDays(e.expenseDate, 3)),
|
||||
ne(expenses.id, e.id),
|
||||
),
|
||||
});
|
||||
if (candidates.length > 0) {
|
||||
await db
|
||||
.update(expenses)
|
||||
.set({ duplicate_of: candidates[0].id, dedup_scanned_at: new Date() })
|
||||
.where(eq(expenses.id, expenseId));
|
||||
// fires `expense.duplicate` alert via rule engine on next sweep
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Detail page: when `duplicate_of` is set, show a yellow banner: "Looks like a duplicate of {linked expense}. [Merge them] [Mark as not duplicate]". Merge: deletes the new expense and merges any line items into the original.
|
||||
|
||||
### EOI queue tab
|
||||
|
||||
Documents hub gets a new tab between "Awaiting them" and "Awaiting me":
|
||||
|
||||
```
|
||||
Tabs: All | EOI queue (N) | Awaiting them | Awaiting me | Completed | Expired
|
||||
```
|
||||
|
||||
`EOI queue` filters: `documentType='eoi' AND status IN ('sent','partially_signed')`. Same row chrome as the rest of the hub. Bulk-action bar adds an "EOI bulk reminder" preset that respects the rule engine's reminder cooldown.
|
||||
|
||||
### OCR for expense receipts
|
||||
|
||||
Existing `/expenses/scan` route — extend to call Claude Vision on upload:
|
||||
|
||||
```ts
|
||||
// expense-ocr.service.ts (uses Anthropic SDK; already in deps)
|
||||
import Anthropic from '@anthropic-ai/sdk';
|
||||
|
||||
const client = new Anthropic();
|
||||
|
||||
const SYSTEM_PROMPT = `You extract structured expense data from receipts...
|
||||
Output JSON: { vendor, amount, currency, date (ISO), lineItems: [...], confidence (0-1) }
|
||||
`; /* cached via ephemeral cache_control for cost savings */
|
||||
|
||||
export async function ocrReceipt(fileUrl: string) {
|
||||
const file = await fetch(fileUrl);
|
||||
const base64 = Buffer.from(await file.arrayBuffer()).toString('base64');
|
||||
|
||||
const message = await client.messages.create({
|
||||
model: 'claude-haiku-4-5-20251001', // haiku for cost; sonnet if quality needed
|
||||
max_tokens: 1024,
|
||||
system: [{ type: 'text', text: SYSTEM_PROMPT, cache_control: { type: 'ephemeral' } }],
|
||||
messages: [
|
||||
{
|
||||
role: 'user',
|
||||
content: [
|
||||
{ type: 'image', source: { type: 'base64', media_type: 'image/jpeg', data: base64 } },
|
||||
{ type: 'text', text: 'Extract expense fields from this receipt.' },
|
||||
],
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
return parseAndValidate(message.content[0].text);
|
||||
}
|
||||
```
|
||||
|
||||
UI: existing scan page now shows a 3-step flow:
|
||||
|
||||
1. Upload receipt photo
|
||||
2. Wait for OCR (spinner; ~3s avg with Haiku)
|
||||
3. Confirm extracted fields (pre-filled form, user can edit)
|
||||
4. Save → existing expense create flow
|
||||
|
||||
Low-confidence (< 0.6) extractions show a yellow banner "Please verify all fields" and pre-select the file uploader.
|
||||
|
||||
### Audit log read view
|
||||
|
||||
Admin route `/[port]/admin/audit`:
|
||||
|
||||
```
|
||||
[ PageHeader: "Audit Log" · "Last 30 days · 12,847 events" ]
|
||||
|
||||
[ Filter row:
|
||||
Search [tsvector] Actor [combobox of users] Action [pills] Entity type [select]
|
||||
Date range [picker] Severity [pills] [Reset]
|
||||
]
|
||||
|
||||
[ Table:
|
||||
Timestamp | Actor | Action | Entity | Diff button | IP | User-agent
|
||||
Click row → expand to show before/after JSON diff
|
||||
]
|
||||
|
||||
[ Pagination · Export CSV button (admin-gated) ]
|
||||
```
|
||||
|
||||
Server-side: `audit-search.service.ts` builds a drizzle query with the tsvector match + filters; supports cursor pagination on `(created_at, id)`.
|
||||
|
||||
Super-admin sees a port toggle that switches between current port and "All ports" view.
|
||||
|
||||
## Test plan
|
||||
|
||||
### Unit (`tests/unit/`)
|
||||
|
||||
- `alert-rules-evaluators.test.ts` — each rule tested with seeded data; covers fire/no-fire cases and resolution conditions
|
||||
- `expense-dedup-heuristic.test.ts` — vendor/amount/date matching with edge cases (case-insensitive, ±3d window, currency mismatch ignored)
|
||||
- `analytics-pipeline-funnel.test.ts` — funnel math against fixture interests
|
||||
- `analytics-occupancy-timeline.test.ts` — daily aggregation against fixture berth status changes
|
||||
- `audit-search-filters.test.ts` — tsvector + filter composition
|
||||
- `ocr-prompt-caching.test.ts` — assert cache_control presence on system prompt; mocked Claude response
|
||||
|
||||
### Integration (`tests/integration/`)
|
||||
|
||||
- `alerts-engine.test.ts` — full evaluation cycle: seed conditions, run engine, assert correct alerts upserted, run again to assert dedupe via fingerprint, mutate state, assert auto-resolve
|
||||
- `analytics-snapshot-refresh.test.ts` — recurring job: snapshot row written, served from cache on next read, refreshed on next tick
|
||||
- `expense-dedup-flow.test.ts` — create A, create matching B, assert B.duplicate_of=A; merge B → A absorbs line items, B archived
|
||||
- `audit-search-tsvector.test.ts` — seed audit_logs, query by free-text, assert returned ids
|
||||
- `eoi-queue-listing.test.ts` — extends documents-hub test; assert EOI tab returns correct subset
|
||||
|
||||
### E2E smoke (`tests/e2e/smoke/`)
|
||||
|
||||
- New `27-analytics-dashboard.spec.ts` — dashboard renders charts; date-range picker re-renders; KPI tiles show non-zero data after seed
|
||||
- New `28-alerts.spec.ts` — alert appears after seeding stale-interest condition; click-to-deep-link; dismiss persists; resolve hides
|
||||
- New `29-interests-by-berth.spec.ts` — tab visible on berth detail; lists interests; sort works
|
||||
- New `30-expense-dedup.spec.ts` — create two matching expenses; banner appears; merge button works
|
||||
- New `31-ocr-flow.spec.ts` — uploads fixture receipt image; extracted fields pre-filled; user can edit and save
|
||||
- New `32-audit-log.spec.ts` — admin page loads; search by entity id returns expected row; date filter narrows
|
||||
- Extend `04-documents.spec.ts` — EOI queue tab presence + count badge
|
||||
|
||||
### E2E exhaustive (`tests/e2e/exhaustive/`)
|
||||
|
||||
- `15-analytics-dashboard.spec.ts` — crawl every chart's hover tooltips, legend toggles, export menu
|
||||
- `16-alerts.spec.ts` — crawl alert card actions, severity filters, dismissed history, real-time arrival via socket emit
|
||||
- `17-audit-log.spec.ts` — crawl filter combos, expand row diffs, super-admin all-ports toggle
|
||||
|
||||
### E2E real-API (`tests/e2e/realapi/`)
|
||||
|
||||
- New `claude-vision-receipt-ocr.spec.ts` — gates on `ANTHROPIC_API_KEY`; uploads two real fixture receipts (one clean, one blurry); asserts Haiku response shape and confidence score; verifies `cache_control` headers in HTTP trace; cleanup deletes test expense
|
||||
|
||||
### Test data fixtures
|
||||
|
||||
`global-setup.ts` extends:
|
||||
|
||||
- Seed one stale interest in `details_sent` stage with `last_activity_at = now - 20d` (fires `interest.stale`)
|
||||
- Seed one active reservation without an agreement (fires `reservation.no_agreement`)
|
||||
- Seed two matching expenses (fires `expense.duplicate`)
|
||||
- Seed 90 days of pipeline activity for analytics charts
|
||||
- Add a `tests/e2e/fixtures/receipts/` dir with two .jpg receipts for OCR tests
|
||||
|
||||
## Build sequence
|
||||
|
||||
| # | Title | Effort | Depends on |
|
||||
| --- | ------------------------------------------------------------ | ------ | ----------------- |
|
||||
| 1 | Schema + alert/analytics service skeletons | 1d | — |
|
||||
| 2 | Alert rules engine + recurring evaluator + socket | 1.5d | 1 |
|
||||
| 3 | Analytics snapshot job + service layer | 1d | 1 |
|
||||
| 4 | Analytics dashboard page (KPI tiles + 4 charts + date-range) | 2.5d | 1, 3, A's KPITile |
|
||||
| 5 | Alert rail UI + `/alerts` page | 1.5d | 2 |
|
||||
| 6 | EOI queue tab on documents hub | 0.5d | A's hub |
|
||||
| 7 | Interests-by-berth tab on berth detail | 0.5d | — |
|
||||
| 8 | Expense duplicate detection (job + UI banner + merge) | 1.5d | 1 |
|
||||
| 9 | OCR for expense receipts (Claude Vision + 3-step UI) | 1.5d | — |
|
||||
| 10 | Audit log read view (admin page + filters + tsvector search) | 1.5d | 1 |
|
||||
| 11 | Real-API integration tests | 1d | 9 |
|
||||
|
||||
### Critical path
|
||||
|
||||
```
|
||||
1 → 2 → 5 (data → alert engine → alert UI)
|
||||
1 → 3 → 4 (data → analytics service → analytics page)
|
||||
8 → 2 (alert rule) (dedup populates the data the alert reads)
|
||||
9 (OCR) → 11 (realapi)
|
||||
```
|
||||
|
||||
Wall-clock minimum ~10 days (one engineer, sequential critical path); realistic with overhead ~13 days; calendar 2.5–3 weeks.
|
||||
|
||||
### Acceptance gates per PR
|
||||
|
||||
- `pnpm tsc --noEmit` and `pnpm lint` clean
|
||||
- Vitest unit + integration green (incl. new tests)
|
||||
- Playwright smoke green for the surface touched
|
||||
- Visual baselines regenerated and reviewed in PR diff
|
||||
- For PRs touching external integrations (9 OCR, 11 realapi): relevant `realapi` spec verified locally before merge
|
||||
|
||||
### Risk register
|
||||
|
||||
| Risk | Mitigation |
|
||||
| ------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| Alert engine false positives spam users | Each rule has a "snooze" window in metadata; rules ship behind a feature flag `alerts.{rule_id}.enabled`; QA seeds production-shape data before flipping flags on |
|
||||
| Analytics queries slow on large datasets | `analytics_snapshots` materialized cache; cron recomputes off the request path; queries use existing per-port indexes |
|
||||
| Claude Vision OCR cost spirals | Default to Haiku 4.5 (~10× cheaper than Sonnet); ephemeral system-prompt cache hits ~80%; per-port quota with admin-visible meter |
|
||||
| OCR low-quality on blurry receipts | Confidence threshold (< 0.6) flips to "verify mode" — user must touch every field before save; failure metric tracked in admin/monitoring |
|
||||
| Audit log table large (millions of rows) | Already partitioned-friendly via the GIN tsvector index; pagination uses cursor on `(created_at, id)` not OFFSET |
|
||||
| Alert socket fanout overwhelms client | Throttle the engine cron to once per 5min; client debounces React Query refetches |
|
||||
| Interest stale rule fires for legitimately paused leads | Add a per-interest `paused_until` field as a follow-up if operators ask; v1 ships without |
|
||||
|
||||
## Glossary
|
||||
|
||||
- **Alert** — operator-facing actionable card, rule-fired, dismissible
|
||||
- **Rule** — a pure-function evaluator that takes (port, db) and returns alert candidates
|
||||
- **Fingerprint** — `hash(rule_id + entity_type + entity_id)` used to dedupe alerts across re-evaluations
|
||||
- **Snapshot** — cached chart data row in `analytics_snapshots`, refreshed on cron
|
||||
- **EOI queue** — saved-view filter on the documents hub, not a separate page
|
||||
- **OCR** — Claude Vision extraction of structured expense fields from receipt images
|
||||
- **Audit log** — read view of the existing `audit_logs` table; no schema change beyond a tsvector column
|
||||
|
||||
## Open questions for the user
|
||||
|
||||
- Which port should be the **default landing dashboard** when a super-admin logs in (currently first-port-by-name; analytics page works the same)?
|
||||
- Should the alert rail be **always visible on all dashboard pages** or only on `/dashboard` (currently spec'd as the latter)?
|
||||
- Do you want the **Audit log retention policy** (delete > N days old) wired in v1 or deferred to Phase D?
|
||||
- Should **OCR be opt-in per port** (admin toggle) or always-on with a quota?
|
||||
@@ -0,0 +1,10 @@
|
||||
import { ReservationDetail } from '@/components/reservations/reservation-detail';
|
||||
|
||||
interface PageProps {
|
||||
params: Promise<{ portSlug: string; id: string }>;
|
||||
}
|
||||
|
||||
export default async function ReservationDetailPage({ params }: PageProps) {
|
||||
const { portSlug, id } = await params;
|
||||
return <ReservationDetail reservationId={id} portSlug={portSlug} />;
|
||||
}
|
||||
10
src/app/(dashboard)/[portSlug]/documents/[id]/page.tsx
Normal file
10
src/app/(dashboard)/[portSlug]/documents/[id]/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { DocumentDetail } from '@/components/documents/document-detail';
|
||||
|
||||
interface PageProps {
|
||||
params: Promise<{ portSlug: string; id: string }>;
|
||||
}
|
||||
|
||||
export default async function DocumentDetailPage({ params }: PageProps) {
|
||||
const { portSlug, id } = await params;
|
||||
return <DocumentDetail documentId={id} portSlug={portSlug} />;
|
||||
}
|
||||
138
src/app/(dashboard)/[portSlug]/documents/files/page.tsx
Normal file
138
src/app/(dashboard)/[portSlug]/documents/files/page.tsx
Normal file
@@ -0,0 +1,138 @@
|
||||
'use client';
|
||||
|
||||
import { useState } from 'react';
|
||||
import { Grid, List, Upload } from 'lucide-react';
|
||||
import { useQueryClient } from '@tanstack/react-query';
|
||||
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { PageHeader } from '@/components/shared/page-header';
|
||||
import { PermissionGate } from '@/components/shared/permission-gate';
|
||||
import { FileGrid } from '@/components/files/file-grid';
|
||||
import { FolderTree } from '@/components/files/folder-tree';
|
||||
import { FileUploadZone } from '@/components/files/file-upload-zone';
|
||||
import { FilePreviewDialog } from '@/components/files/file-preview-dialog';
|
||||
import { usePaginatedQuery } from '@/hooks/use-paginated-query';
|
||||
import { useRealtimeInvalidation } from '@/hooks/use-realtime-invalidation';
|
||||
import { useFileBrowserStore } from '@/stores/file-browser-store';
|
||||
import { apiFetch } from '@/lib/api/client';
|
||||
import type { FileRow } from '@/components/files/file-grid';
|
||||
|
||||
export default function DocumentsPage() {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const { viewMode, setViewMode, currentFolder, setCurrentFolder } = useFileBrowserStore();
|
||||
const [showUpload, setShowUpload] = useState(false);
|
||||
const [previewFile, setPreviewFile] = useState<FileRow | null>(null);
|
||||
const [, setRenameFile] = useState<FileRow | null>(null);
|
||||
|
||||
const { data, isLoading } = usePaginatedQuery<FileRow & { storagePath: string }>({
|
||||
queryKey: ['files'],
|
||||
endpoint: '/api/v1/files',
|
||||
filterDefinitions: [],
|
||||
});
|
||||
|
||||
useRealtimeInvalidation({
|
||||
'file:uploaded': [['files']],
|
||||
'file:updated': [['files']],
|
||||
'file:deleted': [['files']],
|
||||
});
|
||||
|
||||
const filesInFolder = currentFolder
|
||||
? data.filter((f) => f.storagePath?.includes(currentFolder))
|
||||
: data;
|
||||
|
||||
const handleDownload = async (file: FileRow) => {
|
||||
try {
|
||||
const res = await apiFetch<{ data: { url: string; filename: string } }>(
|
||||
`/api/v1/files/${file.id}/download`,
|
||||
);
|
||||
const a = document.createElement('a');
|
||||
a.href = res.data.url;
|
||||
a.download = res.data.filename;
|
||||
a.click();
|
||||
} catch {
|
||||
// silent
|
||||
}
|
||||
};
|
||||
|
||||
const handleDelete = async (file: FileRow) => {
|
||||
if (!confirm(`Delete "${file.filename}"? This cannot be undone.`)) return;
|
||||
try {
|
||||
await apiFetch(`/api/v1/files/${file.id}`, { method: 'DELETE' });
|
||||
queryClient.invalidateQueries({ queryKey: ['files'] });
|
||||
} catch {
|
||||
// silent
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex h-full flex-col gap-4">
|
||||
<PageHeader
|
||||
title="Documents"
|
||||
description="Store and manage port documents and attachments"
|
||||
actions={
|
||||
<div className="flex items-center gap-2">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="icon"
|
||||
onClick={() => setViewMode(viewMode === 'grid' ? 'list' : 'grid')}
|
||||
>
|
||||
{viewMode === 'grid' ? <List className="h-4 w-4" /> : <Grid className="h-4 w-4" />}
|
||||
</Button>
|
||||
<PermissionGate resource="files" action="upload">
|
||||
<Button size="sm" onClick={() => setShowUpload((v) => !v)}>
|
||||
<Upload className="mr-1.5 h-4 w-4" />
|
||||
Upload
|
||||
</Button>
|
||||
</PermissionGate>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
|
||||
{showUpload && (
|
||||
<PermissionGate resource="files" action="upload">
|
||||
<FileUploadZone
|
||||
onUploadComplete={() => {
|
||||
queryClient.invalidateQueries({ queryKey: ['files'] });
|
||||
setShowUpload(false);
|
||||
}}
|
||||
/>
|
||||
</PermissionGate>
|
||||
)}
|
||||
|
||||
<div className="flex flex-1 gap-4 overflow-hidden">
|
||||
{/* Folder tree sidebar */}
|
||||
<aside className="w-48 shrink-0 overflow-y-auto rounded-lg border bg-card p-2">
|
||||
<p className="mb-1 px-2 text-xs font-medium text-muted-foreground uppercase tracking-wide">
|
||||
Folders
|
||||
</p>
|
||||
<FolderTree
|
||||
files={data}
|
||||
currentFolder={currentFolder}
|
||||
onFolderSelect={setCurrentFolder}
|
||||
/>
|
||||
</aside>
|
||||
|
||||
{/* Main content */}
|
||||
<main className="flex-1 overflow-y-auto rounded-lg border bg-card p-4">
|
||||
<FileGrid
|
||||
files={filesInFolder}
|
||||
onDownload={handleDownload}
|
||||
onPreview={setPreviewFile}
|
||||
onRename={setRenameFile}
|
||||
onDelete={handleDelete}
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<FilePreviewDialog
|
||||
open={!!previewFile}
|
||||
onOpenChange={(open) => !open && setPreviewFile(null)}
|
||||
fileId={previewFile?.id}
|
||||
fileName={previewFile?.filename}
|
||||
mimeType={previewFile?.mimeType ?? undefined}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
10
src/app/(dashboard)/[portSlug]/documents/new/page.tsx
Normal file
10
src/app/(dashboard)/[portSlug]/documents/new/page.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { CreateDocumentWizard } from '@/components/documents/create-document-wizard';
|
||||
|
||||
interface PageProps {
|
||||
params: Promise<{ portSlug: string }>;
|
||||
}
|
||||
|
||||
export default async function NewDocumentPage({ params }: PageProps) {
|
||||
const { portSlug } = await params;
|
||||
return <CreateDocumentWizard portSlug={portSlug} />;
|
||||
}
|
||||
@@ -1,142 +1,10 @@
|
||||
'use client';
|
||||
import { DocumentsHub } from '@/components/documents/documents-hub';
|
||||
|
||||
import { useState } from 'react';
|
||||
import { Grid, List, Upload } from 'lucide-react';
|
||||
import { useQueryClient } from '@tanstack/react-query';
|
||||
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { PageHeader } from '@/components/shared/page-header';
|
||||
import { PermissionGate } from '@/components/shared/permission-gate';
|
||||
import { FileGrid } from '@/components/files/file-grid';
|
||||
import { FolderTree } from '@/components/files/folder-tree';
|
||||
import { FileUploadZone } from '@/components/files/file-upload-zone';
|
||||
import { FilePreviewDialog } from '@/components/files/file-preview-dialog';
|
||||
import { usePaginatedQuery } from '@/hooks/use-paginated-query';
|
||||
import { useRealtimeInvalidation } from '@/hooks/use-realtime-invalidation';
|
||||
import { useFileBrowserStore } from '@/stores/file-browser-store';
|
||||
import { apiFetch } from '@/lib/api/client';
|
||||
import type { FileRow } from '@/components/files/file-grid';
|
||||
|
||||
export default function DocumentsPage() {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
const { viewMode, setViewMode, currentFolder, setCurrentFolder } = useFileBrowserStore();
|
||||
const [showUpload, setShowUpload] = useState(false);
|
||||
const [previewFile, setPreviewFile] = useState<FileRow | null>(null);
|
||||
const [, setRenameFile] = useState<FileRow | null>(null);
|
||||
|
||||
const { data, isLoading } = usePaginatedQuery<FileRow & { storagePath: string }>({
|
||||
queryKey: ['files'],
|
||||
endpoint: '/api/v1/files',
|
||||
filterDefinitions: [],
|
||||
});
|
||||
|
||||
useRealtimeInvalidation({
|
||||
'file:uploaded': [['files']],
|
||||
'file:updated': [['files']],
|
||||
'file:deleted': [['files']],
|
||||
});
|
||||
|
||||
const filesInFolder = currentFolder
|
||||
? data.filter((f) => f.storagePath?.includes(currentFolder))
|
||||
: data;
|
||||
|
||||
const handleDownload = async (file: FileRow) => {
|
||||
try {
|
||||
const res = await apiFetch<{ data: { url: string; filename: string } }>(
|
||||
`/api/v1/files/${file.id}/download`,
|
||||
);
|
||||
const a = document.createElement('a');
|
||||
a.href = res.data.url;
|
||||
a.download = res.data.filename;
|
||||
a.click();
|
||||
} catch {
|
||||
// silent
|
||||
}
|
||||
};
|
||||
|
||||
const handleDelete = async (file: FileRow) => {
|
||||
if (!confirm(`Delete "${file.filename}"? This cannot be undone.`)) return;
|
||||
try {
|
||||
await apiFetch(`/api/v1/files/${file.id}`, { method: 'DELETE' });
|
||||
queryClient.invalidateQueries({ queryKey: ['files'] });
|
||||
} catch {
|
||||
// silent
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex h-full flex-col gap-4">
|
||||
<PageHeader
|
||||
title="Documents"
|
||||
description="Store and manage port documents and attachments"
|
||||
actions={
|
||||
<div className="flex items-center gap-2">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="icon"
|
||||
onClick={() => setViewMode(viewMode === 'grid' ? 'list' : 'grid')}
|
||||
>
|
||||
{viewMode === 'grid' ? (
|
||||
<List className="h-4 w-4" />
|
||||
) : (
|
||||
<Grid className="h-4 w-4" />
|
||||
)}
|
||||
</Button>
|
||||
<PermissionGate resource="files" action="upload">
|
||||
<Button size="sm" onClick={() => setShowUpload((v) => !v)}>
|
||||
<Upload className="mr-1.5 h-4 w-4" />
|
||||
Upload
|
||||
</Button>
|
||||
</PermissionGate>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
|
||||
{showUpload && (
|
||||
<PermissionGate resource="files" action="upload">
|
||||
<FileUploadZone
|
||||
onUploadComplete={() => {
|
||||
queryClient.invalidateQueries({ queryKey: ['files'] });
|
||||
setShowUpload(false);
|
||||
}}
|
||||
/>
|
||||
</PermissionGate>
|
||||
)}
|
||||
|
||||
<div className="flex flex-1 gap-4 overflow-hidden">
|
||||
{/* Folder tree sidebar */}
|
||||
<aside className="w-48 shrink-0 overflow-y-auto rounded-lg border bg-card p-2">
|
||||
<p className="mb-1 px-2 text-xs font-medium text-muted-foreground uppercase tracking-wide">
|
||||
Folders
|
||||
</p>
|
||||
<FolderTree
|
||||
files={data}
|
||||
currentFolder={currentFolder}
|
||||
onFolderSelect={setCurrentFolder}
|
||||
/>
|
||||
</aside>
|
||||
|
||||
{/* Main content */}
|
||||
<main className="flex-1 overflow-y-auto rounded-lg border bg-card p-4">
|
||||
<FileGrid
|
||||
files={filesInFolder}
|
||||
onDownload={handleDownload}
|
||||
onPreview={setPreviewFile}
|
||||
onRename={setRenameFile}
|
||||
onDelete={handleDelete}
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<FilePreviewDialog
|
||||
open={!!previewFile}
|
||||
onOpenChange={(open) => !open && setPreviewFile(null)}
|
||||
fileId={previewFile?.id}
|
||||
fileName={previewFile?.filename}
|
||||
mimeType={previewFile?.mimeType ?? undefined}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
interface PageProps {
|
||||
params: Promise<{ portSlug: string }>;
|
||||
}
|
||||
|
||||
export default async function DocumentsPage({ params }: PageProps) {
|
||||
const { portSlug } = await params;
|
||||
return <DocumentsHub portSlug={portSlug} />;
|
||||
}
|
||||
|
||||
21
src/app/api/v1/documents/[id]/cancel/route.ts
Normal file
21
src/app/api/v1/documents/[id]/cancel/route.ts
Normal file
@@ -0,0 +1,21 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
|
||||
import { withAuth, withPermission } from '@/lib/api/helpers';
|
||||
import { errorResponse } from '@/lib/errors';
|
||||
import { cancelDocument } from '@/lib/services/documents.service';
|
||||
|
||||
export const POST = withAuth(
|
||||
withPermission('documents', 'edit', async (_req, ctx, params) => {
|
||||
try {
|
||||
const doc = await cancelDocument(params.id!, ctx.portId, {
|
||||
userId: ctx.userId,
|
||||
portId: ctx.portId,
|
||||
ipAddress: ctx.ipAddress,
|
||||
userAgent: ctx.userAgent,
|
||||
});
|
||||
return NextResponse.json({ data: doc });
|
||||
} catch (error) {
|
||||
return errorResponse(error);
|
||||
}
|
||||
}),
|
||||
);
|
||||
@@ -0,0 +1,16 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
|
||||
import { withAuth, withPermission } from '@/lib/api/helpers';
|
||||
import { errorResponse } from '@/lib/errors';
|
||||
import { composeSignedDocEmail } from '@/lib/services/documents.service';
|
||||
|
||||
export const POST = withAuth(
|
||||
withPermission('documents', 'view', async (_req, ctx, params) => {
|
||||
try {
|
||||
const draft = await composeSignedDocEmail(params.id!, ctx.portId);
|
||||
return NextResponse.json({ data: draft });
|
||||
} catch (error) {
|
||||
return errorResponse(error);
|
||||
}
|
||||
}),
|
||||
);
|
||||
@@ -1,14 +1,30 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
import { z } from 'zod';
|
||||
|
||||
import { withAuth, withPermission } from '@/lib/api/helpers';
|
||||
import { errorResponse } from '@/lib/errors';
|
||||
import { sendReminderIfAllowed } from '@/lib/services/document-reminders';
|
||||
|
||||
const remindBodySchema = z
|
||||
.object({
|
||||
signerId: z.string().optional(),
|
||||
})
|
||||
.optional();
|
||||
|
||||
export const POST = withAuth(
|
||||
withPermission('documents', 'edit', async (req, ctx, params) => {
|
||||
try {
|
||||
const sent = await sendReminderIfAllowed(params.id!, ctx.portId);
|
||||
return NextResponse.json({ data: { sent } });
|
||||
let signerId: string | undefined;
|
||||
const text = await req.text();
|
||||
if (text) {
|
||||
const parsed = remindBodySchema.safeParse(JSON.parse(text));
|
||||
if (parsed.success && parsed.data) signerId = parsed.data.signerId;
|
||||
}
|
||||
const result = await sendReminderIfAllowed(params.id!, ctx.portId, {
|
||||
auto: false,
|
||||
signerId,
|
||||
});
|
||||
return NextResponse.json({ data: result });
|
||||
} catch (error) {
|
||||
return errorResponse(error);
|
||||
}
|
||||
|
||||
@@ -5,6 +5,7 @@ import { parseBody } from '@/lib/api/route-helpers';
|
||||
import { errorResponse } from '@/lib/errors';
|
||||
import {
|
||||
getDocumentById,
|
||||
getDocumentDetail,
|
||||
updateDocument,
|
||||
deleteDocument,
|
||||
} from '@/lib/services/documents.service';
|
||||
@@ -13,6 +14,11 @@ import { updateDocumentSchema } from '@/lib/validators/documents';
|
||||
export const GET = withAuth(
|
||||
withPermission('documents', 'view', async (req, ctx, params) => {
|
||||
try {
|
||||
const url = new URL(req.url);
|
||||
if (url.searchParams.get('detail') === 'true') {
|
||||
const detail = await getDocumentDetail(params.id!, ctx.portId);
|
||||
return NextResponse.json({ data: detail });
|
||||
}
|
||||
const doc = await getDocumentById(params.id!, ctx.portId);
|
||||
return NextResponse.json({ data: doc });
|
||||
} catch (error) {
|
||||
|
||||
21
src/app/api/v1/documents/[id]/watchers/[userId]/route.ts
Normal file
21
src/app/api/v1/documents/[id]/watchers/[userId]/route.ts
Normal file
@@ -0,0 +1,21 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
|
||||
import { withAuth, withPermission } from '@/lib/api/helpers';
|
||||
import { errorResponse } from '@/lib/errors';
|
||||
import { removeDocumentWatcher } from '@/lib/services/documents.service';
|
||||
|
||||
export const DELETE = withAuth(
|
||||
withPermission('documents', 'edit', async (_req, ctx, params) => {
|
||||
try {
|
||||
await removeDocumentWatcher(params.id!, ctx.portId, params.userId!, {
|
||||
userId: ctx.userId,
|
||||
portId: ctx.portId,
|
||||
ipAddress: ctx.ipAddress,
|
||||
userAgent: ctx.userAgent,
|
||||
});
|
||||
return NextResponse.json({ data: { ok: true } });
|
||||
} catch (error) {
|
||||
return errorResponse(error);
|
||||
}
|
||||
}),
|
||||
);
|
||||
39
src/app/api/v1/documents/[id]/watchers/route.ts
Normal file
39
src/app/api/v1/documents/[id]/watchers/route.ts
Normal file
@@ -0,0 +1,39 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
import { z } from 'zod';
|
||||
|
||||
import { withAuth, withPermission } from '@/lib/api/helpers';
|
||||
import { parseBody } from '@/lib/api/route-helpers';
|
||||
import { errorResponse } from '@/lib/errors';
|
||||
import { addDocumentWatcher, listDocumentWatchers } from '@/lib/services/documents.service';
|
||||
|
||||
const addWatcherSchema = z.object({
|
||||
userId: z.string().min(1),
|
||||
});
|
||||
|
||||
export const GET = withAuth(
|
||||
withPermission('documents', 'view', async (_req, ctx, params) => {
|
||||
try {
|
||||
const watchers = await listDocumentWatchers(params.id!, ctx.portId);
|
||||
return NextResponse.json({ data: watchers });
|
||||
} catch (error) {
|
||||
return errorResponse(error);
|
||||
}
|
||||
}),
|
||||
);
|
||||
|
||||
export const POST = withAuth(
|
||||
withPermission('documents', 'edit', async (req, ctx, params) => {
|
||||
try {
|
||||
const body = await parseBody(req, addWatcherSchema);
|
||||
const watcher = await addDocumentWatcher(params.id!, ctx.portId, body.userId, {
|
||||
userId: ctx.userId,
|
||||
portId: ctx.portId,
|
||||
ipAddress: ctx.ipAddress,
|
||||
userAgent: ctx.userAgent,
|
||||
});
|
||||
return NextResponse.json({ data: watcher }, { status: 201 });
|
||||
} catch (error) {
|
||||
return errorResponse(error);
|
||||
}
|
||||
}),
|
||||
);
|
||||
16
src/app/api/v1/documents/hub-counts/route.ts
Normal file
16
src/app/api/v1/documents/hub-counts/route.ts
Normal file
@@ -0,0 +1,16 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
|
||||
import { withAuth, withPermission } from '@/lib/api/helpers';
|
||||
import { errorResponse } from '@/lib/errors';
|
||||
import { getHubTabCounts } from '@/lib/services/documents.service';
|
||||
|
||||
export const GET = withAuth(
|
||||
withPermission('documents', 'view', async (_req, ctx) => {
|
||||
try {
|
||||
const counts = await getHubTabCounts(ctx.portId, ctx.user.email);
|
||||
return NextResponse.json({ data: counts });
|
||||
} catch (error) {
|
||||
return errorResponse(error);
|
||||
}
|
||||
}),
|
||||
);
|
||||
@@ -10,7 +10,9 @@ export const GET = withAuth(
|
||||
withPermission('documents', 'view', async (req, ctx) => {
|
||||
try {
|
||||
const query = parseQuery(req, listDocumentsSchema);
|
||||
const result = await listDocuments(ctx.portId, query);
|
||||
const result = await listDocuments(ctx.portId, query, {
|
||||
currentUserEmail: ctx.user.email,
|
||||
});
|
||||
|
||||
const { page, limit } = query;
|
||||
const totalPages = Math.ceil(result.total / limit);
|
||||
|
||||
24
src/app/api/v1/documents/wizard/route.ts
Normal file
24
src/app/api/v1/documents/wizard/route.ts
Normal file
@@ -0,0 +1,24 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
|
||||
import { withAuth, withPermission } from '@/lib/api/helpers';
|
||||
import { parseBody } from '@/lib/api/route-helpers';
|
||||
import { errorResponse } from '@/lib/errors';
|
||||
import { createFromWizard } from '@/lib/services/documents.service';
|
||||
import { createDocumentWizardSchema } from '@/lib/validators/documents';
|
||||
|
||||
export const POST = withAuth(
|
||||
withPermission('documents', 'create', async (req, ctx) => {
|
||||
try {
|
||||
const body = await parseBody(req, createDocumentWizardSchema);
|
||||
const doc = await createFromWizard(ctx.portId, body, {
|
||||
userId: ctx.userId,
|
||||
portId: ctx.portId,
|
||||
ipAddress: ctx.ipAddress,
|
||||
userAgent: ctx.userAgent,
|
||||
});
|
||||
return NextResponse.json({ data: doc }, { status: 201 });
|
||||
} catch (error) {
|
||||
return errorResponse(error);
|
||||
}
|
||||
}),
|
||||
);
|
||||
@@ -24,6 +24,7 @@ import {
|
||||
SelectValue,
|
||||
} from '@/components/ui/select';
|
||||
import { Textarea } from '@/components/ui/textarea';
|
||||
import { DetailHeaderStrip } from '@/components/shared/detail-header-strip';
|
||||
import { PermissionGate } from '@/components/shared/permission-gate';
|
||||
import { BerthForm } from './berth-form';
|
||||
import { apiFetch } from '@/lib/api/client';
|
||||
@@ -94,7 +95,7 @@ function StatusChangeDialog({
|
||||
formState: { isSubmitting },
|
||||
} = useForm<UpdateBerthStatusInput>({
|
||||
resolver: zodResolver(updateBerthStatusSchema),
|
||||
defaultValues: { status: currentStatus as typeof BERTH_STATUSES[number], reason: '' },
|
||||
defaultValues: { status: currentStatus as (typeof BERTH_STATUSES)[number], reason: '' },
|
||||
});
|
||||
|
||||
const status = watch('status');
|
||||
@@ -127,7 +128,7 @@ function StatusChangeDialog({
|
||||
<Label>New Status</Label>
|
||||
<Select
|
||||
value={status}
|
||||
onValueChange={(v) => setValue('status', v as typeof BERTH_STATUSES[number])}
|
||||
onValueChange={(v) => setValue('status', v as (typeof BERTH_STATUSES)[number])}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
@@ -143,11 +144,7 @@ function StatusChangeDialog({
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label>Reason *</Label>
|
||||
<Textarea
|
||||
{...register('reason')}
|
||||
placeholder="Reason for status change..."
|
||||
rows={3}
|
||||
/>
|
||||
<Textarea {...register('reason')} placeholder="Reason for status change..." rows={3} />
|
||||
</div>
|
||||
<DialogFooter>
|
||||
<Button type="button" variant="outline" onClick={() => onOpenChange(false)}>
|
||||
@@ -169,22 +166,18 @@ export function BerthDetailHeader({ berth }: BerthDetailHeaderProps) {
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="space-y-3">
|
||||
<DetailHeaderStrip>
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center gap-3 flex-wrap">
|
||||
<h1 className="text-2xl font-bold text-foreground">
|
||||
Berth {berth.mooringNumber}
|
||||
</h1>
|
||||
<h1 className="text-2xl font-bold text-foreground">Berth {berth.mooringNumber}</h1>
|
||||
<span
|
||||
className={`inline-flex items-center rounded-full border px-3 py-1 text-sm font-medium ${STATUS_COLORS[berth.status] ?? 'bg-muted text-muted-foreground border-muted'}`}
|
||||
>
|
||||
{STATUS_LABELS[berth.status] ?? berth.status}
|
||||
</span>
|
||||
</div>
|
||||
{berth.area && (
|
||||
<p className="text-muted-foreground mt-1">{berth.area}</p>
|
||||
)}
|
||||
{berth.area && <p className="text-muted-foreground mt-1">{berth.area}</p>}
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2 shrink-0">
|
||||
@@ -200,7 +193,7 @@ export function BerthDetailHeader({ berth }: BerthDetailHeaderProps) {
|
||||
</PermissionGate>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</DetailHeaderStrip>
|
||||
|
||||
<BerthForm berth={berth} open={editOpen} onOpenChange={setEditOpen} />
|
||||
|
||||
|
||||
@@ -17,21 +17,12 @@ export function BerthList() {
|
||||
const router = useRouter();
|
||||
const params = useParams<{ portSlug: string }>();
|
||||
|
||||
const {
|
||||
data,
|
||||
pagination,
|
||||
isLoading,
|
||||
sort,
|
||||
setSort,
|
||||
filters,
|
||||
setFilter,
|
||||
clearFilters,
|
||||
setPage,
|
||||
} = usePaginatedQuery<BerthRow>({
|
||||
queryKey: ['berths'],
|
||||
endpoint: '/api/v1/berths',
|
||||
filterDefinitions: berthFilterDefinitions,
|
||||
});
|
||||
const { data, pagination, isLoading, sort, setSort, filters, setFilter, clearFilters, setPage } =
|
||||
usePaginatedQuery<BerthRow>({
|
||||
queryKey: ['berths'],
|
||||
endpoint: '/api/v1/berths',
|
||||
filterDefinitions: berthFilterDefinitions,
|
||||
});
|
||||
|
||||
useRealtimeInvalidation({
|
||||
'berth:updated': [['berths']],
|
||||
@@ -43,6 +34,7 @@ export function BerthList() {
|
||||
<PageHeader
|
||||
title="Berths"
|
||||
description="View and manage berth allocations"
|
||||
variant="gradient"
|
||||
// No "New" button — berths are import-only
|
||||
/>
|
||||
|
||||
|
||||
@@ -8,6 +8,7 @@ import { Button } from '@/components/ui/button';
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { TagBadge } from '@/components/shared/tag-badge';
|
||||
import { ArchiveConfirmDialog } from '@/components/shared/archive-confirm-dialog';
|
||||
import { DetailHeaderStrip } from '@/components/shared/detail-header-strip';
|
||||
import { PortalInviteButton } from '@/components/clients/portal-invite-button';
|
||||
import { apiFetch } from '@/lib/api/client';
|
||||
|
||||
@@ -68,7 +69,7 @@ export function ClientDetailHeader({ client }: ClientDetailHeaderProps) {
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="space-y-3">
|
||||
<DetailHeaderStrip>
|
||||
<div className="flex items-start gap-3 flex-wrap">
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center gap-2 flex-wrap">
|
||||
@@ -140,7 +141,7 @@ export function ClientDetailHeader({ client }: ClientDetailHeaderProps) {
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</DetailHeaderStrip>
|
||||
|
||||
<ArchiveConfirmDialog
|
||||
open={archiveOpen}
|
||||
|
||||
@@ -56,8 +56,7 @@ export function ClientList() {
|
||||
});
|
||||
|
||||
const archiveMutation = useMutation({
|
||||
mutationFn: (id: string) =>
|
||||
apiFetch(`/api/v1/clients/${id}`, { method: 'DELETE' }),
|
||||
mutationFn: (id: string) => apiFetch(`/api/v1/clients/${id}`, { method: 'DELETE' }),
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['clients'] });
|
||||
setArchiveClient(null);
|
||||
@@ -75,6 +74,7 @@ export function ClientList() {
|
||||
<PageHeader
|
||||
title="Clients"
|
||||
description="Manage your client records"
|
||||
variant="gradient"
|
||||
actions={
|
||||
<PermissionGate resource="clients" action="create">
|
||||
<Button size="sm" onClick={() => setCreateOpen(true)}>
|
||||
@@ -128,10 +128,7 @@ export function ClientList() {
|
||||
/>
|
||||
)}
|
||||
|
||||
<ClientForm
|
||||
open={createOpen}
|
||||
onOpenChange={setCreateOpen}
|
||||
/>
|
||||
<ClientForm open={createOpen} onOpenChange={setCreateOpen} />
|
||||
|
||||
{editClient && (
|
||||
<ClientForm
|
||||
|
||||
@@ -9,6 +9,7 @@ import { toast } from 'sonner';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { ArchiveConfirmDialog } from '@/components/shared/archive-confirm-dialog';
|
||||
import { DetailHeaderStrip } from '@/components/shared/detail-header-strip';
|
||||
import { PermissionGate } from '@/components/shared/permission-gate';
|
||||
import { CompanyForm } from '@/components/companies/company-form';
|
||||
import { apiFetch } from '@/lib/api/client';
|
||||
@@ -74,7 +75,7 @@ export function CompanyDetailHeader({ company }: CompanyDetailHeaderProps) {
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="space-y-3">
|
||||
<DetailHeaderStrip>
|
||||
<div className="flex items-start gap-3 flex-wrap">
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center gap-2 flex-wrap">
|
||||
@@ -118,7 +119,7 @@ export function CompanyDetailHeader({ company }: CompanyDetailHeaderProps) {
|
||||
</PermissionGate>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</DetailHeaderStrip>
|
||||
|
||||
<CompanyForm
|
||||
open={editOpen}
|
||||
|
||||
@@ -73,6 +73,7 @@ export function CompanyList() {
|
||||
<PageHeader
|
||||
title="Companies"
|
||||
description="Manage company records"
|
||||
variant="gradient"
|
||||
actions={
|
||||
<PermissionGate resource="companies" action="create">
|
||||
<Button size="sm" onClick={() => setCreateOpen(true)}>
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
'use client';
|
||||
|
||||
import { useRealtimeInvalidation } from '@/hooks/use-realtime-invalidation';
|
||||
import { PageHeader } from '@/components/shared/page-header';
|
||||
import { KpiCardsWithBoundary } from './kpi-cards';
|
||||
import { PipelineChart } from './pipeline-chart';
|
||||
import { RevenueForecast } from './revenue-forecast';
|
||||
@@ -8,13 +9,27 @@ import { ActivityFeed } from './activity-feed';
|
||||
|
||||
export function DashboardShell() {
|
||||
useRealtimeInvalidation({
|
||||
'interest:stageChanged': [['dashboard', 'pipeline'], ['dashboard', 'forecast']],
|
||||
'interest:stageChanged': [
|
||||
['dashboard', 'pipeline'],
|
||||
['dashboard', 'forecast'],
|
||||
],
|
||||
'client:created': [['dashboard', 'kpis']],
|
||||
'berth:statusChanged': [['dashboard', 'kpis'], ['dashboard', 'forecast']],
|
||||
'berth:statusChanged': [
|
||||
['dashboard', 'kpis'],
|
||||
['dashboard', 'forecast'],
|
||||
],
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<PageHeader
|
||||
title="Dashboard"
|
||||
eyebrow="Overview"
|
||||
description="Live snapshot of your marina activity"
|
||||
kpiLine={<span>Last 30 days</span>}
|
||||
variant="gradient"
|
||||
/>
|
||||
|
||||
{/* Row 1: KPI cards */}
|
||||
<div className="grid gap-4 grid-cols-1 sm:grid-cols-2 lg:grid-cols-4">
|
||||
<KpiCardsWithBoundary />
|
||||
|
||||
@@ -1,11 +1,10 @@
|
||||
'use client';
|
||||
|
||||
import { useQuery } from '@tanstack/react-query';
|
||||
import { DollarSign, LayoutGrid, TrendingUp, Users } from 'lucide-react';
|
||||
|
||||
import { apiFetch } from '@/lib/api/client';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { CardSkeleton } from '@/components/shared/loading-skeleton';
|
||||
import { KPITile } from '@/components/ui/kpi-tile';
|
||||
import { Skeleton } from '@/components/ui/skeleton';
|
||||
import { WidgetErrorBoundary } from './widget-error-boundary';
|
||||
|
||||
interface KpiData {
|
||||
@@ -27,6 +26,17 @@ function formatPercent(value: number): string {
|
||||
return `${value.toFixed(1)}%`;
|
||||
}
|
||||
|
||||
function KpiTileSkeleton() {
|
||||
return (
|
||||
<div className="relative overflow-hidden rounded-xl border border-border bg-card p-5 shadow-sm">
|
||||
<div className="absolute inset-x-0 top-0 h-1 bg-muted" aria-hidden />
|
||||
<Skeleton className="h-3 w-24" />
|
||||
<Skeleton className="mt-3 h-7 w-32" />
|
||||
<Skeleton className="mt-2 h-3 w-12" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function KpiCards() {
|
||||
const { data, isLoading, isError } = useQuery<KpiData>({
|
||||
queryKey: ['dashboard', 'kpis'],
|
||||
@@ -38,52 +48,45 @@ export function KpiCards() {
|
||||
if (isLoading) {
|
||||
return (
|
||||
<>
|
||||
<CardSkeleton />
|
||||
<CardSkeleton />
|
||||
<CardSkeleton />
|
||||
<CardSkeleton />
|
||||
<KpiTileSkeleton />
|
||||
<KpiTileSkeleton />
|
||||
<KpiTileSkeleton />
|
||||
<KpiTileSkeleton />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
const kpis = [
|
||||
const kpis: Array<{
|
||||
label: string;
|
||||
value: string;
|
||||
accent: 'brand' | 'success' | 'warning' | 'mint' | 'teal' | 'purple';
|
||||
}> = [
|
||||
{
|
||||
label: 'Total Clients',
|
||||
value: isError ? '—' : String(data?.totalClients ?? 0),
|
||||
icon: Users,
|
||||
accent: 'brand',
|
||||
},
|
||||
{
|
||||
label: 'Active Interests',
|
||||
value: isError ? '—' : String(data?.activeInterests ?? 0),
|
||||
icon: TrendingUp,
|
||||
accent: 'teal',
|
||||
},
|
||||
{
|
||||
label: 'Pipeline Value',
|
||||
value: isError ? '—' : formatCurrency(data?.pipelineValueUsd ?? 0),
|
||||
icon: DollarSign,
|
||||
accent: 'success',
|
||||
},
|
||||
{
|
||||
label: 'Occupancy Rate',
|
||||
value: isError ? '—' : formatPercent(data?.occupancyRate ?? 0),
|
||||
icon: LayoutGrid,
|
||||
accent: 'purple',
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<>
|
||||
{kpis.map(({ label, value, icon: Icon }) => (
|
||||
<Card key={label}>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
||||
<CardTitle className="text-sm font-medium text-muted-foreground">
|
||||
{label}
|
||||
</CardTitle>
|
||||
<Icon className="h-4 w-4 text-muted-foreground" />
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-2xl font-bold">{value}</div>
|
||||
<div className="mt-1 h-1 w-8 rounded-full bg-muted" />
|
||||
</CardContent>
|
||||
</Card>
|
||||
{kpis.map(({ label, value, accent }) => (
|
||||
<KPITile key={label} title={label} value={value} accent={accent} />
|
||||
))}
|
||||
</>
|
||||
);
|
||||
|
||||
424
src/components/documents/create-document-wizard.tsx
Normal file
424
src/components/documents/create-document-wizard.tsx
Normal file
@@ -0,0 +1,424 @@
|
||||
'use client';
|
||||
|
||||
import { useState } from 'react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import Link from 'next/link';
|
||||
import { ArrowLeft, Plus, Trash2 } from 'lucide-react';
|
||||
import { toast } from 'sonner';
|
||||
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from '@/components/ui/select';
|
||||
import { PageHeader } from '@/components/shared/page-header';
|
||||
import { apiFetch } from '@/lib/api/client';
|
||||
import { DOCUMENT_TYPES } from '@/lib/constants';
|
||||
|
||||
const SIGNER_ROLES = ['client', 'sales', 'approver', 'developer', 'other'] as const;
|
||||
|
||||
const SUBJECT_TYPES = [
|
||||
{ key: 'interest', label: 'Interest', field: 'interestId' as const },
|
||||
{ key: 'reservation', label: 'Reservation', field: 'reservationId' as const },
|
||||
{ key: 'client', label: 'Client', field: 'clientId' as const },
|
||||
{ key: 'company', label: 'Company', field: 'companyId' as const },
|
||||
{ key: 'yacht', label: 'Yacht', field: 'yachtId' as const },
|
||||
] as const;
|
||||
|
||||
interface SignerRow {
|
||||
signerName: string;
|
||||
signerEmail: string;
|
||||
signerRole: (typeof SIGNER_ROLES)[number];
|
||||
signingOrder: number;
|
||||
}
|
||||
|
||||
interface CreateDocumentWizardProps {
|
||||
portSlug: string;
|
||||
}
|
||||
|
||||
export function CreateDocumentWizard({ portSlug }: CreateDocumentWizardProps) {
|
||||
const router = useRouter();
|
||||
|
||||
const [source, setSource] = useState<'template' | 'upload'>('template');
|
||||
const [pathway, setPathway] = useState<'documenso-template' | 'inapp' | 'upload'>(
|
||||
'documenso-template',
|
||||
);
|
||||
const [templateId, setTemplateId] = useState('');
|
||||
const [uploadedFileId, setUploadedFileId] = useState('');
|
||||
const [documentType, setDocumentType] = useState<(typeof DOCUMENT_TYPES)[number]>('eoi');
|
||||
const [title, setTitle] = useState('');
|
||||
const [notes, setNotes] = useState('');
|
||||
|
||||
const [subjectType, setSubjectType] = useState<(typeof SUBJECT_TYPES)[number]['key']>('interest');
|
||||
const [subjectId, setSubjectId] = useState('');
|
||||
|
||||
const [signers, setSigners] = useState<SignerRow[]>([
|
||||
{ signerName: '', signerEmail: '', signerRole: 'client', signingOrder: 1 },
|
||||
]);
|
||||
const [signingMode, setSigningMode] = useState<'sequential' | 'parallel'>('sequential');
|
||||
|
||||
const [reminderMode, setReminderMode] = useState<'default' | 'override' | 'disabled'>('default');
|
||||
const [reminderDays, setReminderDays] = useState(7);
|
||||
|
||||
const [submitting, setSubmitting] = useState(false);
|
||||
|
||||
const subjectField = SUBJECT_TYPES.find((s) => s.key === subjectType)!.field;
|
||||
|
||||
const setSourceAndPathway = (next: 'template' | 'upload'): void => {
|
||||
setSource(next);
|
||||
if (next === 'upload') {
|
||||
setPathway('upload');
|
||||
} else if (pathway === 'upload') {
|
||||
setPathway('documenso-template');
|
||||
}
|
||||
};
|
||||
|
||||
const updateSigner = (idx: number, patch: Partial<SignerRow>): void => {
|
||||
setSigners((current) => current.map((s, i) => (i === idx ? { ...s, ...patch } : s)));
|
||||
};
|
||||
|
||||
const addSigner = (): void => {
|
||||
setSigners((current) => [
|
||||
...current,
|
||||
{
|
||||
signerName: '',
|
||||
signerEmail: '',
|
||||
signerRole: 'other',
|
||||
signingOrder: current.length + 1,
|
||||
},
|
||||
]);
|
||||
};
|
||||
|
||||
const removeSigner = (idx: number): void => {
|
||||
setSigners((current) =>
|
||||
current.filter((_, i) => i !== idx).map((s, i) => ({ ...s, signingOrder: i + 1 })),
|
||||
);
|
||||
};
|
||||
|
||||
const handleSubmit = async (): Promise<void> => {
|
||||
if (!title.trim()) {
|
||||
toast.error('Title is required');
|
||||
return;
|
||||
}
|
||||
if (!subjectId.trim()) {
|
||||
toast.error(`Provide a ${subjectType} id`);
|
||||
return;
|
||||
}
|
||||
if (source === 'template' && !templateId.trim()) {
|
||||
toast.error('Pick a template');
|
||||
return;
|
||||
}
|
||||
if (source === 'upload' && !uploadedFileId.trim()) {
|
||||
toast.error('Provide an uploaded file id');
|
||||
return;
|
||||
}
|
||||
const cleanSigners = signers.filter((s) => s.signerEmail.trim() && s.signerName.trim());
|
||||
if (source === 'upload' && cleanSigners.length === 0) {
|
||||
toast.error('Upload path requires at least one signer');
|
||||
return;
|
||||
}
|
||||
|
||||
setSubmitting(true);
|
||||
try {
|
||||
const body: Record<string, unknown> = {
|
||||
source,
|
||||
pathway,
|
||||
documentType,
|
||||
title: title.trim(),
|
||||
notes: notes.trim() || undefined,
|
||||
[subjectField]: subjectId.trim(),
|
||||
signingMode,
|
||||
watchers: [],
|
||||
autoPlaceFields: true,
|
||||
sendImmediately: false,
|
||||
remindersDisabled: reminderMode === 'disabled',
|
||||
};
|
||||
|
||||
if (source === 'template') body.templateId = templateId.trim();
|
||||
if (source === 'upload') {
|
||||
body.uploadedFileId = uploadedFileId.trim();
|
||||
body.signers = cleanSigners;
|
||||
} else if (cleanSigners.length > 0) {
|
||||
body.signers = cleanSigners;
|
||||
}
|
||||
|
||||
if (reminderMode === 'override') {
|
||||
body.reminderCadenceOverride = reminderDays;
|
||||
}
|
||||
|
||||
const res = await apiFetch<{ data: { id: string } }>('/api/v1/documents/wizard', {
|
||||
method: 'POST',
|
||||
body,
|
||||
});
|
||||
toast.success('Document created');
|
||||
router.push(`/${portSlug}/documents/${res.data.id}`);
|
||||
} catch (err) {
|
||||
toast.error(err instanceof Error ? err.message : 'Failed to create document');
|
||||
setSubmitting(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<PageHeader
|
||||
title="New document"
|
||||
description="Generate, attach, and send a document for signing."
|
||||
actions={
|
||||
<Button asChild variant="outline">
|
||||
<Link href={`/${portSlug}/documents`}>
|
||||
<ArrowLeft className="mr-1.5 h-4 w-4" /> Back
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
|
||||
<div className="grid gap-4 lg:grid-cols-2">
|
||||
<section className="rounded-md border bg-white p-4">
|
||||
<h2 className="mb-3 text-sm font-semibold uppercase tracking-wide text-muted-foreground">
|
||||
Source
|
||||
</h2>
|
||||
<div className="flex flex-col gap-3 text-sm">
|
||||
<label className="flex items-center gap-2">
|
||||
<input
|
||||
type="radio"
|
||||
checked={source === 'template'}
|
||||
onChange={() => setSourceAndPathway('template')}
|
||||
/>
|
||||
<span>Generate from a template</span>
|
||||
</label>
|
||||
<label className="flex items-center gap-2">
|
||||
<input
|
||||
type="radio"
|
||||
checked={source === 'upload'}
|
||||
onChange={() => setSourceAndPathway('upload')}
|
||||
/>
|
||||
<span>Upload a finished PDF</span>
|
||||
</label>
|
||||
|
||||
{source === 'template' ? (
|
||||
<>
|
||||
<div className="mt-2 flex flex-col gap-2">
|
||||
<Label className="text-xs">Pathway</Label>
|
||||
<Select value={pathway} onValueChange={(v) => setPathway(v as typeof pathway)}>
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="documenso-template">Documenso renders + signs</SelectItem>
|
||||
<SelectItem value="inapp">Render in CRM, sign via Documenso</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Label className="text-xs">Template id</Label>
|
||||
<Input
|
||||
value={templateId}
|
||||
onChange={(e) => setTemplateId(e.target.value)}
|
||||
placeholder="Template UUID"
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<div className="flex flex-col gap-2">
|
||||
<Label className="text-xs">Uploaded file id</Label>
|
||||
<Input
|
||||
value={uploadedFileId}
|
||||
onChange={(e) => setUploadedFileId(e.target.value)}
|
||||
placeholder="File UUID from /api/v1/files upload"
|
||||
/>
|
||||
<p className="text-xs text-muted-foreground">
|
||||
Upload via the existing file uploader, then paste the returned id here.
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="rounded-md border bg-white p-4">
|
||||
<h2 className="mb-3 text-sm font-semibold uppercase tracking-wide text-muted-foreground">
|
||||
Document
|
||||
</h2>
|
||||
<div className="flex flex-col gap-3 text-sm">
|
||||
<div className="flex flex-col gap-2">
|
||||
<Label className="text-xs">Type</Label>
|
||||
<Select
|
||||
value={documentType}
|
||||
onValueChange={(v) => setDocumentType(v as typeof documentType)}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{DOCUMENT_TYPES.map((t) => (
|
||||
<SelectItem key={t} value={t}>
|
||||
{t.replace(/_/g, ' ')}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Label className="text-xs">Title</Label>
|
||||
<Input value={title} onChange={(e) => setTitle(e.target.value)} />
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Label className="text-xs">Internal notes</Label>
|
||||
<Input value={notes} onChange={(e) => setNotes(e.target.value)} />
|
||||
</div>
|
||||
<div className="grid grid-cols-[max-content_1fr] gap-2">
|
||||
<Select
|
||||
value={subjectType}
|
||||
onValueChange={(v) => setSubjectType(v as typeof subjectType)}
|
||||
>
|
||||
<SelectTrigger className="w-32">
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{SUBJECT_TYPES.map((s) => (
|
||||
<SelectItem key={s.key} value={s.key}>
|
||||
{s.label}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<Input
|
||||
value={subjectId}
|
||||
onChange={(e) => setSubjectId(e.target.value)}
|
||||
placeholder={`${subjectType} id`}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="rounded-md border bg-white p-4 lg:col-span-2">
|
||||
<div className="mb-3 flex items-center justify-between">
|
||||
<h2 className="text-sm font-semibold uppercase tracking-wide text-muted-foreground">
|
||||
Signers
|
||||
</h2>
|
||||
<Button size="sm" variant="outline" onClick={addSigner}>
|
||||
<Plus className="mr-1.5 h-3.5 w-3.5" /> Add signer
|
||||
</Button>
|
||||
</div>
|
||||
<ul className="space-y-2">
|
||||
{signers.map((s, idx) => (
|
||||
<li
|
||||
key={idx}
|
||||
className="grid grid-cols-[2.5rem_1fr_1fr_8rem_2rem] items-center gap-2 text-sm"
|
||||
>
|
||||
<span className="text-xs tabular-nums text-muted-foreground">
|
||||
#{s.signingOrder}
|
||||
</span>
|
||||
<Input
|
||||
value={s.signerName}
|
||||
onChange={(e) => updateSigner(idx, { signerName: e.target.value })}
|
||||
placeholder="Name"
|
||||
/>
|
||||
<Input
|
||||
value={s.signerEmail}
|
||||
onChange={(e) => updateSigner(idx, { signerEmail: e.target.value })}
|
||||
placeholder="Email"
|
||||
/>
|
||||
<Select
|
||||
value={s.signerRole}
|
||||
onValueChange={(v) =>
|
||||
updateSigner(idx, { signerRole: v as SignerRow['signerRole'] })
|
||||
}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{SIGNER_ROLES.map((r) => (
|
||||
<SelectItem key={r} value={r}>
|
||||
{r}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<button
|
||||
type="button"
|
||||
aria-label="Remove signer"
|
||||
onClick={() => removeSigner(idx)}
|
||||
className="text-muted-foreground hover:text-destructive"
|
||||
>
|
||||
<Trash2 className="h-3.5 w-3.5" />
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
<div className="mt-3 flex items-center gap-3 text-xs text-muted-foreground">
|
||||
<Label className="text-xs">Signing mode</Label>
|
||||
<Select
|
||||
value={signingMode}
|
||||
onValueChange={(v) => setSigningMode(v as typeof signingMode)}
|
||||
>
|
||||
<SelectTrigger className="w-40">
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="sequential">Sequential</SelectItem>
|
||||
<SelectItem value="parallel">Parallel</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="rounded-md border bg-white p-4 lg:col-span-2">
|
||||
<h2 className="mb-3 text-sm font-semibold uppercase tracking-wide text-muted-foreground">
|
||||
Reminders
|
||||
</h2>
|
||||
<div className="flex flex-col gap-2 text-sm">
|
||||
<label className="flex items-center gap-2">
|
||||
<input
|
||||
type="radio"
|
||||
checked={reminderMode === 'default'}
|
||||
onChange={() => setReminderMode('default')}
|
||||
/>
|
||||
Use template default
|
||||
</label>
|
||||
<label className="flex items-center gap-2">
|
||||
<input
|
||||
type="radio"
|
||||
checked={reminderMode === 'override'}
|
||||
onChange={() => setReminderMode('override')}
|
||||
/>
|
||||
Override:
|
||||
<Input
|
||||
type="number"
|
||||
className="ml-1 w-20"
|
||||
min={1}
|
||||
max={365}
|
||||
value={reminderDays}
|
||||
onChange={(e) => setReminderDays(Number(e.target.value))}
|
||||
onFocus={() => setReminderMode('override')}
|
||||
/>
|
||||
days
|
||||
</label>
|
||||
<label className="flex items-center gap-2">
|
||||
<input
|
||||
type="radio"
|
||||
checked={reminderMode === 'disabled'}
|
||||
onChange={() => setReminderMode('disabled')}
|
||||
/>
|
||||
Disable reminders for this document
|
||||
</label>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-end gap-2">
|
||||
<Button variant="outline" asChild>
|
||||
<Link href={`/${portSlug}/documents`}>Cancel</Link>
|
||||
</Button>
|
||||
<Button onClick={handleSubmit} disabled={submitting}>
|
||||
{submitting ? 'Creating…' : 'Create document'}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
400
src/components/documents/document-detail.tsx
Normal file
400
src/components/documents/document-detail.tsx
Normal file
@@ -0,0 +1,400 @@
|
||||
'use client';
|
||||
|
||||
import { useState } from 'react';
|
||||
import Link from 'next/link';
|
||||
import type { Route } from 'next';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useQuery, useQueryClient } from '@tanstack/react-query';
|
||||
import { ArrowLeft, Bell, Download, Mail, Trash2, X } from 'lucide-react';
|
||||
import { toast } from 'sonner';
|
||||
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { PageHeader } from '@/components/shared/page-header';
|
||||
import { StatusPill, type StatusPillStatus } from '@/components/ui/status-pill';
|
||||
import { useRealtimeInvalidation } from '@/hooks/use-realtime-invalidation';
|
||||
import { apiFetch } from '@/lib/api/client';
|
||||
|
||||
interface DetailDoc {
|
||||
id: string;
|
||||
title: string;
|
||||
status: string;
|
||||
documentType: string;
|
||||
documensoId: string | null;
|
||||
signedFileId: string | null;
|
||||
reservationId: string | null;
|
||||
interestId: string | null;
|
||||
clientId: string | null;
|
||||
yachtId: string | null;
|
||||
companyId: string | null;
|
||||
createdAt: string;
|
||||
createdBy: string;
|
||||
}
|
||||
|
||||
interface DetailSigner {
|
||||
id: string;
|
||||
signerName: string;
|
||||
signerEmail: string;
|
||||
signerRole: string;
|
||||
signingOrder: number;
|
||||
status: string;
|
||||
signedAt: string | null;
|
||||
signingUrl: string | null;
|
||||
}
|
||||
|
||||
interface DetailEvent {
|
||||
id: string;
|
||||
eventType: string;
|
||||
createdAt: string;
|
||||
signerId: string | null;
|
||||
eventData: Record<string, unknown> | null;
|
||||
}
|
||||
|
||||
interface DetailWatcher {
|
||||
userId: string;
|
||||
addedBy: string;
|
||||
addedAt: string;
|
||||
}
|
||||
|
||||
interface DetailResponse {
|
||||
data: {
|
||||
document: DetailDoc;
|
||||
signers: DetailSigner[];
|
||||
events: DetailEvent[];
|
||||
watchers: DetailWatcher[];
|
||||
};
|
||||
}
|
||||
|
||||
const STATUS_PILL_MAP: Record<string, StatusPillStatus> = {
|
||||
draft: 'draft',
|
||||
sent: 'sent',
|
||||
partially_signed: 'partial',
|
||||
completed: 'completed',
|
||||
signed: 'signed',
|
||||
expired: 'expired',
|
||||
cancelled: 'cancelled',
|
||||
rejected: 'rejected',
|
||||
pending: 'pending',
|
||||
declined: 'declined',
|
||||
};
|
||||
|
||||
const SIGNER_PILL_MAP: Record<string, StatusPillStatus> = {
|
||||
pending: 'pending',
|
||||
signed: 'signed',
|
||||
declined: 'declined',
|
||||
};
|
||||
|
||||
interface DocumentDetailProps {
|
||||
documentId: string;
|
||||
portSlug: string;
|
||||
}
|
||||
|
||||
export function DocumentDetail({ documentId, portSlug }: DocumentDetailProps) {
|
||||
const router = useRouter();
|
||||
const queryClient = useQueryClient();
|
||||
const [isCancelling, setIsCancelling] = useState(false);
|
||||
|
||||
const { data, isLoading, error } = useQuery<DetailResponse>({
|
||||
queryKey: ['document-detail', documentId],
|
||||
queryFn: () => apiFetch<DetailResponse>(`/api/v1/documents/${documentId}?detail=true`),
|
||||
});
|
||||
|
||||
useRealtimeInvalidation({
|
||||
'document:updated': [['document-detail', documentId]],
|
||||
'document:sent': [['document-detail', documentId]],
|
||||
'document:completed': [['document-detail', documentId]],
|
||||
'document:cancelled': [['document-detail', documentId]],
|
||||
'document:rejected': [['document-detail', documentId]],
|
||||
'document:expired': [['document-detail', documentId]],
|
||||
'document:signer:signed': [['document-detail', documentId]],
|
||||
'document:signer:opened': [['document-detail', documentId]],
|
||||
});
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<div className="h-24 animate-pulse rounded-xl bg-muted/40" />
|
||||
<div className="grid gap-4 lg:grid-cols-[2fr_1fr]">
|
||||
<div className="h-64 animate-pulse rounded-md bg-muted/40" />
|
||||
<div className="h-64 animate-pulse rounded-md bg-muted/40" />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (error || !data) {
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<PageHeader
|
||||
title="Document not found"
|
||||
description="This document was deleted or you don't have access to it."
|
||||
actions={
|
||||
<Button asChild variant="outline">
|
||||
<Link href={`/${portSlug}/documents`}>
|
||||
<ArrowLeft className="mr-1.5 h-4 w-4" />
|
||||
Back to documents
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const { document: doc, signers, events, watchers } = data.data;
|
||||
|
||||
const handleRemind = async (signerId: string) => {
|
||||
try {
|
||||
await apiFetch(`/api/v1/documents/${documentId}/remind`, {
|
||||
method: 'POST',
|
||||
body: { signerId },
|
||||
});
|
||||
toast.success('Reminder sent');
|
||||
queryClient.invalidateQueries({ queryKey: ['document-detail', documentId] });
|
||||
} catch (err) {
|
||||
toast.error(err instanceof Error ? err.message : 'Failed to send reminder');
|
||||
}
|
||||
};
|
||||
|
||||
const handleCancel = async () => {
|
||||
if (!confirm('Cancel this document? This voids it in Documenso and cannot be undone.')) return;
|
||||
setIsCancelling(true);
|
||||
try {
|
||||
await apiFetch(`/api/v1/documents/${documentId}/cancel`, { method: 'POST' });
|
||||
toast.success('Document cancelled');
|
||||
router.push(`/${portSlug}/documents`);
|
||||
} catch (err) {
|
||||
toast.error(err instanceof Error ? err.message : 'Cancel failed');
|
||||
setIsCancelling(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleEmailSignedPdf = async () => {
|
||||
try {
|
||||
const draft = await apiFetch<{
|
||||
data: { to: string[]; subject: string; attachments: Array<{ fileId: string }> };
|
||||
}>(`/api/v1/documents/${documentId}/compose-completion-email`, { method: 'POST' });
|
||||
toast.info(
|
||||
`Email composer prepared for ${draft.data.to.length} signer${draft.data.to.length === 1 ? '' : 's'} — opens in PR8 wizard`,
|
||||
);
|
||||
} catch (err) {
|
||||
toast.error(err instanceof Error ? err.message : 'Failed to prepare email');
|
||||
}
|
||||
};
|
||||
|
||||
const isInFlight = ['sent', 'partially_signed'].includes(doc.status);
|
||||
const isComplete = ['completed', 'signed'].includes(doc.status);
|
||||
|
||||
const subjectLink = doc.reservationId
|
||||
? { href: `/${portSlug}/berth-reservations/${doc.reservationId}`, label: 'Reservation' }
|
||||
: doc.interestId
|
||||
? { href: `/${portSlug}/interests/${doc.interestId}`, label: 'Interest' }
|
||||
: doc.clientId
|
||||
? { href: `/${portSlug}/clients/${doc.clientId}`, label: 'Client' }
|
||||
: doc.yachtId
|
||||
? { href: `/${portSlug}/yachts/${doc.yachtId}`, label: 'Yacht' }
|
||||
: doc.companyId
|
||||
? { href: `/${portSlug}/companies/${doc.companyId}`, label: 'Company' }
|
||||
: null;
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<PageHeader
|
||||
eyebrow={doc.documentType.replace(/_/g, ' ')}
|
||||
title={doc.title}
|
||||
description={`Created ${new Date(doc.createdAt).toLocaleDateString('en-GB')}`}
|
||||
kpiLine={
|
||||
<>
|
||||
<StatusPill status={STATUS_PILL_MAP[doc.status] ?? 'pending'} withDot>
|
||||
{doc.status.replace(/_/g, ' ')}
|
||||
</StatusPill>
|
||||
<span>
|
||||
{signers.filter((s) => s.status === 'signed').length}/{signers.length} signed
|
||||
</span>
|
||||
{watchers.length > 0 ? <span>{watchers.length} watching</span> : null}
|
||||
</>
|
||||
}
|
||||
actions={
|
||||
<div className="flex items-center gap-2">
|
||||
<Button asChild variant="outline" size="sm">
|
||||
<Link href={`/${portSlug}/documents`}>
|
||||
<ArrowLeft className="mr-1.5 h-4 w-4" /> Back
|
||||
</Link>
|
||||
</Button>
|
||||
{isComplete && doc.signedFileId ? (
|
||||
<>
|
||||
<Button asChild size="sm">
|
||||
<Link href={`/api/v1/files/${doc.signedFileId}/download`}>
|
||||
<Download className="mr-1.5 h-4 w-4" /> Download signed PDF
|
||||
</Link>
|
||||
</Button>
|
||||
<Button size="sm" variant="outline" onClick={handleEmailSignedPdf}>
|
||||
<Mail className="mr-1.5 h-4 w-4" /> Email signatories
|
||||
</Button>
|
||||
</>
|
||||
) : null}
|
||||
{isInFlight ? (
|
||||
<Button size="sm" variant="outline" onClick={handleCancel} disabled={isCancelling}>
|
||||
<X className="mr-1.5 h-4 w-4" /> Cancel
|
||||
</Button>
|
||||
) : null}
|
||||
</div>
|
||||
}
|
||||
variant="gradient"
|
||||
/>
|
||||
|
||||
<div className="grid gap-4 lg:grid-cols-[2fr_1fr]">
|
||||
{/* Left column */}
|
||||
<div className="flex flex-col gap-4">
|
||||
<section className="rounded-md border bg-white p-4">
|
||||
<h2 className="mb-3 text-sm font-semibold uppercase tracking-wide text-muted-foreground">
|
||||
Signers
|
||||
</h2>
|
||||
{signers.length === 0 ? (
|
||||
<p className="text-sm text-muted-foreground">No signers attached.</p>
|
||||
) : (
|
||||
<ul className="space-y-3">
|
||||
{signers.map((signer, idx) => (
|
||||
<li
|
||||
key={signer.id}
|
||||
className="flex items-start gap-3 rounded-md border bg-white p-3 shadow-xs transition-colors hover:bg-muted/30"
|
||||
>
|
||||
<div
|
||||
className={`flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-xs font-semibold ${
|
||||
signer.status === 'signed'
|
||||
? 'bg-success-bg text-success'
|
||||
: signer.status === 'declined'
|
||||
? 'bg-error-bg text-error'
|
||||
: 'bg-slate-100 text-slate-600'
|
||||
}`}
|
||||
>
|
||||
{idx + 1}
|
||||
</div>
|
||||
<div className="min-w-0 flex-1">
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<div className="font-medium text-foreground">{signer.signerName}</div>
|
||||
<StatusPill status={SIGNER_PILL_MAP[signer.status] ?? 'pending'}>
|
||||
{signer.status}
|
||||
</StatusPill>
|
||||
</div>
|
||||
<div className="text-xs text-muted-foreground">
|
||||
{signer.signerEmail} · {signer.signerRole}
|
||||
</div>
|
||||
<div className="mt-1 text-xs text-muted-foreground">
|
||||
{signer.signedAt
|
||||
? `Signed ${new Date(signer.signedAt).toLocaleDateString('en-GB')}`
|
||||
: 'Pending'}
|
||||
</div>
|
||||
{signer.status === 'pending' && doc.documensoId && isInFlight ? (
|
||||
<div className="mt-2 flex items-center gap-2">
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
onClick={() => handleRemind(signer.id)}
|
||||
>
|
||||
<Bell className="mr-1.5 h-3 w-3" /> Remind
|
||||
</Button>
|
||||
{signer.signingUrl ? (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
navigator.clipboard.writeText(signer.signingUrl!);
|
||||
toast.success('Signing link copied');
|
||||
}}
|
||||
className="text-xs text-brand hover:underline"
|
||||
>
|
||||
Copy signing link
|
||||
</button>
|
||||
) : null}
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</section>
|
||||
|
||||
{subjectLink ? (
|
||||
<section className="rounded-md border bg-white p-4">
|
||||
<h2 className="mb-2 text-sm font-semibold uppercase tracking-wide text-muted-foreground">
|
||||
Linked entity
|
||||
</h2>
|
||||
<Link
|
||||
href={subjectLink.href as Route}
|
||||
className="text-sm font-medium text-brand hover:underline"
|
||||
>
|
||||
{subjectLink.label} →
|
||||
</Link>
|
||||
</section>
|
||||
) : null}
|
||||
</div>
|
||||
|
||||
{/* Right column */}
|
||||
<div className="flex flex-col gap-4">
|
||||
<section className="rounded-md border bg-white p-4">
|
||||
<h2 className="mb-2 text-sm font-semibold uppercase tracking-wide text-muted-foreground">
|
||||
Watchers
|
||||
</h2>
|
||||
{watchers.length === 0 ? (
|
||||
<p className="text-xs text-muted-foreground">No one is watching this document yet.</p>
|
||||
) : (
|
||||
<ul className="space-y-1">
|
||||
{watchers.map((w) => (
|
||||
<li key={w.userId} className="flex items-center justify-between text-sm">
|
||||
<span className="truncate font-mono text-xs text-muted-foreground">
|
||||
{w.userId.slice(0, 8)}…
|
||||
</span>
|
||||
<button
|
||||
type="button"
|
||||
aria-label="Remove watcher"
|
||||
onClick={async () => {
|
||||
try {
|
||||
await apiFetch(`/api/v1/documents/${documentId}/watchers/${w.userId}`, {
|
||||
method: 'DELETE',
|
||||
});
|
||||
toast.success('Watcher removed');
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ['document-detail', documentId],
|
||||
});
|
||||
} catch (err) {
|
||||
toast.error(
|
||||
err instanceof Error ? err.message : 'Failed to remove watcher',
|
||||
);
|
||||
}
|
||||
}}
|
||||
className="text-muted-foreground hover:text-destructive"
|
||||
>
|
||||
<Trash2 className="h-3.5 w-3.5" />
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</section>
|
||||
|
||||
<section className="rounded-md border bg-white p-4">
|
||||
<h2 className="mb-2 text-sm font-semibold uppercase tracking-wide text-muted-foreground">
|
||||
Activity
|
||||
</h2>
|
||||
{events.length === 0 ? (
|
||||
<p className="text-xs text-muted-foreground">No events yet.</p>
|
||||
) : (
|
||||
<ul className="space-y-2">
|
||||
{events.slice(0, 12).map((e) => (
|
||||
<li key={e.id} className="text-xs">
|
||||
<div className="font-medium text-foreground">
|
||||
{e.eventType.replace(/_/g, ' ')}
|
||||
</div>
|
||||
<div className="text-muted-foreground">
|
||||
{new Date(e.createdAt).toLocaleString('en-GB')}
|
||||
</div>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
313
src/components/documents/documents-hub.tsx
Normal file
313
src/components/documents/documents-hub.tsx
Normal file
@@ -0,0 +1,313 @@
|
||||
'use client';
|
||||
|
||||
import { useMemo, useState } from 'react';
|
||||
import Link from 'next/link';
|
||||
import { useQuery } from '@tanstack/react-query';
|
||||
import { ChevronDown, ChevronRight, FileText, Plus } from 'lucide-react';
|
||||
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from '@/components/ui/select';
|
||||
import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
||||
import { StatusPill, type StatusPillStatus } from '@/components/ui/status-pill';
|
||||
import { EmptyState } from '@/components/ui/empty-state';
|
||||
import { PageHeader } from '@/components/shared/page-header';
|
||||
import { usePaginatedQuery } from '@/hooks/use-paginated-query';
|
||||
import { useRealtimeInvalidation } from '@/hooks/use-realtime-invalidation';
|
||||
import { apiFetch } from '@/lib/api/client';
|
||||
import { cn } from '@/lib/utils';
|
||||
import { documentsHubTabs, type DocumentsHubTab } from '@/lib/validators/documents';
|
||||
|
||||
interface HubDoc {
|
||||
id: string;
|
||||
documentType: string;
|
||||
title: string;
|
||||
status: string;
|
||||
createdAt: string;
|
||||
signers?: Array<{ id: string; signerEmail: string; signerName: string; status: string }>;
|
||||
}
|
||||
|
||||
interface HubCounts {
|
||||
all: number;
|
||||
awaiting_them: number;
|
||||
awaiting_me: number;
|
||||
completed: number;
|
||||
expired: number;
|
||||
}
|
||||
|
||||
const TAB_LABELS: Record<DocumentsHubTab, string> = {
|
||||
all: 'All',
|
||||
awaiting_them: 'Awaiting them',
|
||||
awaiting_me: 'Awaiting me',
|
||||
completed: 'Completed',
|
||||
expired: 'Expired',
|
||||
};
|
||||
|
||||
const TYPE_LABELS: Record<string, string> = {
|
||||
eoi: 'EOI',
|
||||
contract: 'Contract',
|
||||
nda: 'NDA',
|
||||
reservation_agreement: 'Reservation Agreement',
|
||||
welcome_letter: 'Welcome Letter',
|
||||
handover_checklist: 'Handover',
|
||||
acknowledgment: 'Acknowledgment',
|
||||
correspondence: 'Correspondence',
|
||||
other: 'Other',
|
||||
};
|
||||
|
||||
const STATUS_PILL_MAP: Record<string, StatusPillStatus> = {
|
||||
draft: 'draft',
|
||||
sent: 'sent',
|
||||
partially_signed: 'partial',
|
||||
completed: 'completed',
|
||||
signed: 'signed',
|
||||
expired: 'expired',
|
||||
cancelled: 'cancelled',
|
||||
rejected: 'rejected',
|
||||
};
|
||||
|
||||
interface DocumentsHubProps {
|
||||
portSlug: string;
|
||||
}
|
||||
|
||||
export function DocumentsHub({ portSlug }: DocumentsHubProps) {
|
||||
const [tab, setTab] = useState<DocumentsHubTab>('all');
|
||||
const [search, setSearch] = useState('');
|
||||
const [typeFilter, setTypeFilter] = useState<string>('all');
|
||||
const [signatureOnly, setSignatureOnly] = useState(true);
|
||||
const [expandedDocId, setExpandedDocId] = useState<string | null>(null);
|
||||
|
||||
const queryParams = useMemo(() => {
|
||||
const params = new URLSearchParams();
|
||||
params.set('tab', tab);
|
||||
if (search) params.set('search', search);
|
||||
if (typeFilter && typeFilter !== 'all') params.set('documentType', typeFilter);
|
||||
if (signatureOnly) params.set('signatureOnly', 'true');
|
||||
return params;
|
||||
}, [tab, search, typeFilter, signatureOnly]);
|
||||
|
||||
const { data: documents, isLoading } = usePaginatedQuery<HubDoc>({
|
||||
queryKey: ['documents', 'hub', queryParams.toString()],
|
||||
endpoint: `/api/v1/documents?${queryParams.toString()}`,
|
||||
filterDefinitions: [],
|
||||
});
|
||||
|
||||
const { data: countsResp } = useQuery<{ data: HubCounts }>({
|
||||
queryKey: ['documents', 'hub-counts'],
|
||||
queryFn: () => apiFetch<{ data: HubCounts }>('/api/v1/documents/hub-counts'),
|
||||
staleTime: 30_000,
|
||||
});
|
||||
|
||||
useRealtimeInvalidation({
|
||||
'document:created': [['documents']],
|
||||
'document:updated': [['documents']],
|
||||
'document:deleted': [['documents']],
|
||||
'document:sent': [['documents']],
|
||||
'document:completed': [['documents']],
|
||||
'document:expired': [['documents']],
|
||||
'document:cancelled': [['documents']],
|
||||
'document:rejected': [['documents']],
|
||||
'document:signer:signed': [['documents']],
|
||||
});
|
||||
|
||||
const counts: HubCounts = countsResp?.data ?? {
|
||||
all: 0,
|
||||
awaiting_them: 0,
|
||||
awaiting_me: 0,
|
||||
completed: 0,
|
||||
expired: 0,
|
||||
};
|
||||
|
||||
const renderRow = (doc: HubDoc) => {
|
||||
const expanded = expandedDocId === doc.id;
|
||||
const totalSigners = doc.signers?.length ?? 0;
|
||||
const signedCount = doc.signers?.filter((s) => s.status === 'signed').length ?? 0;
|
||||
const pillStatus = STATUS_PILL_MAP[doc.status] ?? 'pending';
|
||||
|
||||
const isNonSignature = [
|
||||
'welcome_letter',
|
||||
'handover_checklist',
|
||||
'acknowledgment',
|
||||
'correspondence',
|
||||
].includes(doc.documentType);
|
||||
|
||||
return (
|
||||
<li
|
||||
key={doc.id}
|
||||
className="border-b last:border-b-0 transition-colors hover:bg-gradient-brand-soft/40"
|
||||
>
|
||||
<div className="flex flex-wrap items-center gap-x-3 gap-y-1 px-4 py-3 text-sm sm:grid sm:grid-cols-[auto_1fr_auto_auto_auto_auto] sm:gap-3">
|
||||
<button
|
||||
type="button"
|
||||
aria-label={expanded ? 'Collapse signers' : 'Expand signers'}
|
||||
onClick={() => setExpandedDocId(expanded ? null : doc.id)}
|
||||
className="text-muted-foreground transition-transform"
|
||||
>
|
||||
{expanded ? <ChevronDown className="h-4 w-4" /> : <ChevronRight className="h-4 w-4" />}
|
||||
</button>
|
||||
<Link
|
||||
href={`/${portSlug}/documents/${doc.id}`}
|
||||
className="min-w-0 truncate font-medium text-foreground hover:text-brand"
|
||||
>
|
||||
{doc.title}
|
||||
</Link>
|
||||
<span className="text-xs text-muted-foreground">
|
||||
{TYPE_LABELS[doc.documentType] ?? doc.documentType}
|
||||
</span>
|
||||
<StatusPill
|
||||
status={isNonSignature && doc.status === 'sent' ? 'delivered' : pillStatus}
|
||||
withDot
|
||||
>
|
||||
{isNonSignature && doc.status === 'sent' ? 'Delivered' : doc.status.replace(/_/g, ' ')}
|
||||
</StatusPill>
|
||||
<span className="text-xs tabular-nums text-muted-foreground">
|
||||
{totalSigners > 0 ? `${signedCount}/${totalSigners} signed` : '—'}
|
||||
</span>
|
||||
<span className="text-xs text-muted-foreground">
|
||||
{new Date(doc.createdAt).toLocaleDateString('en-GB')}
|
||||
</span>
|
||||
</div>
|
||||
{expanded && doc.signers && doc.signers.length > 0 ? (
|
||||
<div className="border-t bg-muted/30 px-12 py-2">
|
||||
<ul className="space-y-1">
|
||||
{doc.signers.map((signer) => (
|
||||
<li key={signer.id} className="flex items-center justify-between gap-2 text-xs">
|
||||
<div className="flex min-w-0 items-center gap-2">
|
||||
<span className="font-medium text-foreground">{signer.signerName}</span>
|
||||
<span className="truncate text-muted-foreground">{signer.signerEmail}</span>
|
||||
</div>
|
||||
<StatusPill status={STATUS_PILL_MAP[signer.status] ?? 'pending'}>
|
||||
{signer.status}
|
||||
</StatusPill>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
) : null}
|
||||
</li>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<PageHeader
|
||||
title="Documents"
|
||||
description="Track signing status, chase pending signers, and audit completion."
|
||||
kpiLine={
|
||||
<>
|
||||
<span>
|
||||
<strong className="font-semibold text-foreground tabular-nums">{counts.all}</strong>{' '}
|
||||
total
|
||||
</span>
|
||||
<span>
|
||||
<strong className="font-semibold text-foreground tabular-nums">
|
||||
{counts.awaiting_them}
|
||||
</strong>{' '}
|
||||
awaiting signers
|
||||
</span>
|
||||
<span>
|
||||
<strong className="font-semibold text-foreground tabular-nums">
|
||||
{counts.awaiting_me}
|
||||
</strong>{' '}
|
||||
awaiting you
|
||||
</span>
|
||||
</>
|
||||
}
|
||||
actions={
|
||||
<Button asChild>
|
||||
<Link href={`/${portSlug}/documents/new`}>
|
||||
<Plus className="mr-1.5 h-4 w-4" />
|
||||
New document
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
variant="gradient"
|
||||
/>
|
||||
|
||||
<Tabs value={tab} onValueChange={(v) => setTab(v as DocumentsHubTab)}>
|
||||
<TabsList>
|
||||
{documentsHubTabs.map((t) => (
|
||||
<TabsTrigger key={t} value={t}>
|
||||
{TAB_LABELS[t]}
|
||||
{t !== 'all' && counts[t] > 0 ? (
|
||||
<span className="ml-1.5 rounded-full bg-muted px-1.5 py-0.5 text-[0.65rem] text-muted-foreground">
|
||||
{counts[t]}
|
||||
</span>
|
||||
) : null}
|
||||
</TabsTrigger>
|
||||
))}
|
||||
</TabsList>
|
||||
</Tabs>
|
||||
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
<Input
|
||||
placeholder="Search by title…"
|
||||
value={search}
|
||||
onChange={(e) => setSearch(e.target.value)}
|
||||
className="max-w-xs"
|
||||
/>
|
||||
<Select value={typeFilter} onValueChange={setTypeFilter}>
|
||||
<SelectTrigger className="w-44">
|
||||
<SelectValue placeholder="Type" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="all">All types</SelectItem>
|
||||
{Object.entries(TYPE_LABELS).map(([k, v]) => (
|
||||
<SelectItem key={k} value={k}>
|
||||
{v}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setSignatureOnly((v) => !v)}
|
||||
className={cn(
|
||||
'rounded-full border px-3 py-1 text-xs transition-colors',
|
||||
signatureOnly
|
||||
? 'border-brand-200 bg-brand-50 text-brand-700'
|
||||
: 'border-slate-200 bg-white text-muted-foreground',
|
||||
)}
|
||||
>
|
||||
Signature-based only
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{isLoading ? (
|
||||
<ul className="rounded-md border bg-white">
|
||||
{[0, 1, 2, 3, 4].map((i) => (
|
||||
<li key={i} className="h-12 animate-pulse border-b last:border-b-0 bg-muted/40" />
|
||||
))}
|
||||
</ul>
|
||||
) : documents.length === 0 ? (
|
||||
<EmptyState
|
||||
icon={<FileText className="h-7 w-7" />}
|
||||
title={tab === 'all' ? 'No documents yet' : 'No documents match this view'}
|
||||
body={
|
||||
tab === 'all'
|
||||
? 'Create your first document to track signing across signers and watchers.'
|
||||
: 'Try a different tab or clear filters.'
|
||||
}
|
||||
actions={
|
||||
tab === 'all' ? (
|
||||
<Button asChild>
|
||||
<Link href={`/${portSlug}/documents/new`}>
|
||||
<Plus className="mr-1.5 h-4 w-4" />
|
||||
New document
|
||||
</Link>
|
||||
</Button>
|
||||
) : null
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
<ul className="rounded-md border bg-white shadow-xs">{documents.map(renderRow)}</ul>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -9,6 +9,7 @@ import { Button } from '@/components/ui/button';
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { TagBadge } from '@/components/shared/tag-badge';
|
||||
import { ArchiveConfirmDialog } from '@/components/shared/archive-confirm-dialog';
|
||||
import { DetailHeaderStrip } from '@/components/shared/detail-header-strip';
|
||||
import { PermissionGate } from '@/components/shared/permission-gate';
|
||||
import { InterestForm } from '@/components/interests/interest-form';
|
||||
import { InterestStagePicker } from '@/components/interests/interest-stage-picker';
|
||||
@@ -70,8 +71,7 @@ export function InterestDetailHeader({ portSlug, interest }: InterestDetailHeade
|
||||
const isArchived = !!interest.archivedAt;
|
||||
|
||||
const archiveMutation = useMutation({
|
||||
mutationFn: () =>
|
||||
apiFetch(`/api/v1/interests/${interest.id}`, { method: 'DELETE' }),
|
||||
mutationFn: () => apiFetch(`/api/v1/interests/${interest.id}`, { method: 'DELETE' }),
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['interests', interest.id] });
|
||||
queryClient.invalidateQueries({ queryKey: ['interests'] });
|
||||
@@ -80,8 +80,7 @@ export function InterestDetailHeader({ portSlug, interest }: InterestDetailHeade
|
||||
});
|
||||
|
||||
const restoreMutation = useMutation({
|
||||
mutationFn: () =>
|
||||
apiFetch(`/api/v1/interests/${interest.id}/restore`, { method: 'POST' }),
|
||||
mutationFn: () => apiFetch(`/api/v1/interests/${interest.id}/restore`, { method: 'POST' }),
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['interests', interest.id] });
|
||||
queryClient.invalidateQueries({ queryKey: ['interests'] });
|
||||
@@ -91,7 +90,7 @@ export function InterestDetailHeader({ portSlug, interest }: InterestDetailHeade
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="space-y-3">
|
||||
<DetailHeaderStrip>
|
||||
<div className="flex items-start gap-3 flex-wrap">
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center gap-2 flex-wrap">
|
||||
@@ -99,7 +98,9 @@ export function InterestDetailHeader({ portSlug, interest }: InterestDetailHeade
|
||||
{interest.clientName ?? 'Unknown Client'}
|
||||
</h1>
|
||||
{isArchived && (
|
||||
<Badge variant="secondary" className="text-xs">Archived</Badge>
|
||||
<Badge variant="secondary" className="text-xs">
|
||||
Archived
|
||||
</Badge>
|
||||
)}
|
||||
<span
|
||||
className={`inline-flex items-center rounded-full px-2.5 py-0.5 text-sm font-medium ${STAGE_COLORS[interest.pipelineStage] ?? 'bg-gray-100 text-gray-700'}`}
|
||||
@@ -130,8 +131,7 @@ export function InterestDetailHeader({ portSlug, interest }: InterestDetailHeade
|
||||
)}
|
||||
{interest.source && (
|
||||
<span>
|
||||
Source:{' '}
|
||||
<span className="text-foreground capitalize">{interest.source}</span>
|
||||
Source: <span className="text-foreground capitalize">{interest.source}</span>
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
@@ -176,7 +176,7 @@ export function InterestDetailHeader({ portSlug, interest }: InterestDetailHeade
|
||||
</PermissionGate>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</DetailHeaderStrip>
|
||||
|
||||
<InterestForm
|
||||
open={editOpen}
|
||||
|
||||
@@ -61,8 +61,7 @@ export function InterestList() {
|
||||
});
|
||||
|
||||
const archiveMutation = useMutation({
|
||||
mutationFn: (id: string) =>
|
||||
apiFetch(`/api/v1/interests/${id}`, { method: 'DELETE' }),
|
||||
mutationFn: (id: string) => apiFetch(`/api/v1/interests/${id}`, { method: 'DELETE' }),
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['interests'] });
|
||||
setArchiveInterest(null);
|
||||
@@ -80,6 +79,7 @@ export function InterestList() {
|
||||
<PageHeader
|
||||
title="Interests"
|
||||
description="Track prospective berth interest and pipeline"
|
||||
variant="gradient"
|
||||
actions={
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="flex items-center border rounded-md overflow-hidden">
|
||||
@@ -155,10 +155,7 @@ export function InterestList() {
|
||||
/>
|
||||
)}
|
||||
|
||||
<InterestForm
|
||||
open={createOpen}
|
||||
onOpenChange={setCreateOpen}
|
||||
/>
|
||||
<InterestForm open={createOpen} onOpenChange={setCreateOpen} />
|
||||
|
||||
{editInterest && (
|
||||
<InterestForm
|
||||
@@ -174,9 +171,7 @@ export function InterestList() {
|
||||
entityName={archiveInterest?.clientName ?? 'Interest'}
|
||||
entityType="Interest"
|
||||
isArchived={false}
|
||||
onConfirm={() =>
|
||||
archiveInterest && archiveMutation.mutate(archiveInterest.id)
|
||||
}
|
||||
onConfirm={() => archiveInterest && archiveMutation.mutate(archiveInterest.id)}
|
||||
isLoading={archiveMutation.isPending}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -85,15 +85,18 @@ export function InvoiceDetail({ invoiceId }: InvoiceDetailProps) {
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{/* Header */}
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<div className="flex items-center gap-3">
|
||||
<h2 className="text-xl font-semibold font-mono">{invoice.invoiceNumber}</h2>
|
||||
<div className="rounded-xl border border-slate-200 bg-gradient-brand-soft px-5 py-4 shadow-xs flex items-center justify-between gap-4 flex-wrap">
|
||||
<div className="min-w-0">
|
||||
<div className="text-xs font-semibold uppercase tracking-wide text-brand">Invoice</div>
|
||||
<div className="mt-1 flex items-center gap-3 flex-wrap">
|
||||
<h1 className="truncate text-2xl font-bold tracking-tight text-foreground font-mono">
|
||||
{invoice.invoiceNumber}
|
||||
</h1>
|
||||
<Badge variant="outline" className={`capitalize text-sm border ${statusColor}`}>
|
||||
{invoice.status}
|
||||
</Badge>
|
||||
</div>
|
||||
<p className="text-sm text-muted-foreground mt-0.5">{invoice.clientName}</p>
|
||||
<p className="text-sm text-muted-foreground mt-1">{invoice.clientName}</p>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
{invoice.status === 'draft' && (
|
||||
|
||||
@@ -141,12 +141,18 @@ function NavItemLink({
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
href={item.href as any}
|
||||
className={cn(
|
||||
'flex items-center gap-3 px-3 py-2 rounded-md text-sm font-medium transition-colors duration-150',
|
||||
'relative flex items-center gap-3 px-3 py-2 rounded-md text-sm font-medium transition-all duration-150',
|
||||
'text-[#cdcfd6] hover:bg-[#171f35] hover:text-white',
|
||||
active && 'border-l-2 border-[#3a7bc8] bg-[#3a7bc810] text-white pl-[10px]',
|
||||
active && 'text-white pl-[14px]',
|
||||
collapsed && 'justify-center px-2',
|
||||
)}
|
||||
>
|
||||
{active && !collapsed && (
|
||||
<span
|
||||
aria-hidden
|
||||
className="absolute left-0 top-1 bottom-1 w-1 rounded-r-full bg-[#3a7bc8]"
|
||||
/>
|
||||
)}
|
||||
<item.icon
|
||||
className={cn(
|
||||
'shrink-0',
|
||||
@@ -180,6 +186,7 @@ function SidebarContent({
|
||||
hasMarinaAccess,
|
||||
hasResidentialAccess,
|
||||
user,
|
||||
onToggleCollapse,
|
||||
}: {
|
||||
collapsed: boolean;
|
||||
portSlug: string | undefined;
|
||||
@@ -188,6 +195,8 @@ function SidebarContent({
|
||||
hasMarinaAccess: boolean;
|
||||
hasResidentialAccess: boolean;
|
||||
user?: SidebarProps['user'];
|
||||
/** When provided, renders the collapse toggle row above the user footer (desktop). */
|
||||
onToggleCollapse?: () => void;
|
||||
}) {
|
||||
const pathname = usePathname();
|
||||
const [adminExpanded, setAdminExpanded] = useState(true);
|
||||
@@ -199,28 +208,28 @@ function SidebarContent({
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex flex-col h-full bg-[#1e2844]">
|
||||
{/* Logo area */}
|
||||
<div
|
||||
className={cn(
|
||||
'flex items-center gap-3 px-4 py-5 border-b border-[#474e66]',
|
||||
collapsed && 'justify-center px-2',
|
||||
)}
|
||||
>
|
||||
<div className="shrink-0 w-8 h-8 rounded-md bg-[#3a7bc8] flex items-center justify-center">
|
||||
<span className="text-white font-bold text-sm">PN</span>
|
||||
</div>
|
||||
{!collapsed && (
|
||||
<div className="min-w-0">
|
||||
<p className="text-white font-semibold text-sm leading-tight truncate">Port Nimara</p>
|
||||
<p className="text-[#83aab1] text-xs truncate">Marina CRM</p>
|
||||
<TooltipProvider delayDuration={0}>
|
||||
<div className="flex flex-col h-full bg-[#1e2844]">
|
||||
{/* Logo area */}
|
||||
<div
|
||||
className={cn(
|
||||
'flex items-center gap-3 px-4 py-5 border-b border-[#474e66]',
|
||||
collapsed && 'justify-center px-2',
|
||||
)}
|
||||
>
|
||||
<div className="shrink-0 w-8 h-8 rounded-md bg-[#3a7bc8] flex items-center justify-center">
|
||||
<span className="text-white font-bold text-sm">PN</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{!collapsed && (
|
||||
<div className="min-w-0">
|
||||
<p className="text-white font-semibold text-sm leading-tight truncate">Port Nimara</p>
|
||||
<p className="text-[#83aab1] text-xs truncate">Marina CRM</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Nav */}
|
||||
<ScrollArea className="flex-1 py-2">
|
||||
<TooltipProvider delayDuration={0}>
|
||||
{/* Nav */}
|
||||
<ScrollArea className="flex-1 py-2">
|
||||
<nav className="px-2 space-y-4">
|
||||
{sections.map((section) => {
|
||||
if (section.adminRequired && !hasAdminAccess) return null;
|
||||
@@ -231,7 +240,7 @@ function SidebarContent({
|
||||
<div key={section.title}>
|
||||
{!collapsed && (
|
||||
<div className="flex items-center justify-between px-1 mb-1">
|
||||
<span className="text-[#71768a] text-xs font-medium uppercase tracking-wider">
|
||||
<span className="text-[#83aab1] text-[10px] font-semibold uppercase tracking-[0.12em]">
|
||||
{section.title}
|
||||
</span>
|
||||
{section.adminRequired && (
|
||||
@@ -266,44 +275,63 @@ function SidebarContent({
|
||||
);
|
||||
})}
|
||||
</nav>
|
||||
</TooltipProvider>
|
||||
</ScrollArea>
|
||||
</ScrollArea>
|
||||
|
||||
{/* User footer */}
|
||||
<div className={cn('border-t border-[#474e66] p-3', collapsed && 'flex justify-center')}>
|
||||
{collapsed ? (
|
||||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<Avatar className="w-8 h-8 cursor-pointer">
|
||||
{/* Collapse toggle (desktop only) */}
|
||||
{onToggleCollapse && (
|
||||
<button
|
||||
type="button"
|
||||
onClick={onToggleCollapse}
|
||||
aria-label={collapsed ? 'Expand sidebar' : 'Collapse sidebar'}
|
||||
className={cn(
|
||||
'flex items-center w-full border-t border-[#474e66] px-3 py-2',
|
||||
'text-[#83aab1] hover:bg-[#171f35] hover:text-white transition-colors',
|
||||
collapsed ? 'justify-center' : 'justify-end gap-2',
|
||||
)}
|
||||
>
|
||||
{!collapsed && (
|
||||
<span className="text-[10px] font-medium uppercase tracking-[0.12em]">Collapse</span>
|
||||
)}
|
||||
{collapsed ? <ChevronRight className="w-4 h-4" /> : <ChevronLeft className="w-4 h-4" />}
|
||||
</button>
|
||||
)}
|
||||
|
||||
{/* User footer */}
|
||||
<div className={cn('border-t border-[#474e66] p-3', collapsed && 'flex justify-center')}>
|
||||
{collapsed ? (
|
||||
<Tooltip>
|
||||
<TooltipTrigger asChild>
|
||||
<Avatar className="w-8 h-8 cursor-pointer">
|
||||
<AvatarImage src={undefined} />
|
||||
<AvatarFallback className="bg-[#3a7bc8] text-white text-xs font-semibold">
|
||||
U
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent side="right">User Profile</TooltipContent>
|
||||
</Tooltip>
|
||||
) : (
|
||||
<div className="flex items-center gap-3">
|
||||
<Avatar className="w-8 h-8 shrink-0 shadow-sm ring-2 ring-white/30">
|
||||
<AvatarImage src={undefined} />
|
||||
<AvatarFallback className="bg-[#3a7bc8] text-white text-xs font-semibold">
|
||||
U
|
||||
{(user?.name ?? 'U').slice(0, 1).toUpperCase()}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent side="right">User Profile</TooltipContent>
|
||||
</Tooltip>
|
||||
) : (
|
||||
<div className="flex items-center gap-3">
|
||||
<Avatar className="w-8 h-8 shrink-0">
|
||||
<AvatarImage src={undefined} />
|
||||
<AvatarFallback className="bg-[#3a7bc8] text-white text-xs font-semibold">
|
||||
{(user?.name ?? 'U').slice(0, 1).toUpperCase()}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
<div className="flex-1 min-w-0">
|
||||
<p className="text-white text-sm font-medium truncate">{user?.name ?? 'User'}</p>
|
||||
<Badge
|
||||
variant="outline"
|
||||
className="text-[10px] px-1.5 py-0 text-[#83aab1] border-[#474e66] mt-0.5"
|
||||
>
|
||||
{portRoles[0]?.role?.name ?? 'Staff'}
|
||||
</Badge>
|
||||
<div className="flex-1 min-w-0">
|
||||
<p className="text-white text-sm font-medium truncate">{user?.name ?? 'User'}</p>
|
||||
<Badge
|
||||
variant="outline"
|
||||
className="text-[10px] px-1.5 py-0 text-[#83aab1] border-[#474e66] mt-0.5"
|
||||
>
|
||||
{portRoles[0]?.role?.name ?? 'Staff'}
|
||||
</Badge>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</TooltipProvider>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -332,7 +360,7 @@ export function Sidebar({ portRoles, isSuperAdmin = false, user }: SidebarProps)
|
||||
{/* Desktop sidebar */}
|
||||
<aside
|
||||
className={cn(
|
||||
'hidden md:flex flex-col h-screen border-r border-[#474e66] transition-all duration-200 ease-in-out shrink-0',
|
||||
'relative hidden md:flex flex-col h-screen border-r border-[#474e66] transition-all duration-200 ease-in-out shrink-0',
|
||||
sidebarCollapsed ? 'w-sidebar-collapsed' : 'w-sidebar',
|
||||
)}
|
||||
style={{ backgroundColor: '#1e2844' }}
|
||||
@@ -345,25 +373,8 @@ export function Sidebar({ portRoles, isSuperAdmin = false, user }: SidebarProps)
|
||||
hasMarinaAccess={hasMarinaAccess}
|
||||
hasResidentialAccess={hasResidentialAccess}
|
||||
user={user}
|
||||
onToggleCollapse={toggleSidebar}
|
||||
/>
|
||||
|
||||
{/* Collapse toggle */}
|
||||
<button
|
||||
onClick={toggleSidebar}
|
||||
className={cn(
|
||||
'absolute top-1/2 -translate-y-1/2 -right-3 z-10',
|
||||
'w-6 h-6 rounded-full bg-[#1e2844] border border-[#474e66]',
|
||||
'flex items-center justify-center text-[#cdcfd6]',
|
||||
'hover:bg-[#3a7bc8] hover:border-[#3a7bc8] hover:text-white transition-colors',
|
||||
)}
|
||||
aria-label={sidebarCollapsed ? 'Expand sidebar' : 'Collapse sidebar'}
|
||||
>
|
||||
{sidebarCollapsed ? (
|
||||
<ChevronRight className="w-3 h-3" />
|
||||
) : (
|
||||
<ChevronLeft className="w-3 h-3" />
|
||||
)}
|
||||
</button>
|
||||
</aside>
|
||||
|
||||
{/* Mobile drawer */}
|
||||
|
||||
@@ -57,7 +57,10 @@ export function Topbar({ ports, user }: TopbarProps) {
|
||||
{/* + New dropdown */}
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button size="sm" className="bg-brand hover:bg-brand-500 text-white gap-1.5">
|
||||
<Button
|
||||
size="sm"
|
||||
className="bg-gradient-brand hover:opacity-90 text-white gap-1.5 shadow-sm transition-all duration-base ease-smooth hover:scale-[1.02]"
|
||||
>
|
||||
<Plus className="w-4 h-4" />
|
||||
<span className="hidden sm:inline">New</span>
|
||||
</Button>
|
||||
@@ -93,7 +96,7 @@ export function Topbar({ ports, user }: TopbarProps) {
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="ghost" size="icon" className="rounded-full">
|
||||
<Avatar className="w-7 h-7">
|
||||
<Avatar className="w-7 h-7 shadow-sm ring-2 ring-background">
|
||||
<AvatarImage src={undefined} />
|
||||
<AvatarFallback className="bg-brand text-white text-xs font-semibold">
|
||||
{(user?.name ?? 'U').slice(0, 1).toUpperCase()}
|
||||
|
||||
@@ -57,7 +57,10 @@ export function NotificationBell() {
|
||||
<Button variant="ghost" size="icon" className="relative">
|
||||
<Bell className="h-5 w-5" />
|
||||
{unreadCount > 0 && (
|
||||
<span className="absolute -top-0.5 -right-0.5 flex h-4 w-4 items-center justify-center rounded-full bg-blue-500 text-[10px] font-bold text-white">
|
||||
<span
|
||||
key={unreadCount}
|
||||
className="absolute -top-0.5 -right-0.5 flex h-4 w-4 items-center justify-center rounded-full bg-gradient-brand text-[10px] font-bold text-white shadow-sm ring-2 ring-background animate-badge-pop"
|
||||
>
|
||||
{unreadCount > 99 ? '99+' : unreadCount}
|
||||
</span>
|
||||
)}
|
||||
|
||||
292
src/components/reservations/reservation-detail.tsx
Normal file
292
src/components/reservations/reservation-detail.tsx
Normal file
@@ -0,0 +1,292 @@
|
||||
'use client';
|
||||
|
||||
import Link from 'next/link';
|
||||
import type { Route } from 'next';
|
||||
import { useQuery } from '@tanstack/react-query';
|
||||
import { ArrowLeft, Bell, Download, FileSignature, Mail } from 'lucide-react';
|
||||
import { toast } from 'sonner';
|
||||
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { PageHeader } from '@/components/shared/page-header';
|
||||
import { StatusPill, type StatusPillStatus } from '@/components/ui/status-pill';
|
||||
import { EmptyState } from '@/components/ui/empty-state';
|
||||
import { useRealtimeInvalidation } from '@/hooks/use-realtime-invalidation';
|
||||
import { apiFetch } from '@/lib/api/client';
|
||||
|
||||
interface ReservationDoc {
|
||||
id: string;
|
||||
title: string;
|
||||
status: string;
|
||||
documentType: string;
|
||||
signedFileId: string | null;
|
||||
signers: Array<{ id: string; status: string; signerName: string }>;
|
||||
}
|
||||
|
||||
interface ReservationData {
|
||||
id: string;
|
||||
status: string;
|
||||
startDate: string;
|
||||
endDate: string | null;
|
||||
tenureType: string;
|
||||
contractFileId: string | null;
|
||||
berthId: string;
|
||||
yachtId: string;
|
||||
clientId: string;
|
||||
notes: string | null;
|
||||
}
|
||||
|
||||
const RESERVATION_PILL: Record<string, StatusPillStatus> = {
|
||||
pending: 'pending',
|
||||
active: 'active',
|
||||
ended: 'archived',
|
||||
cancelled: 'cancelled',
|
||||
};
|
||||
|
||||
interface ReservationDetailProps {
|
||||
reservationId: string;
|
||||
portSlug: string;
|
||||
}
|
||||
|
||||
export function ReservationDetail({ reservationId, portSlug }: ReservationDetailProps) {
|
||||
const reservation = useQuery<{ data: ReservationData }>({
|
||||
queryKey: ['reservation', reservationId],
|
||||
queryFn: () => apiFetch(`/api/v1/berth-reservations/${reservationId}`),
|
||||
});
|
||||
|
||||
const documentsForRes = useQuery<{ data: ReservationDoc[] }>({
|
||||
queryKey: ['documents', 'by-reservation', reservationId],
|
||||
queryFn: () =>
|
||||
apiFetch(
|
||||
`/api/v1/documents?documentType=reservation_agreement&signatureOnly=true&limit=10`,
|
||||
).then((res) => {
|
||||
const r = res as { data: ReservationDoc[] & Array<{ reservationId?: string }> };
|
||||
return {
|
||||
data: r.data.filter(
|
||||
(d: ReservationDoc & { reservationId?: string }) => d.reservationId === reservationId,
|
||||
),
|
||||
} as { data: ReservationDoc[] };
|
||||
}),
|
||||
});
|
||||
|
||||
useRealtimeInvalidation({
|
||||
'document:created': [['documents', 'by-reservation', reservationId]],
|
||||
'document:completed': [
|
||||
['documents', 'by-reservation', reservationId],
|
||||
['reservation', reservationId],
|
||||
],
|
||||
'document:cancelled': [['documents', 'by-reservation', reservationId]],
|
||||
});
|
||||
|
||||
if (reservation.isLoading) {
|
||||
return <div className="h-32 animate-pulse rounded-md bg-muted/40" />;
|
||||
}
|
||||
|
||||
if (reservation.error || !reservation.data) {
|
||||
return (
|
||||
<PageHeader
|
||||
title="Reservation not found"
|
||||
actions={
|
||||
<Button asChild variant="outline">
|
||||
<Link href={`/${portSlug}/berths`}>
|
||||
<ArrowLeft className="mr-1.5 h-4 w-4" /> Back
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
const res = reservation.data.data;
|
||||
const docs = documentsForRes.data?.data ?? [];
|
||||
const activeAgreement = docs.find((d) => ['sent', 'partially_signed'].includes(d.status));
|
||||
const completedAgreement = docs.find((d) => ['completed', 'signed'].includes(d.status));
|
||||
|
||||
const renderAgreementCard = (): React.ReactNode => {
|
||||
if (completedAgreement) {
|
||||
return (
|
||||
<div className="flex flex-col gap-3 rounded-md border bg-success-bg/50 p-4">
|
||||
<div className="flex items-start justify-between gap-2">
|
||||
<div>
|
||||
<h3 className="text-sm font-semibold text-foreground">Agreement signed</h3>
|
||||
<p className="mt-1 text-xs text-muted-foreground">{completedAgreement.title}</p>
|
||||
</div>
|
||||
<StatusPill status="completed" withDot>
|
||||
Completed
|
||||
</StatusPill>
|
||||
</div>
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
{completedAgreement.signedFileId ? (
|
||||
<Button asChild size="sm" variant="outline">
|
||||
<Link href={`/api/v1/files/${completedAgreement.signedFileId}/download`}>
|
||||
<Download className="mr-1.5 h-4 w-4" /> Download signed PDF
|
||||
</Link>
|
||||
</Button>
|
||||
) : null}
|
||||
<Button asChild size="sm" variant="outline">
|
||||
<Link href={`/${portSlug}/documents/${completedAgreement.id}`}>
|
||||
<Mail className="mr-1.5 h-4 w-4" /> View document
|
||||
</Link>
|
||||
</Button>
|
||||
</div>
|
||||
<p className="text-xs text-muted-foreground">
|
||||
Signed contract attached to this reservation.
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (activeAgreement) {
|
||||
const signedCount = activeAgreement.signers.filter((s) => s.status === 'signed').length;
|
||||
return (
|
||||
<div className="flex flex-col gap-3 rounded-md border bg-brand-50 p-4">
|
||||
<div className="flex items-start justify-between gap-2">
|
||||
<div>
|
||||
<h3 className="text-sm font-semibold text-foreground">Agreement out for signing</h3>
|
||||
<p className="mt-1 text-xs text-muted-foreground">
|
||||
{signedCount}/{activeAgreement.signers.length} signed · {activeAgreement.title}
|
||||
</p>
|
||||
</div>
|
||||
<StatusPill
|
||||
status={activeAgreement.status === 'partially_signed' ? 'partial' : 'sent'}
|
||||
withDot
|
||||
>
|
||||
{activeAgreement.status.replace(/_/g, ' ')}
|
||||
</StatusPill>
|
||||
</div>
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
<Button asChild size="sm">
|
||||
<Link href={`/${portSlug}/documents/${activeAgreement.id}`}>
|
||||
<FileSignature className="mr-1.5 h-4 w-4" /> View document
|
||||
</Link>
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
onClick={async () => {
|
||||
try {
|
||||
await apiFetch(`/api/v1/documents/${activeAgreement.id}/remind`, {
|
||||
method: 'POST',
|
||||
});
|
||||
toast.success('Reminder sent');
|
||||
} catch (err) {
|
||||
toast.error(err instanceof Error ? err.message : 'Failed');
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Bell className="mr-1.5 h-4 w-4" /> Remind signers
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<EmptyState
|
||||
icon={<FileSignature className="h-7 w-7" />}
|
||||
title="No reservation agreement yet"
|
||||
body="Generate an agreement for the parties to sign before activation."
|
||||
actions={
|
||||
<Button asChild>
|
||||
<Link
|
||||
href={
|
||||
`/${portSlug}/documents/new?reservationId=${reservationId}&documentType=reservation_agreement` as Route
|
||||
}
|
||||
>
|
||||
Generate agreement
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-4">
|
||||
<PageHeader
|
||||
eyebrow="Berth reservation"
|
||||
title={`Reservation #${res.id.slice(0, 8)}`}
|
||||
description={`${res.tenureType.replace(/_/g, ' ')} · ${new Date(res.startDate).toLocaleDateString('en-GB')}${res.endDate ? ` → ${new Date(res.endDate).toLocaleDateString('en-GB')}` : ''}`}
|
||||
kpiLine={
|
||||
<>
|
||||
<StatusPill status={RESERVATION_PILL[res.status] ?? 'pending'} withDot>
|
||||
{res.status}
|
||||
</StatusPill>
|
||||
{res.contractFileId ? <span>Contract attached</span> : <span>No contract</span>}
|
||||
</>
|
||||
}
|
||||
actions={
|
||||
<Button asChild variant="outline">
|
||||
<Link href={`/${portSlug}/berths`}>
|
||||
<ArrowLeft className="mr-1.5 h-4 w-4" /> Back to berths
|
||||
</Link>
|
||||
</Button>
|
||||
}
|
||||
variant="gradient"
|
||||
/>
|
||||
|
||||
<div className="grid gap-4 lg:grid-cols-[2fr_1fr]">
|
||||
<div className="flex flex-col gap-4">
|
||||
<section className="rounded-md border bg-white p-4">
|
||||
<h2 className="mb-2 text-sm font-semibold uppercase tracking-wide text-muted-foreground">
|
||||
Reservation details
|
||||
</h2>
|
||||
<dl className="grid grid-cols-2 gap-3 text-sm">
|
||||
<div>
|
||||
<dt className="text-xs text-muted-foreground">Berth</dt>
|
||||
<dd>
|
||||
<Link
|
||||
href={`/${portSlug}/berths/${res.berthId}` as Route}
|
||||
className="font-medium text-brand hover:underline"
|
||||
>
|
||||
{res.berthId.slice(0, 8)}…
|
||||
</Link>
|
||||
</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt className="text-xs text-muted-foreground">Yacht</dt>
|
||||
<dd>
|
||||
<Link
|
||||
href={`/${portSlug}/yachts/${res.yachtId}` as Route}
|
||||
className="font-medium text-brand hover:underline"
|
||||
>
|
||||
{res.yachtId.slice(0, 8)}…
|
||||
</Link>
|
||||
</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt className="text-xs text-muted-foreground">Client</dt>
|
||||
<dd>
|
||||
<Link
|
||||
href={`/${portSlug}/clients/${res.clientId}` as Route}
|
||||
className="font-medium text-brand hover:underline"
|
||||
>
|
||||
{res.clientId.slice(0, 8)}…
|
||||
</Link>
|
||||
</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt className="text-xs text-muted-foreground">Tenure</dt>
|
||||
<dd className="font-medium">{res.tenureType.replace(/_/g, ' ')}</dd>
|
||||
</div>
|
||||
</dl>
|
||||
{res.notes ? (
|
||||
<div className="mt-3 border-t pt-3 text-sm">
|
||||
<div className="text-xs text-muted-foreground">Notes</div>
|
||||
<p className="mt-1 text-foreground whitespace-pre-wrap">{res.notes}</p>
|
||||
</div>
|
||||
) : null}
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-4">
|
||||
<section className="rounded-md border bg-white p-4">
|
||||
<h2 className="mb-3 text-sm font-semibold uppercase tracking-wide text-muted-foreground">
|
||||
Agreement
|
||||
</h2>
|
||||
{renderAgreementCard()}
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -113,14 +113,17 @@ export function ResidentialClientDetail({ clientId }: { clientId: string }) {
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="rounded-lg border bg-card p-6 space-y-6">
|
||||
<div>
|
||||
<h1 className="text-2xl font-semibold">
|
||||
<InlineEditableField value={client.fullName} onSave={save('fullName')} />
|
||||
</h1>
|
||||
<div className="rounded-xl border border-slate-200 bg-gradient-brand-soft px-5 py-4 shadow-xs">
|
||||
<div className="text-xs font-semibold uppercase tracking-wide text-brand">
|
||||
Residential Client
|
||||
</div>
|
||||
<h1 className="mt-1 truncate text-2xl font-bold tracking-tight text-foreground">
|
||||
<InlineEditableField value={client.fullName} onSave={save('fullName')} />
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div className="rounded-lg border bg-card p-6 space-y-6">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-[2fr_1fr] gap-6">
|
||||
<div className="space-y-1">
|
||||
<h3 className="text-sm font-medium mb-2">Contact</h3>
|
||||
<Row label="Email">
|
||||
|
||||
@@ -87,25 +87,25 @@ export function ResidentialInterestDetail({ interestId }: { interestId: string }
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="rounded-lg border bg-card p-6 space-y-6">
|
||||
<div>
|
||||
<p className="text-xs uppercase text-muted-foreground tracking-wider mb-1">
|
||||
Residential interest
|
||||
</p>
|
||||
{interest.client && (
|
||||
<h1 className="text-2xl font-semibold">
|
||||
<Link
|
||||
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
|
||||
href={`/${portSlug}/residential/clients/${interest.client.id}` as any}
|
||||
className="hover:underline"
|
||||
>
|
||||
{interest.client.fullName}
|
||||
</Link>
|
||||
</h1>
|
||||
)}
|
||||
</div>
|
||||
<div className="rounded-xl border border-border bg-gradient-brand-soft px-5 py-4 shadow-xs">
|
||||
<p className="text-xs uppercase font-semibold tracking-wide text-brand">
|
||||
Residential interest
|
||||
</p>
|
||||
{interest.client && (
|
||||
<h1 className="mt-1 truncate text-2xl font-bold tracking-tight text-foreground">
|
||||
<Link
|
||||
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
|
||||
href={`/${portSlug}/residential/clients/${interest.client.id}` as any}
|
||||
className="hover:underline"
|
||||
>
|
||||
{interest.client.fullName}
|
||||
</Link>
|
||||
</h1>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div className="rounded-lg border bg-card p-6 space-y-6">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-[2fr_1fr] gap-6">
|
||||
<div className="space-y-1">
|
||||
<h3 className="text-sm font-medium mb-2">Pipeline</h3>
|
||||
<Row label="Stage">
|
||||
|
||||
@@ -84,8 +84,10 @@ export function CommandSearch() {
|
||||
{/* ── Single persistent search bar ── */}
|
||||
<div
|
||||
className={cn(
|
||||
'flex items-center gap-2 rounded-md border bg-background px-2.5 transition-all duration-150',
|
||||
focused ? 'border-muted-foreground/40 w-64 lg:w-80' : 'w-44 lg:w-60',
|
||||
'flex items-center gap-2 rounded-md border bg-background px-2.5 shadow-xs transition-all duration-base ease-smooth',
|
||||
focused
|
||||
? 'border-brand/60 ring-4 ring-brand/15 w-64 lg:w-80'
|
||||
: 'border-input w-44 lg:w-60',
|
||||
)}
|
||||
>
|
||||
<Search className="h-4 w-4 shrink-0 text-muted-foreground" />
|
||||
|
||||
@@ -115,17 +115,14 @@ export function DataTable<TData>({
|
||||
: undefined,
|
||||
},
|
||||
onRowSelectionChange: (updater) => {
|
||||
const newSelection =
|
||||
typeof updater === 'function' ? updater(rowSelectionState) : updater;
|
||||
const newSelection = typeof updater === 'function' ? updater(rowSelectionState) : updater;
|
||||
setRowSelection(newSelection);
|
||||
},
|
||||
getRowId: getRowId as (row: TData, index: number) => string,
|
||||
enableRowSelection: !!bulkActions?.length,
|
||||
});
|
||||
|
||||
const selectedIds = Object.keys(rowSelectionState).filter(
|
||||
(k) => rowSelectionState[k],
|
||||
);
|
||||
const selectedIds = Object.keys(rowSelectionState).filter((k) => rowSelectionState[k]);
|
||||
|
||||
function handleSort(columnId: string) {
|
||||
if (!onSortChange) return;
|
||||
@@ -147,7 +144,7 @@ export function DataTable<TData>({
|
||||
|
||||
return (
|
||||
<div className="space-y-2">
|
||||
<div className="rounded-md border">
|
||||
<div className="rounded-md border overflow-x-auto">
|
||||
<Table>
|
||||
<TableHeader className="sticky top-0 z-10 bg-muted/50">
|
||||
{table.getHeaderGroups().map((headerGroup) => (
|
||||
@@ -160,7 +157,11 @@ export function DataTable<TData>({
|
||||
header.column.getCanSort() && onSortChange && 'cursor-pointer select-none',
|
||||
)}
|
||||
onClick={() => {
|
||||
if (header.column.getCanSort() && onSortChange && header.column.id !== 'select') {
|
||||
if (
|
||||
header.column.getCanSort() &&
|
||||
onSortChange &&
|
||||
header.column.id !== 'select'
|
||||
) {
|
||||
handleSort(header.column.id);
|
||||
}
|
||||
}}
|
||||
|
||||
20
src/components/shared/detail-header-strip.tsx
Normal file
20
src/components/shared/detail-header-strip.tsx
Normal file
@@ -0,0 +1,20 @@
|
||||
import { type ReactNode } from 'react';
|
||||
import { cn } from '@/lib/utils';
|
||||
|
||||
interface DetailHeaderStripProps {
|
||||
children: ReactNode;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export function DetailHeaderStrip({ children, className }: DetailHeaderStripProps) {
|
||||
return (
|
||||
<div
|
||||
className={cn(
|
||||
'rounded-xl border border-border bg-gradient-brand-soft px-5 py-4 shadow-xs',
|
||||
className,
|
||||
)}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -3,15 +3,9 @@
|
||||
import { useSearchParams, useRouter, usePathname } from 'next/navigation';
|
||||
import { Loader2 } from 'lucide-react';
|
||||
|
||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { ResponsiveTabs, type ResponsiveTab } from '@/components/shared/responsive-tabs';
|
||||
|
||||
export interface DetailTab {
|
||||
id: string;
|
||||
label: string;
|
||||
content: React.ReactNode;
|
||||
badge?: string | number;
|
||||
}
|
||||
export type DetailTab = ResponsiveTab;
|
||||
|
||||
interface DetailLayoutProps {
|
||||
header: React.ReactNode;
|
||||
@@ -21,18 +15,12 @@ interface DetailLayoutProps {
|
||||
actions?: React.ReactNode;
|
||||
}
|
||||
|
||||
export function DetailLayout({
|
||||
header,
|
||||
tabs,
|
||||
defaultTab,
|
||||
isLoading,
|
||||
actions,
|
||||
}: DetailLayoutProps) {
|
||||
export function DetailLayout({ header, tabs, defaultTab, isLoading, actions }: DetailLayoutProps) {
|
||||
const searchParams = useSearchParams();
|
||||
const router = useRouter();
|
||||
const pathname = usePathname();
|
||||
|
||||
const activeTab = searchParams.get('tab') ?? defaultTab ?? tabs[0]?.id;
|
||||
const activeTab = searchParams.get('tab') ?? defaultTab ?? tabs[0]?.id ?? '';
|
||||
|
||||
function handleTabChange(tabId: string) {
|
||||
const params = new URLSearchParams(searchParams.toString());
|
||||
@@ -51,30 +39,12 @@ export function DetailLayout({
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-start justify-between gap-4">
|
||||
<div className="flex items-start justify-between gap-4 flex-wrap">
|
||||
<div className="min-w-0 flex-1">{header}</div>
|
||||
{actions && <div className="flex items-center gap-2 shrink-0">{actions}</div>}
|
||||
</div>
|
||||
|
||||
<Tabs value={activeTab} onValueChange={handleTabChange}>
|
||||
<TabsList>
|
||||
{tabs.map((tab) => (
|
||||
<TabsTrigger key={tab.id} value={tab.id} className="gap-1.5">
|
||||
{tab.label}
|
||||
{tab.badge !== undefined && tab.badge !== null && (
|
||||
<Badge variant="secondary" className="px-1.5 py-0 text-xs">
|
||||
{tab.badge}
|
||||
</Badge>
|
||||
)}
|
||||
</TabsTrigger>
|
||||
))}
|
||||
</TabsList>
|
||||
{tabs.map((tab) => (
|
||||
<TabsContent key={tab.id} value={tab.id} className="mt-4">
|
||||
{tab.content}
|
||||
</TabsContent>
|
||||
))}
|
||||
</Tabs>
|
||||
<ResponsiveTabs tabs={tabs} value={activeTab} onValueChange={handleTabChange} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -6,22 +6,54 @@ interface PageHeaderProps {
|
||||
description?: string;
|
||||
actions?: ReactNode;
|
||||
className?: string;
|
||||
/** Optional small uppercase label above the title. */
|
||||
eyebrow?: string;
|
||||
/** Optional one-line stats / KPI summary under the description. */
|
||||
kpiLine?: ReactNode;
|
||||
/** Render with the polished gradient-brand-soft background strip. */
|
||||
variant?: 'plain' | 'gradient';
|
||||
}
|
||||
|
||||
/**
|
||||
* Consistent page-level header: title, optional description, and an action
|
||||
* slot (typically buttons — e.g. "New Client", "Export").
|
||||
* Consistent page-level header: title, optional description, KPI sub-line,
|
||||
* eyebrow, and an action slot. Use `variant="gradient"` for hero strips on
|
||||
* landing pages and detail headers; the plain variant remains the default so
|
||||
* existing call-sites stay unchanged.
|
||||
*/
|
||||
export function PageHeader({ title, description, actions, className }: PageHeaderProps) {
|
||||
export function PageHeader({
|
||||
title,
|
||||
description,
|
||||
actions,
|
||||
className,
|
||||
eyebrow,
|
||||
kpiLine,
|
||||
variant = 'plain',
|
||||
}: PageHeaderProps) {
|
||||
const isGradient = variant === 'gradient';
|
||||
return (
|
||||
<div className={cn('flex items-start justify-between gap-4 mb-6', className)}>
|
||||
<div
|
||||
className={cn(
|
||||
'mb-6 flex items-start justify-between gap-4',
|
||||
isGradient &&
|
||||
'rounded-xl border border-slate-200 bg-gradient-brand-soft px-5 py-4 shadow-xs',
|
||||
className,
|
||||
)}
|
||||
>
|
||||
<div className="min-w-0">
|
||||
<h1 className="text-2xl font-bold text-foreground tracking-tight truncate">{title}</h1>
|
||||
{description && (
|
||||
<p className="mt-1 text-sm text-muted-foreground">{description}</p>
|
||||
)}
|
||||
{eyebrow ? (
|
||||
<div className="mb-1 text-xs font-semibold uppercase tracking-wide text-brand">
|
||||
{eyebrow}
|
||||
</div>
|
||||
) : null}
|
||||
<h1 className="truncate text-2xl font-bold tracking-tight text-foreground">{title}</h1>
|
||||
{description && <p className="mt-1 text-sm text-muted-foreground">{description}</p>}
|
||||
{kpiLine ? (
|
||||
<div className="mt-2 flex flex-wrap items-center gap-x-4 gap-y-1 text-sm text-muted-foreground">
|
||||
{kpiLine}
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
{actions && <div className="flex items-center gap-2 shrink-0">{actions}</div>}
|
||||
{actions && <div className="flex shrink-0 items-center gap-2">{actions}</div>}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
77
src/components/shared/responsive-tabs.tsx
Normal file
77
src/components/shared/responsive-tabs.tsx
Normal file
@@ -0,0 +1,77 @@
|
||||
'use client';
|
||||
|
||||
import { type ReactNode } from 'react';
|
||||
|
||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from '@/components/ui/select';
|
||||
|
||||
export interface ResponsiveTab {
|
||||
id: string;
|
||||
label: string;
|
||||
content: ReactNode;
|
||||
badge?: string | number;
|
||||
}
|
||||
|
||||
interface ResponsiveTabsProps {
|
||||
tabs: ResponsiveTab[];
|
||||
value: string;
|
||||
onValueChange: (value: string) => void;
|
||||
}
|
||||
|
||||
/**
|
||||
* Tabs that collapse to a native <Select> on phone-sized viewports.
|
||||
* Above sm: TabsList renders. At/below sm: a Select dropdown replaces the tab strip.
|
||||
*/
|
||||
export function ResponsiveTabs({ tabs, value, onValueChange }: ResponsiveTabsProps) {
|
||||
return (
|
||||
<Tabs value={value} onValueChange={onValueChange}>
|
||||
{/* Mobile: select dropdown */}
|
||||
<div className="sm:hidden">
|
||||
<Select value={value} onValueChange={onValueChange}>
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{tabs.map((tab) => (
|
||||
<SelectItem key={tab.id} value={tab.id}>
|
||||
<span className="flex items-center gap-1.5">
|
||||
{tab.label}
|
||||
{tab.badge !== undefined && tab.badge !== null && (
|
||||
<span className="text-xs text-muted-foreground">({tab.badge})</span>
|
||||
)}
|
||||
</span>
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
{/* Desktop / tablet: tab strip */}
|
||||
<TabsList className="hidden sm:flex">
|
||||
{tabs.map((tab) => (
|
||||
<TabsTrigger key={tab.id} value={tab.id} className="gap-1.5">
|
||||
{tab.label}
|
||||
{tab.badge !== undefined && tab.badge !== null && (
|
||||
<Badge variant="secondary" className="px-1.5 py-0 text-xs">
|
||||
{tab.badge}
|
||||
</Badge>
|
||||
)}
|
||||
</TabsTrigger>
|
||||
))}
|
||||
</TabsList>
|
||||
|
||||
{tabs.map((tab) => (
|
||||
<TabsContent key={tab.id} value={tab.id} className="mt-4">
|
||||
{tab.content}
|
||||
</TabsContent>
|
||||
))}
|
||||
</Tabs>
|
||||
);
|
||||
}
|
||||
33
src/components/ui/empty-state.tsx
Normal file
33
src/components/ui/empty-state.tsx
Normal file
@@ -0,0 +1,33 @@
|
||||
import * as React from 'react';
|
||||
|
||||
import { cn } from '@/lib/utils';
|
||||
|
||||
interface EmptyStateProps {
|
||||
icon?: React.ReactNode;
|
||||
title: string;
|
||||
body?: React.ReactNode;
|
||||
actions?: React.ReactNode;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export function EmptyState({ icon, title, body, actions, className }: EmptyStateProps) {
|
||||
return (
|
||||
<div
|
||||
className={cn(
|
||||
'flex flex-col items-center justify-center gap-3 rounded-lg border border-dashed border-slate-200 bg-white px-6 py-12 text-center',
|
||||
className,
|
||||
)}
|
||||
>
|
||||
{icon ? (
|
||||
<div className="flex h-14 w-14 items-center justify-center rounded-full bg-gradient-brand-soft text-brand">
|
||||
{icon}
|
||||
</div>
|
||||
) : null}
|
||||
<div className="text-base font-semibold text-foreground">{title}</div>
|
||||
{body ? <div className="max-w-md text-sm text-muted-foreground">{body}</div> : null}
|
||||
{actions ? (
|
||||
<div className="mt-2 flex flex-wrap items-center justify-center gap-2">{actions}</div>
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
71
src/components/ui/kpi-tile.tsx
Normal file
71
src/components/ui/kpi-tile.tsx
Normal file
@@ -0,0 +1,71 @@
|
||||
import * as React from 'react';
|
||||
|
||||
import { cn } from '@/lib/utils';
|
||||
|
||||
interface KPITileProps extends React.HTMLAttributes<HTMLDivElement> {
|
||||
title: string;
|
||||
value: React.ReactNode;
|
||||
/** Signed delta vs. prior period; positive = green, negative = red, undefined = no chip. */
|
||||
delta?: number;
|
||||
/** Pre-rendered sparkline (recharts) — caller decides shape. */
|
||||
sparkline?: React.ReactNode;
|
||||
/** Optional accent stripe colour token; defaults to brand. */
|
||||
accent?: 'brand' | 'success' | 'warning' | 'mint' | 'teal' | 'purple';
|
||||
}
|
||||
|
||||
const ACCENT_STRIPES: Record<NonNullable<KPITileProps['accent']>, string> = {
|
||||
brand: 'bg-gradient-brand',
|
||||
success: 'bg-success',
|
||||
warning: 'bg-warning',
|
||||
mint: 'bg-mint',
|
||||
teal: 'bg-teal',
|
||||
purple: 'bg-purple',
|
||||
};
|
||||
|
||||
export function KPITile({
|
||||
title,
|
||||
value,
|
||||
delta,
|
||||
sparkline,
|
||||
accent = 'brand',
|
||||
className,
|
||||
...props
|
||||
}: KPITileProps) {
|
||||
const deltaClass =
|
||||
typeof delta === 'number'
|
||||
? delta > 0
|
||||
? 'text-success'
|
||||
: delta < 0
|
||||
? 'text-error'
|
||||
: 'text-muted-foreground'
|
||||
: '';
|
||||
const deltaPrefix = typeof delta === 'number' ? (delta > 0 ? '+' : '') : '';
|
||||
|
||||
return (
|
||||
<div
|
||||
data-testid="kpi-tile"
|
||||
className={cn(
|
||||
'group relative overflow-hidden rounded-xl border border-border bg-gradient-brand-soft p-5 shadow-sm transition-all duration-base ease-smooth hover:shadow-md',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<div className={cn('absolute inset-x-0 top-0 h-1', ACCENT_STRIPES[accent])} aria-hidden />
|
||||
<div className="flex items-start justify-between gap-4">
|
||||
<div className="min-w-0">
|
||||
<div className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
|
||||
{title}
|
||||
</div>
|
||||
<div className="mt-2 text-2xl font-semibold tabular-nums text-foreground">{value}</div>
|
||||
{typeof delta === 'number' ? (
|
||||
<div className={cn('mt-1 text-xs font-medium', deltaClass)}>
|
||||
{deltaPrefix}
|
||||
{delta}
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
{sparkline ? <div className="h-12 w-24 shrink-0 opacity-80">{sparkline}</div> : null}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
55
src/components/ui/status-pill.tsx
Normal file
55
src/components/ui/status-pill.tsx
Normal file
@@ -0,0 +1,55 @@
|
||||
import { cva, type VariantProps } from 'class-variance-authority';
|
||||
import * as React from 'react';
|
||||
|
||||
import { cn } from '@/lib/utils';
|
||||
|
||||
/**
|
||||
* Status pill — a single visual primitive for "this thing is in state X" across
|
||||
* documents, signers, reservations, interests. Replaces ad-hoc Badge variants
|
||||
* sprinkled through detail pages so the colour mapping stays consistent.
|
||||
*/
|
||||
const statusPillVariants = cva(
|
||||
'inline-flex items-center gap-1.5 rounded-md border px-2 py-0.5 text-xs font-medium transition-colors',
|
||||
{
|
||||
variants: {
|
||||
status: {
|
||||
// Document/signer lifecycle
|
||||
pending: 'border-slate-200 bg-slate-100 text-slate-700',
|
||||
sent: 'border-brand-100 bg-brand-50 text-brand-700',
|
||||
partial: 'border-teal-light bg-teal-light/40 text-teal-dark',
|
||||
signed: 'border-success-border bg-success-bg text-success',
|
||||
completed: 'border-success-border bg-success-bg text-success',
|
||||
expired: 'border-warning-border bg-warning-bg text-warning',
|
||||
rejected: 'border-error-border bg-error-bg text-error',
|
||||
cancelled: 'border-slate-300 bg-slate-200 text-slate-600',
|
||||
declined: 'border-error-border bg-error-bg text-error',
|
||||
// Reservation / interest lifecycle
|
||||
active: 'border-success-border bg-success-bg text-success',
|
||||
archived: 'border-slate-200 bg-slate-100 text-slate-500',
|
||||
// Delivered (non-signature docs in hub)
|
||||
delivered: 'border-purple-light bg-purple-light/40 text-purple-dark',
|
||||
draft: 'border-slate-200 bg-white text-slate-600',
|
||||
},
|
||||
},
|
||||
defaultVariants: {
|
||||
status: 'pending',
|
||||
},
|
||||
},
|
||||
);
|
||||
|
||||
export type StatusPillStatus = NonNullable<VariantProps<typeof statusPillVariants>['status']>;
|
||||
|
||||
interface StatusPillProps
|
||||
extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof statusPillVariants> {
|
||||
/** Optional leading dot — useful for "in-progress" style indicators. */
|
||||
withDot?: boolean;
|
||||
}
|
||||
|
||||
export function StatusPill({ status, withDot, className, children, ...props }: StatusPillProps) {
|
||||
return (
|
||||
<span className={cn(statusPillVariants({ status }), className)} {...props}>
|
||||
{withDot ? <span className="h-1.5 w-1.5 rounded-full bg-current" aria-hidden /> : null}
|
||||
{children}
|
||||
</span>
|
||||
);
|
||||
}
|
||||
@@ -10,6 +10,7 @@ import { toast } from 'sonner';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { ArchiveConfirmDialog } from '@/components/shared/archive-confirm-dialog';
|
||||
import { DetailHeaderStrip } from '@/components/shared/detail-header-strip';
|
||||
import { PermissionGate } from '@/components/shared/permission-gate';
|
||||
import { YachtForm } from '@/components/yachts/yacht-form';
|
||||
import { YachtTransferDialog } from '@/components/yachts/yacht-transfer-dialog';
|
||||
@@ -140,7 +141,7 @@ export function YachtDetailHeader({ yacht }: YachtDetailHeaderProps) {
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="space-y-3">
|
||||
<DetailHeaderStrip>
|
||||
<div className="flex items-start gap-3 flex-wrap">
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center gap-2 flex-wrap">
|
||||
@@ -197,7 +198,7 @@ export function YachtDetailHeader({ yacht }: YachtDetailHeaderProps) {
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</DetailHeaderStrip>
|
||||
|
||||
<YachtForm
|
||||
open={editOpen}
|
||||
|
||||
@@ -74,6 +74,7 @@ export function YachtList() {
|
||||
<PageHeader
|
||||
title="Yachts"
|
||||
description="Manage yacht records"
|
||||
variant="gradient"
|
||||
actions={
|
||||
<PermissionGate resource="yachts" action="create">
|
||||
<Button size="sm" onClick={() => setCreateOpen(true)}>
|
||||
|
||||
@@ -10,21 +10,33 @@ export interface ApiFetchOptions extends Omit<RequestInit, 'body'> {
|
||||
* Avoids re-fetching `/api/v1/admin/ports` on every request when the Zustand
|
||||
* store hasn't hydrated yet (fresh browser context, e2e tests, hard reload). */
|
||||
const slugToIdCache = new Map<string, string>();
|
||||
/** Dedupe in-flight admin/ports lookups so a stampede of parallel apiFetch
|
||||
* calls (typical on dashboard mount) collapses into a single network round-
|
||||
* trip instead of N. */
|
||||
let inFlightPortsLookup: Promise<Array<{ id: string; slug: string }> | null> | null = null;
|
||||
|
||||
async function resolvePortIdFromSlug(slug: string): Promise<string | null> {
|
||||
const cached = slugToIdCache.get(slug);
|
||||
if (cached) return cached;
|
||||
try {
|
||||
const res = await fetch('/api/v1/admin/ports', { credentials: 'include' });
|
||||
if (!res.ok) return null;
|
||||
const body = (await res.json()) as { data?: Array<{ id: string; slug: string }> };
|
||||
const port = body.data?.find((p) => p.slug === slug);
|
||||
if (!port) return null;
|
||||
slugToIdCache.set(slug, port.id);
|
||||
return port.id;
|
||||
} catch {
|
||||
return null;
|
||||
if (!inFlightPortsLookup) {
|
||||
inFlightPortsLookup = (async () => {
|
||||
try {
|
||||
const res = await fetch('/api/v1/admin/ports', { credentials: 'include' });
|
||||
if (!res.ok) return null;
|
||||
const body = (await res.json()) as { data?: Array<{ id: string; slug: string }> };
|
||||
return body.data ?? null;
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
})().finally(() => {
|
||||
inFlightPortsLookup = null;
|
||||
});
|
||||
}
|
||||
const ports = await inFlightPortsLookup;
|
||||
const port = ports?.find((p) => p.slug === slug);
|
||||
if (!port) return null;
|
||||
slugToIdCache.set(slug, port.id);
|
||||
return port.id;
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -17,4 +17,10 @@ export const db = drizzle(queryClient, {
|
||||
logger: process.env.NODE_ENV === 'development',
|
||||
});
|
||||
|
||||
/** Close the underlying connection pool. Used by the vitest teardown so
|
||||
* the parent process can exit cleanly. */
|
||||
export async function closeDb(): Promise<void> {
|
||||
await queryClient.end({ timeout: 5 });
|
||||
}
|
||||
|
||||
export type Database = typeof db;
|
||||
|
||||
25
src/lib/db/migrations/0013_abnormal_thundra.sql
Normal file
25
src/lib/db/migrations/0013_abnormal_thundra.sql
Normal file
@@ -0,0 +1,25 @@
|
||||
CREATE TABLE "document_watchers" (
|
||||
"document_id" text NOT NULL,
|
||||
"user_id" text NOT NULL,
|
||||
"added_by" text NOT NULL,
|
||||
"added_at" timestamp with time zone DEFAULT now() NOT NULL,
|
||||
CONSTRAINT "document_watchers_document_id_user_id_pk" PRIMARY KEY("document_id","user_id")
|
||||
);
|
||||
--> statement-breakpoint
|
||||
ALTER TABLE "document_templates" ALTER COLUMN "body_html" DROP NOT NULL;--> statement-breakpoint
|
||||
ALTER TABLE "document_templates" ADD COLUMN "template_format" text DEFAULT 'html' NOT NULL;--> statement-breakpoint
|
||||
ALTER TABLE "document_templates" ADD COLUMN "source_file_id" text;--> statement-breakpoint
|
||||
ALTER TABLE "document_templates" ADD COLUMN "documenso_template_id" text;--> statement-breakpoint
|
||||
ALTER TABLE "document_templates" ADD COLUMN "field_mapping" jsonb DEFAULT '{}'::jsonb NOT NULL;--> statement-breakpoint
|
||||
ALTER TABLE "document_templates" ADD COLUMN "overlay_positions" jsonb DEFAULT '[]'::jsonb NOT NULL;--> statement-breakpoint
|
||||
ALTER TABLE "document_templates" ADD COLUMN "reminder_cadence_days" integer;--> statement-breakpoint
|
||||
ALTER TABLE "documents" ADD COLUMN "reservation_id" text;--> statement-breakpoint
|
||||
ALTER TABLE "documents" ADD COLUMN "reminders_disabled" boolean DEFAULT false NOT NULL;--> statement-breakpoint
|
||||
ALTER TABLE "documents" ADD COLUMN "reminder_cadence_override" integer;--> statement-breakpoint
|
||||
ALTER TABLE "document_watchers" ADD CONSTRAINT "document_watchers_document_id_documents_id_fk" FOREIGN KEY ("document_id") REFERENCES "public"."documents"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
|
||||
CREATE INDEX "idx_doc_watchers_doc" ON "document_watchers" USING btree ("document_id");--> statement-breakpoint
|
||||
CREATE INDEX "idx_doc_watchers_user" ON "document_watchers" USING btree ("user_id");--> statement-breakpoint
|
||||
ALTER TABLE "document_templates" ADD CONSTRAINT "document_templates_source_file_id_files_id_fk" FOREIGN KEY ("source_file_id") REFERENCES "public"."files"("id") ON DELETE no action ON UPDATE no action;--> statement-breakpoint
|
||||
CREATE INDEX "idx_docs_reservation" ON "documents" USING btree ("reservation_id");--> statement-breakpoint
|
||||
CREATE INDEX "idx_docs_status_port" ON "documents" USING btree ("port_id","status");--> statement-breakpoint
|
||||
UPDATE "document_templates" SET "reminder_cadence_days" = 1 WHERE "template_type" = 'eoi';
|
||||
9419
src/lib/db/migrations/meta/0013_snapshot.json
Normal file
9419
src/lib/db/migrations/meta/0013_snapshot.json
Normal file
File diff suppressed because it is too large
Load Diff
@@ -92,6 +92,13 @@
|
||||
"when": 1777308900666,
|
||||
"tag": "0012_large_zarda",
|
||||
"breakpoints": true
|
||||
},
|
||||
{
|
||||
"idx": 13,
|
||||
"version": "7",
|
||||
"when": 1777334766194,
|
||||
"tag": "0013_abnormal_thundra",
|
||||
"breakpoints": true
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import {
|
||||
pgTable,
|
||||
primaryKey,
|
||||
text,
|
||||
boolean,
|
||||
integer,
|
||||
@@ -55,6 +56,7 @@ export const documents = pgTable(
|
||||
clientId: text('client_id').references(() => clients.id),
|
||||
yachtId: text('yacht_id'), // FK wired in relations.ts
|
||||
companyId: text('company_id'), // FK wired in relations.ts
|
||||
reservationId: text('reservation_id'), // FK wired in relations.ts
|
||||
documentType: text('document_type').notNull(), // eoi, contract, nda, reservation_agreement, other
|
||||
title: text('title').notNull(),
|
||||
status: text('status').notNull().default('draft'), // draft, sent, partially_signed, completed, expired, cancelled
|
||||
@@ -63,6 +65,8 @@ export const documents = pgTable(
|
||||
signedFileId: text('signed_file_id').references(() => files.id),
|
||||
isManualUpload: boolean('is_manual_upload').notNull().default(false),
|
||||
notes: text('notes'),
|
||||
remindersDisabled: boolean('reminders_disabled').notNull().default(false),
|
||||
reminderCadenceOverride: integer('reminder_cadence_override'),
|
||||
createdBy: text('created_by').notNull(),
|
||||
createdAt: timestamp('created_at', { withTimezone: true }).notNull().defaultNow(),
|
||||
updatedAt: timestamp('updated_at', { withTimezone: true }).notNull().defaultNow(),
|
||||
@@ -73,7 +77,9 @@ export const documents = pgTable(
|
||||
index('idx_docs_client').on(table.clientId),
|
||||
index('idx_documents_yacht').on(table.yachtId),
|
||||
index('idx_documents_company').on(table.companyId),
|
||||
index('idx_docs_reservation').on(table.reservationId),
|
||||
index('idx_docs_type').on(table.portId, table.documentType),
|
||||
index('idx_docs_status_port').on(table.portId, table.status),
|
||||
],
|
||||
);
|
||||
|
||||
@@ -134,8 +140,19 @@ export const documentTemplates = pgTable(
|
||||
name: text('name').notNull(),
|
||||
description: text('description'),
|
||||
templateType: text('template_type').notNull(), // welcome_letter, handover_checklist, acknowledgment, correspondence, custom
|
||||
bodyHtml: text('body_html').notNull(),
|
||||
// Nullable: only required when template_format='html'.
|
||||
bodyHtml: text('body_html'),
|
||||
mergeFields: jsonb('merge_fields').notNull().default([]),
|
||||
// 'html' | 'pdf_form' | 'pdf_overlay' | 'documenso_render'
|
||||
templateFormat: text('template_format').notNull().default('html'),
|
||||
sourceFileId: text('source_file_id').references(() => files.id),
|
||||
documensoTemplateId: text('documenso_template_id'),
|
||||
// pdf_form: { acroFieldName: mergeToken }
|
||||
fieldMapping: jsonb('field_mapping').notNull().default({}),
|
||||
// pdf_overlay: [{ token, page, x, y, fontSize }]
|
||||
overlayPositions: jsonb('overlay_positions').notNull().default([]),
|
||||
// null = no auto-reminders
|
||||
reminderCadenceDays: integer('reminder_cadence_days'),
|
||||
isActive: boolean('is_active').notNull().default(true),
|
||||
createdBy: text('created_by').notNull(),
|
||||
createdAt: timestamp('created_at', { withTimezone: true }).notNull().defaultNow(),
|
||||
@@ -147,6 +164,23 @@ export const documentTemplates = pgTable(
|
||||
],
|
||||
);
|
||||
|
||||
export const documentWatchers = pgTable(
|
||||
'document_watchers',
|
||||
{
|
||||
documentId: text('document_id')
|
||||
.notNull()
|
||||
.references(() => documents.id, { onDelete: 'cascade' }),
|
||||
userId: text('user_id').notNull(),
|
||||
addedBy: text('added_by').notNull(),
|
||||
addedAt: timestamp('added_at', { withTimezone: true }).notNull().defaultNow(),
|
||||
},
|
||||
(table) => [
|
||||
primaryKey({ columns: [table.documentId, table.userId] }),
|
||||
index('idx_doc_watchers_doc').on(table.documentId),
|
||||
index('idx_doc_watchers_user').on(table.userId),
|
||||
],
|
||||
);
|
||||
|
||||
export const formTemplates = pgTable(
|
||||
'form_templates',
|
||||
{
|
||||
@@ -200,6 +234,8 @@ export type DocumentEvent = typeof documentEvents.$inferSelect;
|
||||
export type NewDocumentEvent = typeof documentEvents.$inferInsert;
|
||||
export type DocumentTemplate = typeof documentTemplates.$inferSelect;
|
||||
export type NewDocumentTemplate = typeof documentTemplates.$inferInsert;
|
||||
export type DocumentWatcher = typeof documentWatchers.$inferSelect;
|
||||
export type NewDocumentWatcher = typeof documentWatchers.$inferInsert;
|
||||
export type FormTemplate = typeof formTemplates.$inferSelect;
|
||||
export type NewFormTemplate = typeof formTemplates.$inferInsert;
|
||||
export type FormSubmission = typeof formSubmissions.$inferSelect;
|
||||
|
||||
@@ -52,6 +52,7 @@ import {
|
||||
documentSigners,
|
||||
documentEvents,
|
||||
documentTemplates,
|
||||
documentWatchers,
|
||||
formTemplates,
|
||||
formSubmissions,
|
||||
} from './documents';
|
||||
@@ -457,7 +458,7 @@ export const berthTagsRelations = relations(berthTags, ({ one }) => ({
|
||||
|
||||
// ─── Berth Reservations ───────────────────────────────────────────────────────
|
||||
|
||||
export const berthReservationsRelations = relations(berthReservations, ({ one }) => ({
|
||||
export const berthReservationsRelations = relations(berthReservations, ({ one, many }) => ({
|
||||
berth: one(berths, {
|
||||
fields: [berthReservations.berthId],
|
||||
references: [berths.id],
|
||||
@@ -482,6 +483,7 @@ export const berthReservationsRelations = relations(berthReservations, ({ one })
|
||||
fields: [berthReservations.contractFileId],
|
||||
references: [files.id],
|
||||
}),
|
||||
documents: many(documents),
|
||||
}));
|
||||
|
||||
// ─── Documents ────────────────────────────────────────────────────────────────
|
||||
@@ -538,8 +540,13 @@ export const documentsRelations = relations(documents, ({ one, many }) => ({
|
||||
fields: [documents.companyId],
|
||||
references: [companies.id],
|
||||
}),
|
||||
reservation: one(berthReservations, {
|
||||
fields: [documents.reservationId],
|
||||
references: [berthReservations.id],
|
||||
}),
|
||||
signers: many(documentSigners),
|
||||
events: many(documentEvents),
|
||||
watchers: many(documentWatchers),
|
||||
}));
|
||||
|
||||
export const documentSignersRelations = relations(documentSigners, ({ one, many }) => ({
|
||||
@@ -566,6 +573,17 @@ export const documentTemplatesRelations = relations(documentTemplates, ({ one })
|
||||
fields: [documentTemplates.portId],
|
||||
references: [ports.id],
|
||||
}),
|
||||
sourceFile: one(files, {
|
||||
fields: [documentTemplates.sourceFileId],
|
||||
references: [files.id],
|
||||
}),
|
||||
}));
|
||||
|
||||
export const documentWatchersRelations = relations(documentWatchers, ({ one }) => ({
|
||||
document: one(documents, {
|
||||
fields: [documentWatchers.documentId],
|
||||
references: [documents.id],
|
||||
}),
|
||||
}));
|
||||
|
||||
export const formTemplatesRelations = relations(formTemplates, ({ one, many }) => ({
|
||||
|
||||
@@ -33,6 +33,11 @@ function createTransporterFromConfig(cfg: PortEmailConfig): Transporter {
|
||||
});
|
||||
}
|
||||
|
||||
export interface EmailAttachmentRef {
|
||||
fileId: string;
|
||||
filename?: string;
|
||||
}
|
||||
|
||||
export interface SendEmailOptions {
|
||||
to: string | string[];
|
||||
subject: string;
|
||||
@@ -41,6 +46,50 @@ export interface SendEmailOptions {
|
||||
/** When provided, port-level email settings override env defaults. */
|
||||
portId?: string;
|
||||
text?: string;
|
||||
/**
|
||||
* File attachments to fetch from MinIO and attach to the message.
|
||||
* Resolution + cross-port enforcement happens via `resolveAttachments`
|
||||
* before the SMTP call.
|
||||
*/
|
||||
attachments?: EmailAttachmentRef[];
|
||||
}
|
||||
|
||||
/**
|
||||
* Resolve attachment refs to nodemailer attachment payloads. Reads each file
|
||||
* from MinIO and enforces port-isolation: an attachment that doesn't belong
|
||||
* to `portId` throws ForbiddenError. Returns an empty array when no refs
|
||||
* are provided.
|
||||
*/
|
||||
async function resolveAttachments(
|
||||
refs: EmailAttachmentRef[] | undefined,
|
||||
portId: string | undefined,
|
||||
): Promise<Array<{ filename: string; content: Buffer; contentType?: string }>> {
|
||||
if (!refs || refs.length === 0) return [];
|
||||
const { db } = await import('@/lib/db');
|
||||
const { files } = await import('@/lib/db/schema/documents');
|
||||
const { eq } = await import('drizzle-orm');
|
||||
const { ForbiddenError, NotFoundError } = await import('@/lib/errors');
|
||||
const { minioClient } = await import('@/lib/minio');
|
||||
|
||||
return Promise.all(
|
||||
refs.map(async (ref) => {
|
||||
const file = await db.query.files.findFirst({ where: eq(files.id, ref.fileId) });
|
||||
if (!file) throw new NotFoundError('File');
|
||||
if (portId && file.portId !== portId) {
|
||||
throw new ForbiddenError('File belongs to a different port');
|
||||
}
|
||||
const stream = await minioClient.getObject(file.storageBucket, file.storagePath);
|
||||
const chunks: Buffer[] = [];
|
||||
for await (const chunk of stream) {
|
||||
chunks.push(Buffer.isBuffer(chunk) ? chunk : Buffer.from(chunk));
|
||||
}
|
||||
return {
|
||||
filename: ref.filename ?? file.originalName,
|
||||
content: Buffer.concat(chunks),
|
||||
...(file.mimeType ? { contentType: file.mimeType } : {}),
|
||||
};
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -57,6 +106,7 @@ export async function sendEmail(
|
||||
from?: string,
|
||||
text?: string,
|
||||
portId?: string,
|
||||
attachments?: EmailAttachmentRef[],
|
||||
): Promise<nodemailer.SentMessageInfo> {
|
||||
const cfg = portId ? await getPortEmailConfig(portId) : null;
|
||||
const transporter = cfg ? createTransporterFromConfig(cfg) : createTransporter();
|
||||
@@ -73,6 +123,8 @@ export async function sendEmail(
|
||||
env.SMTP_FROM ??
|
||||
`Port Nimara CRM <noreply@${env.SMTP_HOST}>`;
|
||||
|
||||
const resolvedAttachments = await resolveAttachments(attachments, portId);
|
||||
|
||||
const info = await transporter.sendMail({
|
||||
from: fromHeader,
|
||||
to: effectiveTo,
|
||||
@@ -80,6 +132,7 @@ export async function sendEmail(
|
||||
html,
|
||||
...(cfg?.replyTo ? { replyTo: cfg.replyTo } : {}),
|
||||
...(text ? { text } : {}),
|
||||
...(resolvedAttachments.length > 0 ? { attachments: resolvedAttachments } : {}),
|
||||
});
|
||||
|
||||
logger.debug(
|
||||
|
||||
@@ -23,6 +23,7 @@ const envSchema = z.object({
|
||||
// Documenso
|
||||
DOCUMENSO_API_URL: z.string().url(),
|
||||
DOCUMENSO_API_KEY: z.string().min(1),
|
||||
DOCUMENSO_API_VERSION: z.enum(['v1', 'v2']).default('v1'),
|
||||
DOCUMENSO_WEBHOOK_SECRET: z.string().min(16),
|
||||
DOCUMENSO_TEMPLATE_ID_EOI: z.coerce.number().int().positive().default(8),
|
||||
DOCUMENSO_CLIENT_RECIPIENT_ID: z.coerce.number().int().positive().default(192),
|
||||
|
||||
@@ -1,16 +1,23 @@
|
||||
import { env } from '@/lib/env';
|
||||
import { logger } from '@/lib/logger';
|
||||
import { getPortDocumensoConfig } from '@/lib/services/port-config';
|
||||
import { getPortDocumensoConfig, type DocumensoApiVersion } from '@/lib/services/port-config';
|
||||
|
||||
interface DocumensoCreds {
|
||||
baseUrl: string;
|
||||
apiKey: string;
|
||||
apiVersion: DocumensoApiVersion;
|
||||
}
|
||||
|
||||
async function resolveCreds(portId?: string): Promise<DocumensoCreds> {
|
||||
if (!portId) return { baseUrl: env.DOCUMENSO_API_URL, apiKey: env.DOCUMENSO_API_KEY };
|
||||
if (!portId) {
|
||||
return {
|
||||
baseUrl: env.DOCUMENSO_API_URL,
|
||||
apiKey: env.DOCUMENSO_API_KEY,
|
||||
apiVersion: env.DOCUMENSO_API_VERSION,
|
||||
};
|
||||
}
|
||||
const cfg = await getPortDocumensoConfig(portId);
|
||||
return { baseUrl: cfg.apiUrl, apiKey: cfg.apiKey };
|
||||
return { baseUrl: cfg.apiUrl, apiKey: cfg.apiKey, apiVersion: cfg.apiVersion };
|
||||
}
|
||||
|
||||
async function documensoFetch(
|
||||
@@ -169,3 +176,198 @@ export async function checkDocumensoHealth(
|
||||
return { ok: false, error: err instanceof Error ? err.message : 'Unknown error' };
|
||||
}
|
||||
}
|
||||
|
||||
// ─── Version-aware abstractions (Phase A PR2) ─────────────────────────────────
|
||||
//
|
||||
// Documenso v1.13 and v2.x diverge on field placement and document deletion:
|
||||
//
|
||||
// v1.13: per-field POST /api/v1/documents/{id}/fields with PIXEL coords;
|
||||
// DELETE /api/v1/documents/{id} for void.
|
||||
// v2.x: bulk POST /api/v2/envelope/field/create-many with PERCENT
|
||||
// coords (0-100) and rich `fieldMeta`;
|
||||
// DELETE /api/v2/envelope/{id} for void.
|
||||
//
|
||||
// Callers always work in PERCENT (0-100). For v1 the abstraction multiplies by
|
||||
// the page dimensions returned by Documenso (cached per docId for the lifetime
|
||||
// of the process — fields for a given doc usually go in a single batch).
|
||||
|
||||
export type DocumensoFieldType = 'SIGNATURE' | 'INITIALS' | 'DATE' | 'TEXT' | 'EMAIL';
|
||||
|
||||
export interface DocumensoFieldPlacement {
|
||||
/** Documenso recipient id; v1 expects number, v2 string — coerced internally. */
|
||||
recipientId: number | string;
|
||||
type: DocumensoFieldType;
|
||||
pageNumber: number;
|
||||
/** All four are 0-100 percent of page dimensions. */
|
||||
pageX: number;
|
||||
pageY: number;
|
||||
pageWidth: number;
|
||||
pageHeight: number;
|
||||
/** Optional v2 fieldMeta — passed through verbatim, ignored on v1. */
|
||||
fieldMeta?: Record<string, unknown>;
|
||||
}
|
||||
|
||||
export interface DocumensoPageDimensions {
|
||||
width: number;
|
||||
height: number;
|
||||
}
|
||||
|
||||
const DEFAULT_PAGE_DIMENSIONS: DocumensoPageDimensions = { width: 595, height: 842 }; // A4 pt
|
||||
|
||||
const pageDimensionCache = new Map<string, DocumensoPageDimensions>();
|
||||
|
||||
/** Test seam — clears the page-dimension memoization. */
|
||||
export function __resetDocumensoCachesForTests(): void {
|
||||
pageDimensionCache.clear();
|
||||
}
|
||||
|
||||
async function getPageDimensions(docId: string, portId?: string): Promise<DocumensoPageDimensions> {
|
||||
const cached = pageDimensionCache.get(docId);
|
||||
if (cached) return cached;
|
||||
// v1 doesn't expose page dimensions cleanly via the public API; the auto-
|
||||
// placement use case is footer-anchored signature fields, where a default A4
|
||||
// page rendered by Documenso is a safe assumption. Real page dims can be
|
||||
// wired in a follow-up by parsing the document/document-data endpoints.
|
||||
void portId;
|
||||
pageDimensionCache.set(docId, DEFAULT_PAGE_DIMENSIONS);
|
||||
return DEFAULT_PAGE_DIMENSIONS;
|
||||
}
|
||||
|
||||
/**
|
||||
* Place one or more fields on a Documenso document. Coordinates are PERCENT
|
||||
* (0-100) and converted to pixels for v1 internally.
|
||||
*
|
||||
* v1: dispatches one POST per field (no bulk endpoint).
|
||||
* v2: single bulk POST.
|
||||
*/
|
||||
export async function placeFields(
|
||||
docId: string,
|
||||
fields: DocumensoFieldPlacement[],
|
||||
portId?: string,
|
||||
): Promise<void> {
|
||||
if (fields.length === 0) return;
|
||||
const { baseUrl, apiKey, apiVersion } = await resolveCreds(portId);
|
||||
|
||||
if (apiVersion === 'v2') {
|
||||
const v2Fields = fields.map((f) => ({
|
||||
recipientId: String(f.recipientId),
|
||||
type: f.type,
|
||||
pageNumber: f.pageNumber,
|
||||
positionX: f.pageX,
|
||||
positionY: f.pageY,
|
||||
width: f.pageWidth,
|
||||
height: f.pageHeight,
|
||||
...(f.fieldMeta ? { fieldMeta: f.fieldMeta } : {}),
|
||||
}));
|
||||
// Note: v2 endpoint shape (envelopeId/recipientId types) must be
|
||||
// confirmed against a live Documenso 2.x instance — see PR11 realapi
|
||||
// suite. Spec risk register flags this drift as the top v2 risk.
|
||||
const res = await fetch(`${baseUrl}/api/v2/envelope/field/create-many`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
Authorization: `Bearer ${apiKey}`,
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ envelopeId: docId, fields: v2Fields }),
|
||||
});
|
||||
if (!res.ok) {
|
||||
const err = await res.text();
|
||||
logger.error({ docId, status: res.status, err, portId }, 'Documenso v2 placeFields error');
|
||||
throw new Error(`Documenso v2 placeFields error: ${res.status}`);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
const dims = await getPageDimensions(docId, portId);
|
||||
for (const f of fields) {
|
||||
const body = {
|
||||
recipientId: typeof f.recipientId === 'string' ? Number(f.recipientId) : f.recipientId,
|
||||
type: f.type,
|
||||
pageNumber: f.pageNumber,
|
||||
pageX: Math.round((f.pageX / 100) * dims.width),
|
||||
pageY: Math.round((f.pageY / 100) * dims.height),
|
||||
pageWidth: Math.round((f.pageWidth / 100) * dims.width),
|
||||
pageHeight: Math.round((f.pageHeight / 100) * dims.height),
|
||||
};
|
||||
const res = await fetch(`${baseUrl}/api/v1/documents/${docId}/fields`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
Authorization: `Bearer ${apiKey}`,
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(body),
|
||||
});
|
||||
if (!res.ok) {
|
||||
const err = await res.text();
|
||||
logger.error({ docId, status: res.status, err, portId }, 'Documenso v1 placeField error');
|
||||
throw new Error(`Documenso v1 placeField error: ${res.status}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Auto-position one SIGNATURE field per recipient at the last-page footer,
|
||||
* staggered horizontally so multiple signers don't overlap. Used by the
|
||||
* upload-path wizard — admins can refine in Documenso afterwards.
|
||||
*
|
||||
* Layout (percent of page):
|
||||
* y = 88 (footer band)
|
||||
* height = 6
|
||||
* width = min(20, 80 / N)
|
||||
* x = i * (80/N) + (40 - 80/N * N / 2) (centered row)
|
||||
*/
|
||||
export async function placeDefaultSignatureFields(
|
||||
docId: string,
|
||||
recipients: Array<{ id: number | string; pageNumber: number }>,
|
||||
portId?: string,
|
||||
): Promise<void> {
|
||||
if (recipients.length === 0) return;
|
||||
const fields: DocumensoFieldPlacement[] = computeDefaultSignatureLayout(recipients);
|
||||
await placeFields(docId, fields, portId);
|
||||
}
|
||||
|
||||
/** Pure function exported for unit testing layout math. */
|
||||
export function computeDefaultSignatureLayout(
|
||||
recipients: Array<{ id: number | string; pageNumber: number }>,
|
||||
): DocumensoFieldPlacement[] {
|
||||
const n = recipients.length;
|
||||
if (n === 0) return [];
|
||||
const slot = Math.min(20, 80 / n); // percent width per signer
|
||||
const rowWidth = slot * n;
|
||||
const startX = 50 - rowWidth / 2;
|
||||
return recipients.map((r, i) => ({
|
||||
recipientId: r.id,
|
||||
type: 'SIGNATURE',
|
||||
pageNumber: r.pageNumber,
|
||||
pageX: Math.max(0, startX + i * slot),
|
||||
pageY: 88,
|
||||
pageWidth: slot,
|
||||
pageHeight: 6,
|
||||
}));
|
||||
}
|
||||
|
||||
/**
|
||||
* Void/cancel a Documenso document.
|
||||
*
|
||||
* v1: DELETE /api/v1/documents/{id}
|
||||
* v2: DELETE /api/v2/envelope/{id}
|
||||
*
|
||||
* Idempotent on 404 (already gone) — logs and resolves.
|
||||
*/
|
||||
export async function voidDocument(docId: string, portId?: string): Promise<void> {
|
||||
const { baseUrl, apiKey, apiVersion } = await resolveCreds(portId);
|
||||
const path = apiVersion === 'v2' ? `/api/v2/envelope/${docId}` : `/api/v1/documents/${docId}`;
|
||||
const res = await fetch(`${baseUrl}${path}`, {
|
||||
method: 'DELETE',
|
||||
headers: { Authorization: `Bearer ${apiKey}` },
|
||||
});
|
||||
if (res.status === 404) {
|
||||
logger.warn({ docId, portId }, 'Documenso voidDocument: already deleted');
|
||||
return;
|
||||
}
|
||||
if (!res.ok) {
|
||||
const err = await res.text();
|
||||
logger.error({ docId, status: res.status, err, portId }, 'Documenso voidDocument error');
|
||||
throw new Error(`Documenso voidDocument error: ${res.status}`);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,13 +1,17 @@
|
||||
import { and, eq, inArray } from 'drizzle-orm';
|
||||
import { and, eq, inArray, isNotNull, sql } from 'drizzle-orm';
|
||||
|
||||
import { db } from '@/lib/db';
|
||||
import { documents, documentSigners, documentEvents } from '@/lib/db/schema/documents';
|
||||
import { interests } from '@/lib/db/schema/interests';
|
||||
import {
|
||||
documents,
|
||||
documentSigners,
|
||||
documentEvents,
|
||||
documentTemplates,
|
||||
} from '@/lib/db/schema/documents';
|
||||
import { ports } from '@/lib/db/schema/ports';
|
||||
import { sendReminder as documensoRemind } from '@/lib/services/documenso-client';
|
||||
import { logger } from '@/lib/logger';
|
||||
|
||||
// BR-023: Reminders only during 9-16 in port timezone, with 24h cooldown
|
||||
// ─── Helpers ─────────────────────────────────────────────────────────────────
|
||||
|
||||
function getCurrentHourInTimezone(timezone: string): number {
|
||||
const now = new Date();
|
||||
@@ -19,105 +23,189 @@ function getCurrentHourInTimezone(timezone: string): number {
|
||||
return parseInt(formatter.format(now), 10);
|
||||
}
|
||||
|
||||
interface ReminderEligibilityArgs {
|
||||
status: string;
|
||||
documensoId: string | null;
|
||||
remindersDisabled: boolean;
|
||||
reminderCadenceOverride: number | null;
|
||||
templateCadenceDays: number | null;
|
||||
lastReminderAt: Date | null;
|
||||
now?: Date;
|
||||
}
|
||||
|
||||
/**
|
||||
* Pure cadence/disable check used by the cron path. Auto-mode reminders
|
||||
* additionally enforce the 9–16 port-timezone window, which lives in the
|
||||
* caller below.
|
||||
*/
|
||||
export function isReminderDue(args: ReminderEligibilityArgs): boolean {
|
||||
const now = args.now ?? new Date();
|
||||
if (!['sent', 'partially_signed'].includes(args.status)) return false;
|
||||
if (args.documensoId == null) return false;
|
||||
if (args.remindersDisabled) return false;
|
||||
|
||||
const cadence = args.reminderCadenceOverride ?? args.templateCadenceDays;
|
||||
if (cadence === null) return false;
|
||||
|
||||
if (args.lastReminderAt == null) return true;
|
||||
const elapsedMs = now.getTime() - args.lastReminderAt.getTime();
|
||||
return elapsedMs >= cadence * 24 * 60 * 60 * 1000;
|
||||
}
|
||||
|
||||
// ─── sendReminderIfAllowed ───────────────────────────────────────────────────
|
||||
|
||||
export interface SendReminderOptions {
|
||||
/** true = cron auto-fire, enforces 9-16 window + cadence cooldown.
|
||||
* false (default) = manual UI action, bypasses both. */
|
||||
auto?: boolean;
|
||||
/** Optional — target a specific pending signer (parallel mode), or
|
||||
* bypass the lowest-pending default in sequential mode (must still be the
|
||||
* next pending signer in that case). */
|
||||
signerId?: string;
|
||||
}
|
||||
|
||||
export interface SendReminderResult {
|
||||
sent: boolean;
|
||||
reason?: string;
|
||||
signerId?: string;
|
||||
}
|
||||
|
||||
export async function sendReminderIfAllowed(
|
||||
documentId: string,
|
||||
portId: string,
|
||||
): Promise<boolean> {
|
||||
options: SendReminderOptions = {},
|
||||
): Promise<SendReminderResult> {
|
||||
const { auto = false, signerId } = options;
|
||||
|
||||
const doc = await db.query.documents.findFirst({
|
||||
where: and(eq(documents.id, documentId), eq(documents.portId, portId)),
|
||||
});
|
||||
|
||||
if (!doc || !doc.interestId || !doc.documensoId) return false;
|
||||
if (!['sent', 'partially_signed'].includes(doc.status)) return false;
|
||||
|
||||
// Check interest.reminderEnabled
|
||||
const interest = await db.query.interests.findFirst({
|
||||
where: eq(interests.id, doc.interestId),
|
||||
});
|
||||
|
||||
if (!interest?.reminderEnabled) return false;
|
||||
|
||||
// Check port timezone
|
||||
const port = await db.query.ports.findFirst({
|
||||
where: eq(ports.id, portId),
|
||||
});
|
||||
|
||||
const timezone = port?.timezone ?? 'UTC';
|
||||
const currentHour = getCurrentHourInTimezone(timezone);
|
||||
|
||||
if (currentHour < 9 || currentHour >= 16) return false;
|
||||
|
||||
// Check 24h cooldown — last reminder_sent event for this document
|
||||
const twentyFourHoursAgo = new Date(Date.now() - 24 * 60 * 60 * 1000);
|
||||
|
||||
const lastReminder = await db.query.documentEvents.findFirst({
|
||||
where: and(
|
||||
eq(documentEvents.documentId, documentId),
|
||||
eq(documentEvents.eventType, 'reminder_sent'),
|
||||
),
|
||||
orderBy: (de, { desc }) => [desc(de.createdAt)],
|
||||
});
|
||||
|
||||
if (lastReminder && lastReminder.createdAt > twentyFourHoursAgo) {
|
||||
return false;
|
||||
if (!doc) return { sent: false, reason: 'Document not found' };
|
||||
if (!doc.documensoId) return { sent: false, reason: 'Document has no Documenso id' };
|
||||
if (!['sent', 'partially_signed'].includes(doc.status)) {
|
||||
return { sent: false, reason: `Document is ${doc.status}` };
|
||||
}
|
||||
if (doc.remindersDisabled) {
|
||||
return { sent: false, reason: 'Reminders disabled for this document' };
|
||||
}
|
||||
|
||||
// Find current pending signer (lowest signingOrder with status='pending')
|
||||
const pendingSigner = await db.query.documentSigners.findFirst({
|
||||
where: and(
|
||||
eq(documentSigners.documentId, documentId),
|
||||
eq(documentSigners.status, 'pending'),
|
||||
),
|
||||
orderBy: (ds, { asc }) => [asc(ds.signingOrder)],
|
||||
});
|
||||
// Resolve effective cadence (override → template → null/disabled)
|
||||
let templateCadenceDays: number | null = null;
|
||||
if (auto) {
|
||||
// Auto path needs a cadence to fire at all; manual sends bypass cadence.
|
||||
// We still load the template cadence so `isReminderDue` has the input.
|
||||
const templateRow = doc.fileId
|
||||
? await db.query.documentTemplates.findFirst({
|
||||
// Fallback: look up by document type if no explicit template_id.
|
||||
where: and(
|
||||
eq(documentTemplates.portId, portId),
|
||||
eq(documentTemplates.templateType, doc.documentType),
|
||||
),
|
||||
})
|
||||
: null;
|
||||
templateCadenceDays = templateRow?.reminderCadenceDays ?? null;
|
||||
|
||||
if (!pendingSigner) return false;
|
||||
const lastReminder = await db.query.documentEvents.findFirst({
|
||||
where: and(
|
||||
eq(documentEvents.documentId, documentId),
|
||||
eq(documentEvents.eventType, 'reminder_sent'),
|
||||
),
|
||||
orderBy: (de, { desc }) => [desc(de.createdAt)],
|
||||
});
|
||||
|
||||
const due = isReminderDue({
|
||||
status: doc.status,
|
||||
documensoId: doc.documensoId,
|
||||
remindersDisabled: doc.remindersDisabled,
|
||||
reminderCadenceOverride: doc.reminderCadenceOverride,
|
||||
templateCadenceDays,
|
||||
lastReminderAt: lastReminder?.createdAt ?? null,
|
||||
});
|
||||
if (!due) return { sent: false, reason: 'Cadence cooldown' };
|
||||
|
||||
// Auto only: 9-16 window in port timezone
|
||||
const port = await db.query.ports.findFirst({ where: eq(ports.id, portId) });
|
||||
const timezone = port?.timezone ?? 'UTC';
|
||||
const currentHour = getCurrentHourInTimezone(timezone);
|
||||
if (currentHour < 9 || currentHour >= 16) {
|
||||
return { sent: false, reason: 'Outside 9-16 port-timezone window' };
|
||||
}
|
||||
}
|
||||
|
||||
// Pick the signer to nudge.
|
||||
const pendingSigners = await db
|
||||
.select()
|
||||
.from(documentSigners)
|
||||
.where(and(eq(documentSigners.documentId, documentId), eq(documentSigners.status, 'pending')))
|
||||
.orderBy(sql`${documentSigners.signingOrder} ASC`);
|
||||
if (pendingSigners.length === 0) {
|
||||
return { sent: false, reason: 'No pending signers' };
|
||||
}
|
||||
|
||||
let target = pendingSigners[0]!;
|
||||
|
||||
if (signerId) {
|
||||
const requested = pendingSigners.find((s) => s.id === signerId);
|
||||
if (!requested) {
|
||||
return { sent: false, reason: 'Signer is not pending' };
|
||||
}
|
||||
// Sequential mode: require the lowest pending order.
|
||||
if (requested.signingOrder !== pendingSigners[0]!.signingOrder) {
|
||||
return { sent: false, reason: 'Signer is not next in sequence' };
|
||||
}
|
||||
target = requested;
|
||||
}
|
||||
|
||||
// Send reminder via Documenso
|
||||
try {
|
||||
await documensoRemind(doc.documensoId, pendingSigner.id);
|
||||
await documensoRemind(doc.documensoId, target.id, portId);
|
||||
} catch (err) {
|
||||
logger.error({ err, documentId, signerId: pendingSigner.id }, 'Failed to send Documenso reminder');
|
||||
return false;
|
||||
logger.error({ err, documentId, signerId: target.id }, 'Documenso reminder failed');
|
||||
return { sent: false, reason: 'Documenso reminder failed' };
|
||||
}
|
||||
|
||||
// Record event
|
||||
await db.insert(documentEvents).values({
|
||||
documentId,
|
||||
eventType: 'reminder_sent',
|
||||
signerId: pendingSigner.id,
|
||||
eventData: { signerEmail: pendingSigner.signerEmail, signerRole: pendingSigner.signerRole },
|
||||
signerId: target.id,
|
||||
eventData: {
|
||||
signerEmail: target.signerEmail,
|
||||
signerRole: target.signerRole,
|
||||
auto,
|
||||
},
|
||||
});
|
||||
|
||||
return true;
|
||||
return { sent: true, signerId: target.id };
|
||||
}
|
||||
|
||||
// ─── processReminderQueue ────────────────────────────────────────────────────
|
||||
|
||||
/**
|
||||
* Cron entry point. Selects in-flight documents whose effective cadence
|
||||
* (override or template) is set, then attempts auto-fire on each.
|
||||
* `interests.reminderEnabled` is no longer part of the gating — per-doc
|
||||
* `remindersDisabled` is the kill switch instead.
|
||||
*/
|
||||
export async function processReminderQueue(portId: string): Promise<void> {
|
||||
// Find all documents with status 'sent' or 'partially_signed' linked to interests with reminderEnabled=true
|
||||
const activeInterests = await db.query.interests.findMany({
|
||||
where: and(
|
||||
eq(interests.portId, portId),
|
||||
eq(interests.reminderEnabled, true),
|
||||
),
|
||||
});
|
||||
|
||||
if (activeInterests.length === 0) return;
|
||||
|
||||
const interestIds = activeInterests.map((i) => i.id);
|
||||
|
||||
const activeDocs = await db.query.documents.findMany({
|
||||
where: and(
|
||||
eq(documents.portId, portId),
|
||||
inArray(documents.status, ['sent', 'partially_signed']),
|
||||
inArray(documents.interestId, interestIds),
|
||||
),
|
||||
});
|
||||
const activeDocs = await db
|
||||
.select({ id: documents.id })
|
||||
.from(documents)
|
||||
.leftJoin(documentTemplates, eq(documentTemplates.templateType, documents.documentType))
|
||||
.where(
|
||||
and(
|
||||
eq(documents.portId, portId),
|
||||
inArray(documents.status, ['sent', 'partially_signed']),
|
||||
isNotNull(documents.documensoId),
|
||||
eq(documents.remindersDisabled, false),
|
||||
sql`COALESCE(${documents.reminderCadenceOverride}, ${documentTemplates.reminderCadenceDays}) IS NOT NULL`,
|
||||
),
|
||||
);
|
||||
|
||||
for (const doc of activeDocs) {
|
||||
try {
|
||||
await sendReminderIfAllowed(doc.id, portId);
|
||||
await sendReminderIfAllowed(doc.id, portId, { auto: true });
|
||||
} catch (err) {
|
||||
logger.error({ err, documentId: doc.id, portId }, 'Reminder processing failed for document');
|
||||
logger.error({ err, documentId: doc.id, portId }, 'Reminder processing failed');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -49,22 +49,16 @@ export interface TemplateVersion {
|
||||
* We use a convention: version is stored in the `mergeFields` jsonb array
|
||||
* as `["__version__:N"]` to avoid adding a new column.
|
||||
*/
|
||||
function getVersionFromRecord(
|
||||
record: typeof documentTemplates.$inferSelect,
|
||||
): number {
|
||||
function getVersionFromRecord(record: typeof documentTemplates.$inferSelect): number {
|
||||
const mf = record.mergeFields as unknown;
|
||||
if (!Array.isArray(mf)) return 1;
|
||||
const versionEntry = (mf as string[]).find((e) =>
|
||||
e.startsWith('__version__:'),
|
||||
);
|
||||
const versionEntry = (mf as string[]).find((e) => e.startsWith('__version__:'));
|
||||
if (!versionEntry) return 1;
|
||||
const n = parseInt(versionEntry.split(':')[1] ?? '1', 10);
|
||||
return isNaN(n) ? 1 : n;
|
||||
}
|
||||
|
||||
function buildMergeFieldsWithVersion(
|
||||
version: number,
|
||||
): string[] {
|
||||
function buildMergeFieldsWithVersion(version: number): string[] {
|
||||
return [`__version__:${version}`];
|
||||
}
|
||||
|
||||
@@ -72,9 +66,7 @@ function buildMergeFieldsWithVersion(
|
||||
* Parse TipTap JSON from bodyHtml field. Returns the parsed object, or null
|
||||
* if bodyHtml is plain HTML (legacy records).
|
||||
*/
|
||||
function parseTipTapContent(
|
||||
bodyHtml: string,
|
||||
): Record<string, unknown> | null {
|
||||
function parseTipTapContent(bodyHtml: string): Record<string, unknown> | null {
|
||||
try {
|
||||
const parsed = JSON.parse(bodyHtml) as unknown;
|
||||
if (
|
||||
@@ -92,10 +84,7 @@ function parseTipTapContent(
|
||||
|
||||
// ─── List ─────────────────────────────────────────────────────────────────────
|
||||
|
||||
export async function listAdminTemplates(
|
||||
portId: string,
|
||||
query: ListAdminTemplatesInput,
|
||||
) {
|
||||
export async function listAdminTemplates(portId: string, query: ListAdminTemplatesInput) {
|
||||
const { type, isActive } = query;
|
||||
|
||||
const conditions = [eq(documentTemplates.portId, portId)];
|
||||
@@ -116,21 +105,15 @@ export async function listAdminTemplates(
|
||||
return rows.map((row) => ({
|
||||
...row,
|
||||
version: getVersionFromRecord(row),
|
||||
content: parseTipTapContent(row.bodyHtml),
|
||||
content: parseTipTapContent(row.bodyHtml ?? ''),
|
||||
}));
|
||||
}
|
||||
|
||||
// ─── Get by ID ────────────────────────────────────────────────────────────────
|
||||
|
||||
export async function getAdminTemplate(
|
||||
portId: string,
|
||||
templateId: string,
|
||||
) {
|
||||
export async function getAdminTemplate(portId: string, templateId: string) {
|
||||
const row = await db.query.documentTemplates.findFirst({
|
||||
where: and(
|
||||
eq(documentTemplates.id, templateId),
|
||||
eq(documentTemplates.portId, portId),
|
||||
),
|
||||
where: and(eq(documentTemplates.id, templateId), eq(documentTemplates.portId, portId)),
|
||||
});
|
||||
|
||||
if (!row) {
|
||||
@@ -140,15 +123,13 @@ export async function getAdminTemplate(
|
||||
return {
|
||||
...row,
|
||||
version: getVersionFromRecord(row),
|
||||
content: parseTipTapContent(row.bodyHtml),
|
||||
content: parseTipTapContent(row.bodyHtml ?? ''),
|
||||
};
|
||||
}
|
||||
|
||||
// ─── Validate TipTap Content ─────────────────────────────────────────────────
|
||||
|
||||
function assertValidContent(
|
||||
content: Record<string, unknown>,
|
||||
): void {
|
||||
function assertValidContent(content: Record<string, unknown>): void {
|
||||
const unsupported = validateTipTapDocument(
|
||||
content as unknown as Parameters<typeof validateTipTapDocument>[0],
|
||||
);
|
||||
@@ -257,21 +238,13 @@ export async function updateAdminTemplate(
|
||||
const [updated] = await db
|
||||
.update(documentTemplates)
|
||||
.set(updateValues)
|
||||
.where(
|
||||
and(
|
||||
eq(documentTemplates.id, templateId),
|
||||
eq(documentTemplates.portId, portId),
|
||||
),
|
||||
)
|
||||
.where(and(eq(documentTemplates.id, templateId), eq(documentTemplates.portId, portId)))
|
||||
.returning();
|
||||
|
||||
return {
|
||||
...updated!,
|
||||
version: newVersion,
|
||||
content:
|
||||
data.content !== undefined
|
||||
? data.content
|
||||
: existing.content,
|
||||
content: data.content !== undefined ? data.content : existing.content,
|
||||
};
|
||||
}
|
||||
|
||||
@@ -287,12 +260,7 @@ export async function deleteAdminTemplate(
|
||||
|
||||
await db
|
||||
.delete(documentTemplates)
|
||||
.where(
|
||||
and(
|
||||
eq(documentTemplates.id, templateId),
|
||||
eq(documentTemplates.portId, portId),
|
||||
),
|
||||
);
|
||||
.where(and(eq(documentTemplates.id, templateId), eq(documentTemplates.portId, portId)));
|
||||
|
||||
void createAuditLog({
|
||||
userId: meta.userId,
|
||||
@@ -337,10 +305,7 @@ export async function getAdminTemplateVersions(
|
||||
.filter((log) => {
|
||||
const meta = log.metadata as Record<string, unknown> | null;
|
||||
return (
|
||||
meta !== null &&
|
||||
typeof meta === 'object' &&
|
||||
'versionSnapshot' in meta &&
|
||||
'content' in meta
|
||||
meta !== null && typeof meta === 'object' && 'versionSnapshot' in meta && 'content' in meta
|
||||
);
|
||||
})
|
||||
.map((log) => {
|
||||
@@ -403,12 +368,7 @@ export async function rollbackAdminTemplate(
|
||||
mergeFields: buildMergeFieldsWithVersion(newVersion),
|
||||
updatedAt: new Date(),
|
||||
})
|
||||
.where(
|
||||
and(
|
||||
eq(documentTemplates.id, templateId),
|
||||
eq(documentTemplates.portId, portId),
|
||||
),
|
||||
)
|
||||
.where(and(eq(documentTemplates.id, templateId), eq(documentTemplates.portId, portId)))
|
||||
.returning();
|
||||
|
||||
return {
|
||||
|
||||
@@ -432,8 +432,14 @@ export async function resolveTemplate(
|
||||
throw new ValidationError(`Missing required merge field values: ${missing.join(', ')}`);
|
||||
}
|
||||
|
||||
// HTML body is required for the html template format; non-html formats
|
||||
// resolve elsewhere (see template_format dispatch in PR6).
|
||||
if (template.bodyHtml === null) {
|
||||
throw new ValidationError('Template has no HTML body to render');
|
||||
}
|
||||
|
||||
// Interpolate all tokens
|
||||
let resolved = template.bodyHtml;
|
||||
let resolved: string = template.bodyHtml;
|
||||
for (const [token, value] of Object.entries(tokenMap)) {
|
||||
// Escape token for use in regex
|
||||
const escaped = token.replace(/[{}]/g, '\\$&');
|
||||
|
||||
@@ -1,7 +1,13 @@
|
||||
import { and, eq } from 'drizzle-orm';
|
||||
import { and, count, eq, gte, inArray, lt, lte, ne, sql, exists } from 'drizzle-orm';
|
||||
|
||||
import { db } from '@/lib/db';
|
||||
import { documents, documentSigners, documentEvents, files } from '@/lib/db/schema/documents';
|
||||
import {
|
||||
documents,
|
||||
documentSigners,
|
||||
documentEvents,
|
||||
documentWatchers,
|
||||
files,
|
||||
} from '@/lib/db/schema/documents';
|
||||
import { interests } from '@/lib/db/schema/interests';
|
||||
import { clients } from '@/lib/db/schema/clients';
|
||||
import { ports } from '@/lib/db/schema/ports';
|
||||
@@ -18,6 +24,7 @@ import {
|
||||
createDocument as documensoCreate,
|
||||
sendDocument as documensoSend,
|
||||
downloadSignedPdf,
|
||||
voidDocument as documensoVoid,
|
||||
} from '@/lib/services/documenso-client';
|
||||
import type {
|
||||
CreateDocumentInput,
|
||||
@@ -36,15 +43,143 @@ interface AuditMeta {
|
||||
|
||||
// ─── List ─────────────────────────────────────────────────────────────────────
|
||||
|
||||
export async function listDocuments(portId: string, query: ListDocumentsInput) {
|
||||
const { page, limit, sort, order, search, interestId, clientId, documentType, status } = query;
|
||||
import { documentWatchers as documentWatchersTable } from '@/lib/db/schema/documents';
|
||||
|
||||
const filters = [];
|
||||
const NON_SIGNATURE_TYPES = [
|
||||
'welcome_letter',
|
||||
'handover_checklist',
|
||||
'acknowledgment',
|
||||
'correspondence',
|
||||
];
|
||||
|
||||
function buildHubTabFilters(
|
||||
tab: ListDocumentsInput['tab'],
|
||||
currentUserEmail: string | undefined,
|
||||
): ReturnType<typeof and>[] {
|
||||
const filters: ReturnType<typeof and>[] = [];
|
||||
if (!tab || tab === 'all') return filters;
|
||||
|
||||
switch (tab) {
|
||||
case 'awaiting_them':
|
||||
// "awaiting them" = pending signers other than the current user.
|
||||
// Without a known caller email we cannot make that distinction, so
|
||||
// short-circuit to empty rather than silently widen the result set.
|
||||
if (!currentUserEmail) {
|
||||
filters.push(sql`1 = 0`);
|
||||
break;
|
||||
}
|
||||
filters.push(inArray(documents.status, ['sent', 'partially_signed']));
|
||||
filters.push(
|
||||
exists(
|
||||
db
|
||||
.select({ x: sql`1` })
|
||||
.from(documentSigners)
|
||||
.where(
|
||||
and(
|
||||
eq(documentSigners.documentId, documents.id),
|
||||
eq(documentSigners.status, 'pending'),
|
||||
ne(documentSigners.signerEmail, currentUserEmail),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
break;
|
||||
case 'awaiting_me':
|
||||
if (!currentUserEmail) {
|
||||
// Without a current-user email there is no concept of "awaiting me"
|
||||
filters.push(sql`1 = 0`);
|
||||
break;
|
||||
}
|
||||
filters.push(
|
||||
exists(
|
||||
db
|
||||
.select({ x: sql`1` })
|
||||
.from(documentSigners)
|
||||
.where(
|
||||
and(
|
||||
eq(documentSigners.documentId, documents.id),
|
||||
eq(documentSigners.status, 'pending'),
|
||||
eq(documentSigners.signerEmail, currentUserEmail),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
break;
|
||||
case 'completed':
|
||||
filters.push(inArray(documents.status, ['completed', 'signed']));
|
||||
break;
|
||||
case 'expired':
|
||||
// Either explicitly expired, or in-flight past their expiry date.
|
||||
// (Documents schema doesn't yet have an `expires_at` column, so for
|
||||
// now this is just status='expired' — extend when expiry lands.)
|
||||
filters.push(eq(documents.status, 'expired'));
|
||||
break;
|
||||
}
|
||||
return filters;
|
||||
}
|
||||
|
||||
export interface ListDocumentsExtra {
|
||||
/** Email of the calling user — used by hub tab filtering for "awaiting me". */
|
||||
currentUserEmail?: string;
|
||||
}
|
||||
|
||||
export async function listDocuments(
|
||||
portId: string,
|
||||
query: ListDocumentsInput,
|
||||
extra: ListDocumentsExtra = {},
|
||||
) {
|
||||
const {
|
||||
page,
|
||||
limit,
|
||||
sort,
|
||||
order,
|
||||
search,
|
||||
interestId,
|
||||
clientId,
|
||||
documentType,
|
||||
status,
|
||||
tab,
|
||||
watcherUserId,
|
||||
signatureOnly,
|
||||
sentSince,
|
||||
sentUntil,
|
||||
} = query;
|
||||
|
||||
const filters: ReturnType<typeof and>[] = [];
|
||||
|
||||
if (interestId) filters.push(eq(documents.interestId, interestId));
|
||||
if (clientId) filters.push(eq(documents.clientId, clientId));
|
||||
if (documentType) filters.push(eq(documents.documentType, documentType));
|
||||
if (status) filters.push(eq(documents.status, status));
|
||||
if (sentSince) filters.push(gte(documents.createdAt, new Date(sentSince)));
|
||||
if (sentUntil) filters.push(lte(documents.createdAt, new Date(sentUntil)));
|
||||
if (signatureOnly === true) {
|
||||
filters.push(
|
||||
sql`${documents.documentType} NOT IN ('welcome_letter','handover_checklist','acknowledgment','correspondence')`,
|
||||
);
|
||||
} else if (signatureOnly === false) {
|
||||
// Pass-through, no extra filter needed.
|
||||
}
|
||||
if (watcherUserId) {
|
||||
filters.push(
|
||||
exists(
|
||||
db
|
||||
.select({ x: sql`1` })
|
||||
.from(documentWatchersTable)
|
||||
.where(
|
||||
and(
|
||||
eq(documentWatchersTable.documentId, documents.id),
|
||||
eq(documentWatchersTable.userId, watcherUserId),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
filters.push(...buildHubTabFilters(tab, extra.currentUserEmail));
|
||||
|
||||
void NON_SIGNATURE_TYPES;
|
||||
void lt;
|
||||
|
||||
const sortColumn =
|
||||
sort === 'title'
|
||||
@@ -63,13 +198,52 @@ export async function listDocuments(portId: string, query: ListDocumentsInput) {
|
||||
updatedAtColumn: documents.updatedAt,
|
||||
searchColumns: [documents.title],
|
||||
searchTerm: search,
|
||||
filters,
|
||||
filters: filters.filter(Boolean) as Parameters<typeof buildListQuery>[0]['filters'],
|
||||
sort: sort ? { column: sortColumn, direction: order } : undefined,
|
||||
page,
|
||||
pageSize: limit,
|
||||
});
|
||||
}
|
||||
|
||||
// ─── Hub tab counts ───────────────────────────────────────────────────────────
|
||||
|
||||
export interface HubTabCounts {
|
||||
all: number;
|
||||
awaiting_them: number;
|
||||
awaiting_me: number;
|
||||
completed: number;
|
||||
expired: number;
|
||||
}
|
||||
|
||||
/**
|
||||
* Compute hub tab counts in a single roundtrip per tab. Uses
|
||||
* idx_docs_status_port for cheap aggregation.
|
||||
*/
|
||||
export async function getHubTabCounts(
|
||||
portId: string,
|
||||
currentUserEmail: string | undefined,
|
||||
): Promise<HubTabCounts> {
|
||||
async function tabCount(tab: ListDocumentsInput['tab']): Promise<number> {
|
||||
const filters: ReturnType<typeof and>[] = [eq(documents.portId, portId)];
|
||||
filters.push(...buildHubTabFilters(tab, currentUserEmail));
|
||||
const [row] = await db
|
||||
.select({ count: count() })
|
||||
.from(documents)
|
||||
.where(and(...filters));
|
||||
return row?.count ?? 0;
|
||||
}
|
||||
|
||||
const [all, awaiting_them, awaiting_me, completed, expired] = await Promise.all([
|
||||
tabCount('all'),
|
||||
tabCount('awaiting_them'),
|
||||
tabCount('awaiting_me'),
|
||||
tabCount('completed'),
|
||||
tabCount('expired'),
|
||||
]);
|
||||
|
||||
return { all, awaiting_them, awaiting_me, completed, expired };
|
||||
}
|
||||
|
||||
// ─── Get by ID ────────────────────────────────────────────────────────────────
|
||||
|
||||
export async function getDocumentById(id: string, portId: string) {
|
||||
@@ -551,6 +725,17 @@ export async function handleDocumentCompleted(eventData: { documentId: string })
|
||||
.update(documents)
|
||||
.set({ status: 'completed', signedFileId: fileRecord!.id, updatedAt: new Date() })
|
||||
.where(eq(documents.id, doc.id));
|
||||
|
||||
// Reservation agreements mirror their signed PDF onto
|
||||
// berth_reservations.contractFileId so the portal "My Reservations" view
|
||||
// can resolve the contract without joining through documents.
|
||||
if (doc.documentType === 'reservation_agreement' && doc.reservationId) {
|
||||
const { berthReservations } = await import('@/lib/db/schema/reservations');
|
||||
await db
|
||||
.update(berthReservations)
|
||||
.set({ contractFileId: fileRecord!.id, updatedAt: new Date() })
|
||||
.where(eq(berthReservations.id, doc.reservationId));
|
||||
}
|
||||
} catch (err) {
|
||||
logger.error({ err, documentId: doc.id }, 'Failed to download/store signed PDF');
|
||||
await db
|
||||
@@ -760,3 +945,394 @@ export async function handleDocumentCancelled(eventData: {
|
||||
|
||||
emitToRoom(`port:${doc.portId}`, 'document:cancelled', { documentId: doc.id });
|
||||
}
|
||||
|
||||
// ─── Phase A: hub + wizard surface (PR1 skeletons; bodies land in PRs 4-6) ────
|
||||
|
||||
export interface DocumentDetailWatcher {
|
||||
userId: string;
|
||||
addedBy: string;
|
||||
addedAt: Date;
|
||||
}
|
||||
|
||||
export interface DocumentDetail {
|
||||
document: typeof documents.$inferSelect;
|
||||
signers: (typeof documentSigners.$inferSelect)[];
|
||||
events: (typeof documentEvents.$inferSelect)[];
|
||||
watchers: DocumentDetailWatcher[];
|
||||
}
|
||||
|
||||
/**
|
||||
* Single-roundtrip aggregator for the document detail page (PR5).
|
||||
* Returns the document plus all signers, events (newest first), and watchers.
|
||||
* Throws NotFoundError if the document is not in `portId`.
|
||||
*/
|
||||
export async function getDocumentDetail(id: string, portId: string): Promise<DocumentDetail> {
|
||||
const document = await getDocumentById(id, portId);
|
||||
|
||||
const [signers, events, watchers] = await Promise.all([
|
||||
db.query.documentSigners.findMany({
|
||||
where: eq(documentSigners.documentId, id),
|
||||
orderBy: (ds, { asc }) => [asc(ds.signingOrder)],
|
||||
}),
|
||||
db.query.documentEvents.findMany({
|
||||
where: eq(documentEvents.documentId, id),
|
||||
orderBy: (de, { desc }) => [desc(de.createdAt)],
|
||||
}),
|
||||
db
|
||||
.select({
|
||||
userId: documentWatchers.userId,
|
||||
addedBy: documentWatchers.addedBy,
|
||||
addedAt: documentWatchers.addedAt,
|
||||
})
|
||||
.from(documentWatchers)
|
||||
.where(eq(documentWatchers.documentId, id)),
|
||||
]);
|
||||
|
||||
return { document, signers, events, watchers };
|
||||
}
|
||||
|
||||
/**
|
||||
* User-initiated cancel of an in-flight document. Voids the doc in Documenso
|
||||
* (when present), updates DB status, logs an event, emits socket. Webhook
|
||||
* receiver also handles documenso-initiated cancellations via
|
||||
* `handleDocumentCancelled`.
|
||||
*
|
||||
* The actual Documenso void call lands in PR2 (`documenso-client.voidDocument`);
|
||||
* this skeleton updates DB state only.
|
||||
*/
|
||||
export async function cancelDocument(
|
||||
documentId: string,
|
||||
portId: string,
|
||||
meta: AuditMeta,
|
||||
): Promise<typeof documents.$inferSelect> {
|
||||
const existing = await getDocumentById(documentId, portId);
|
||||
|
||||
if (['completed', 'cancelled', 'rejected'].includes(existing.status)) {
|
||||
throw new ConflictError(`Document is already ${existing.status}`);
|
||||
}
|
||||
|
||||
// CRM is the system of record for cancellation status. A transient
|
||||
// Documenso failure shouldn't block the user from marking the doc cancelled
|
||||
// here — voidDocument already treats 404 as success, and the periodic
|
||||
// webhook receiver will reconcile if the remote void eventually lands.
|
||||
if (existing.documensoId) {
|
||||
try {
|
||||
await documensoVoid(existing.documensoId, portId);
|
||||
} catch (err) {
|
||||
logger.warn(
|
||||
{ err, documentId, documensoId: existing.documensoId },
|
||||
'Documenso void failed; cancelling locally anyway',
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const [updated] = await db
|
||||
.update(documents)
|
||||
.set({ status: 'cancelled', updatedAt: new Date() })
|
||||
.where(and(eq(documents.id, documentId), eq(documents.portId, portId)))
|
||||
.returning();
|
||||
|
||||
await db.insert(documentEvents).values({
|
||||
documentId,
|
||||
eventType: 'cancelled',
|
||||
eventData: { initiatedBy: meta.userId },
|
||||
});
|
||||
|
||||
void createAuditLog({
|
||||
userId: meta.userId,
|
||||
portId,
|
||||
action: 'update',
|
||||
entityType: 'document',
|
||||
entityId: documentId,
|
||||
oldValue: { status: existing.status },
|
||||
newValue: { status: 'cancelled' },
|
||||
ipAddress: meta.ipAddress,
|
||||
userAgent: meta.userAgent,
|
||||
});
|
||||
|
||||
emitToRoom(`port:${portId}`, 'document:cancelled', { documentId });
|
||||
|
||||
return updated!;
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns prefilled email composer payload for the "Email signed PDF to all
|
||||
* signatories" action on the document detail page.
|
||||
*
|
||||
* Available for `status='completed' && signedFileId !== null`.
|
||||
*
|
||||
* Body content (from per-port `signed_doc_completion` template), full
|
||||
* sender-resolution, and watcher-cc helpers land alongside PR8 (email
|
||||
* composer with attachments). For PR1 this returns the minimal correct
|
||||
* recipients + auto-attachment shape so detail-page integration tests can
|
||||
* assert against it.
|
||||
*/
|
||||
export interface ComposeSignedDocEmailResult {
|
||||
to: string[];
|
||||
cc: string[];
|
||||
subject: string;
|
||||
body: string;
|
||||
attachments: Array<{ fileId: string; filename?: string }>;
|
||||
defaultSenderType: 'system' | 'user';
|
||||
}
|
||||
|
||||
export async function composeSignedDocEmail(
|
||||
documentId: string,
|
||||
portId: string,
|
||||
): Promise<ComposeSignedDocEmailResult> {
|
||||
const doc = await getDocumentById(documentId, portId);
|
||||
|
||||
if (doc.status !== 'completed') {
|
||||
throw new ConflictError('Document is not completed');
|
||||
}
|
||||
if (!doc.signedFileId) {
|
||||
throw new ValidationError('Document has no signed PDF');
|
||||
}
|
||||
|
||||
const signers = await db
|
||||
.select({ email: documentSigners.signerEmail })
|
||||
.from(documentSigners)
|
||||
.where(eq(documentSigners.documentId, documentId));
|
||||
|
||||
const dedupedRecipients = Array.from(new Set(signers.map((s) => s.email)));
|
||||
|
||||
return {
|
||||
to: dedupedRecipients,
|
||||
cc: [],
|
||||
subject: `Signed ${doc.documentType.replace(/_/g, ' ')} — ${doc.title}`,
|
||||
body: '',
|
||||
attachments: [{ fileId: doc.signedFileId }],
|
||||
defaultSenderType: 'system',
|
||||
};
|
||||
}
|
||||
|
||||
// ─── Watchers (PR5) ───────────────────────────────────────────────────────────
|
||||
|
||||
export async function listDocumentWatchers(documentId: string, portId: string) {
|
||||
await getDocumentById(documentId, portId); // port-scope check
|
||||
return db
|
||||
.select({
|
||||
userId: documentWatchers.userId,
|
||||
addedBy: documentWatchers.addedBy,
|
||||
addedAt: documentWatchers.addedAt,
|
||||
})
|
||||
.from(documentWatchers)
|
||||
.where(eq(documentWatchers.documentId, documentId));
|
||||
}
|
||||
|
||||
export async function addDocumentWatcher(
|
||||
documentId: string,
|
||||
portId: string,
|
||||
userId: string,
|
||||
meta: AuditMeta,
|
||||
): Promise<{ userId: string; addedAt: Date }> {
|
||||
await getDocumentById(documentId, portId);
|
||||
const [row] = await db
|
||||
.insert(documentWatchers)
|
||||
.values({ documentId, userId, addedBy: meta.userId })
|
||||
.onConflictDoNothing()
|
||||
.returning();
|
||||
void createAuditLog({
|
||||
userId: meta.userId,
|
||||
portId,
|
||||
action: 'create',
|
||||
entityType: 'document_watcher',
|
||||
entityId: documentId,
|
||||
newValue: { documentId, watcherUserId: userId },
|
||||
ipAddress: meta.ipAddress,
|
||||
userAgent: meta.userAgent,
|
||||
});
|
||||
emitToRoom(`port:${portId}`, 'document:updated', { documentId });
|
||||
return row ? { userId: row.userId, addedAt: row.addedAt } : { userId, addedAt: new Date() };
|
||||
}
|
||||
|
||||
export async function removeDocumentWatcher(
|
||||
documentId: string,
|
||||
portId: string,
|
||||
userId: string,
|
||||
meta: AuditMeta,
|
||||
): Promise<void> {
|
||||
await getDocumentById(documentId, portId);
|
||||
await db
|
||||
.delete(documentWatchers)
|
||||
.where(and(eq(documentWatchers.documentId, documentId), eq(documentWatchers.userId, userId)));
|
||||
void createAuditLog({
|
||||
userId: meta.userId,
|
||||
portId,
|
||||
action: 'delete',
|
||||
entityType: 'document_watcher',
|
||||
entityId: documentId,
|
||||
oldValue: { documentId, watcherUserId: userId },
|
||||
ipAddress: meta.ipAddress,
|
||||
userAgent: meta.userAgent,
|
||||
});
|
||||
emitToRoom(`port:${portId}`, 'document:updated', { documentId });
|
||||
}
|
||||
|
||||
/**
|
||||
* Create-document wizard entry point (PR6).
|
||||
*
|
||||
* Dispatches across pathways:
|
||||
* - 'documenso-template' — Documenso renders + signs from its own template
|
||||
* - 'inapp' — render PDF locally from a CRM template, upload to Documenso
|
||||
* - 'upload' — admin-supplied PDF, upload to Documenso (auto-place signature
|
||||
* fields if `autoPlaceFields`)
|
||||
*
|
||||
* Persists the document, applies reminder overrides, attaches watchers, and
|
||||
* triggers send when `sendImmediately`.
|
||||
*/
|
||||
import type { CreateDocumentWizardInput } from '@/lib/validators/documents';
|
||||
|
||||
export async function createFromWizard(
|
||||
portId: string,
|
||||
data: CreateDocumentWizardInput,
|
||||
meta: AuditMeta,
|
||||
): Promise<typeof documents.$inferSelect> {
|
||||
if (data.source === 'upload') {
|
||||
return createFromUpload(portId, data, meta);
|
||||
}
|
||||
|
||||
if (!data.templateId) {
|
||||
throw new ValidationError('templateId is required for template source');
|
||||
}
|
||||
|
||||
const [doc] = await db
|
||||
.insert(documents)
|
||||
.values({
|
||||
portId,
|
||||
interestId: data.interestId ?? null,
|
||||
reservationId: data.reservationId ?? null,
|
||||
clientId: data.clientId ?? null,
|
||||
companyId: data.companyId ?? null,
|
||||
yachtId: data.yachtId ?? null,
|
||||
documentType: data.documentType,
|
||||
title: data.title,
|
||||
notes: data.notes ?? null,
|
||||
status: 'draft',
|
||||
remindersDisabled: data.remindersDisabled,
|
||||
reminderCadenceOverride: data.reminderCadenceOverride ?? null,
|
||||
createdBy: meta.userId,
|
||||
})
|
||||
.returning();
|
||||
|
||||
if (!doc) throw new Error('Failed to insert document');
|
||||
|
||||
if (data.watchers.length > 0) {
|
||||
await db.insert(documentWatchers).values(
|
||||
data.watchers.map((userId) => ({
|
||||
documentId: doc.id,
|
||||
userId,
|
||||
addedBy: meta.userId,
|
||||
})),
|
||||
);
|
||||
}
|
||||
|
||||
void createAuditLog({
|
||||
userId: meta.userId,
|
||||
portId,
|
||||
action: 'create',
|
||||
entityType: 'document',
|
||||
entityId: doc.id,
|
||||
newValue: {
|
||||
documentType: doc.documentType,
|
||||
title: doc.title,
|
||||
pathway: data.pathway,
|
||||
source: data.source,
|
||||
},
|
||||
ipAddress: meta.ipAddress,
|
||||
userAgent: meta.userAgent,
|
||||
});
|
||||
|
||||
emitToRoom(`port:${portId}`, 'document:created', { documentId: doc.id });
|
||||
|
||||
return doc;
|
||||
}
|
||||
|
||||
/**
|
||||
* Upload-driven creation path. Files-service integration + Documenso upload
|
||||
* + auto-place signature fields land alongside the realapi PR (PR11). For
|
||||
* PR6 we persist the document row + signers + watchers and leave the
|
||||
* Documenso upload step to the existing sendForSigning flow on first send.
|
||||
*/
|
||||
export async function createFromUpload(
|
||||
portId: string,
|
||||
data: CreateDocumentWizardInput,
|
||||
meta: AuditMeta,
|
||||
): Promise<typeof documents.$inferSelect> {
|
||||
if (!data.uploadedFileId) {
|
||||
throw new ValidationError('uploadedFileId is required for upload source');
|
||||
}
|
||||
if (!data.signers || data.signers.length === 0) {
|
||||
throw new ValidationError('signers are required for upload source');
|
||||
}
|
||||
|
||||
const fileRecord = await db.query.files.findFirst({
|
||||
where: and(eq(files.id, data.uploadedFileId), eq(files.portId, portId)),
|
||||
});
|
||||
if (!fileRecord) {
|
||||
throw new NotFoundError('File');
|
||||
}
|
||||
|
||||
const [doc] = await db
|
||||
.insert(documents)
|
||||
.values({
|
||||
portId,
|
||||
interestId: data.interestId ?? null,
|
||||
reservationId: data.reservationId ?? null,
|
||||
clientId: data.clientId ?? null,
|
||||
companyId: data.companyId ?? null,
|
||||
yachtId: data.yachtId ?? null,
|
||||
documentType: data.documentType,
|
||||
title: data.title,
|
||||
notes: data.notes ?? null,
|
||||
status: 'draft',
|
||||
fileId: fileRecord.id,
|
||||
remindersDisabled: data.remindersDisabled,
|
||||
reminderCadenceOverride: data.reminderCadenceOverride ?? null,
|
||||
createdBy: meta.userId,
|
||||
})
|
||||
.returning();
|
||||
if (!doc) throw new Error('Failed to insert document');
|
||||
|
||||
await db.insert(documentSigners).values(
|
||||
data.signers.map((s) => ({
|
||||
documentId: doc.id,
|
||||
signerName: s.signerName,
|
||||
signerEmail: s.signerEmail,
|
||||
signerRole: s.signerRole,
|
||||
signingOrder: s.signingOrder,
|
||||
status: 'pending' as const,
|
||||
})),
|
||||
);
|
||||
|
||||
if (data.watchers.length > 0) {
|
||||
await db.insert(documentWatchers).values(
|
||||
data.watchers.map((userId) => ({
|
||||
documentId: doc.id,
|
||||
userId,
|
||||
addedBy: meta.userId,
|
||||
})),
|
||||
);
|
||||
}
|
||||
|
||||
void createAuditLog({
|
||||
userId: meta.userId,
|
||||
portId,
|
||||
action: 'create',
|
||||
entityType: 'document',
|
||||
entityId: doc.id,
|
||||
newValue: {
|
||||
documentType: doc.documentType,
|
||||
title: doc.title,
|
||||
pathway: 'upload',
|
||||
source: 'upload',
|
||||
uploadedFileId: fileRecord.id,
|
||||
},
|
||||
ipAddress: meta.ipAddress,
|
||||
userAgent: meta.userAgent,
|
||||
});
|
||||
|
||||
emitToRoom(`port:${portId}`, 'document:created', { documentId: doc.id });
|
||||
|
||||
return doc;
|
||||
}
|
||||
|
||||
@@ -3,9 +3,12 @@ import { and, eq, sql } from 'drizzle-orm';
|
||||
|
||||
import { db } from '@/lib/db';
|
||||
import { emailAccounts, emailMessages, emailThreads } from '@/lib/db/schema/email';
|
||||
import { documents, documentEvents, files } from '@/lib/db/schema/documents';
|
||||
import { createAuditLog } from '@/lib/audit';
|
||||
import { NotFoundError, ForbiddenError } from '@/lib/errors';
|
||||
import { getDecryptedCredentials } from '@/lib/services/email-accounts.service';
|
||||
import { getPortEmailConfig } from '@/lib/services/port-config';
|
||||
import { sendEmail as sendSystemEmail } from '@/lib/email';
|
||||
import type { ComposeEmailInput } from '@/lib/validators/email';
|
||||
|
||||
// ─── Types ────────────────────────────────────────────────────────────────────
|
||||
@@ -17,6 +20,22 @@ interface AuditMeta {
|
||||
userAgent: string;
|
||||
}
|
||||
|
||||
// ─── Helpers ──────────────────────────────────────────────────────────────────
|
||||
|
||||
async function assertAttachmentsForPort(
|
||||
refs: { fileId: string }[] | undefined,
|
||||
portId: string,
|
||||
): Promise<void> {
|
||||
if (!refs || refs.length === 0) return;
|
||||
for (const r of refs) {
|
||||
const file = await db.query.files.findFirst({ where: eq(files.id, r.fileId) });
|
||||
if (!file) throw new NotFoundError('File');
|
||||
if (file.portId !== portId) {
|
||||
throw new ForbiddenError('File belongs to a different port');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ─── Send Email ───────────────────────────────────────────────────────────────
|
||||
|
||||
export async function sendEmail(
|
||||
@@ -25,12 +44,29 @@ export async function sendEmail(
|
||||
data: ComposeEmailInput,
|
||||
audit: AuditMeta,
|
||||
) {
|
||||
// System path: port-config noreply identity + system SMTP, with optional
|
||||
// file attachments. Skips email_messages/email_threads writes; logs a
|
||||
// documentEvents row when the body is keyed to a document via
|
||||
// metadata.documentId at the API boundary.
|
||||
if (data.senderType === 'system') {
|
||||
return sendSystem(portId, data, audit);
|
||||
}
|
||||
|
||||
if (!data.accountId) {
|
||||
throw new ForbiddenError('accountId is required for user-path send');
|
||||
}
|
||||
|
||||
// Personal-account sends are admin-gated per port.
|
||||
const cfg = await getPortEmailConfig(portId);
|
||||
if (!cfg.allowPersonalAccountSends) {
|
||||
throw new ForbiddenError('Personal account sends are disabled for this port');
|
||||
}
|
||||
|
||||
await assertAttachmentsForPort(data.attachments, portId);
|
||||
|
||||
// Verify the account belongs to the user
|
||||
const account = await db.query.emailAccounts.findFirst({
|
||||
where: and(
|
||||
eq(emailAccounts.id, data.accountId),
|
||||
eq(emailAccounts.userId, userId),
|
||||
),
|
||||
where: and(eq(emailAccounts.id, data.accountId), eq(emailAccounts.userId, userId)),
|
||||
});
|
||||
|
||||
if (!account) {
|
||||
@@ -64,16 +100,10 @@ export async function sendEmail(
|
||||
const existingMessages = await db
|
||||
.select({ messageIdHeader: emailMessages.messageIdHeader })
|
||||
.from(emailMessages)
|
||||
.where(
|
||||
and(
|
||||
eq(emailMessages.threadId, data.threadId),
|
||||
),
|
||||
)
|
||||
.where(and(eq(emailMessages.threadId, data.threadId)))
|
||||
.orderBy(emailMessages.sentAt);
|
||||
|
||||
const refIds = existingMessages
|
||||
.map((m) => m.messageIdHeader)
|
||||
.filter(Boolean) as string[];
|
||||
const refIds = existingMessages.map((m) => m.messageIdHeader).filter(Boolean) as string[];
|
||||
|
||||
if (refIds.length > 0) {
|
||||
references = refIds.join(' ');
|
||||
@@ -81,6 +111,29 @@ export async function sendEmail(
|
||||
}
|
||||
}
|
||||
|
||||
// Resolve attachments for the user-path SMTP send.
|
||||
const resolvedAttachments = data.attachments
|
||||
? await Promise.all(
|
||||
data.attachments.map(async (ref) => {
|
||||
const file = await db.query.files.findFirst({
|
||||
where: eq(files.id, ref.fileId),
|
||||
});
|
||||
if (!file) throw new NotFoundError('File');
|
||||
const { minioClient } = await import('@/lib/minio');
|
||||
const stream = await minioClient.getObject(file.storageBucket, file.storagePath);
|
||||
const chunks: Buffer[] = [];
|
||||
for await (const chunk of stream) {
|
||||
chunks.push(Buffer.isBuffer(chunk) ? chunk : Buffer.from(chunk));
|
||||
}
|
||||
return {
|
||||
filename: ref.filename ?? file.originalName,
|
||||
content: Buffer.concat(chunks),
|
||||
...(file.mimeType ? { contentType: file.mimeType } : {}),
|
||||
};
|
||||
}),
|
||||
)
|
||||
: undefined;
|
||||
|
||||
// Send via the user's SMTP transporter
|
||||
const info = await transporter.sendMail({
|
||||
from: account.emailAddress,
|
||||
@@ -90,6 +143,9 @@ export async function sendEmail(
|
||||
html: data.bodyHtml,
|
||||
inReplyTo,
|
||||
references,
|
||||
...(resolvedAttachments && resolvedAttachments.length > 0
|
||||
? { attachments: resolvedAttachments }
|
||||
: {}),
|
||||
});
|
||||
|
||||
const sentMessageId: string =
|
||||
@@ -101,10 +157,7 @@ export async function sendEmail(
|
||||
if (data.threadId) {
|
||||
// Verify thread belongs to this port
|
||||
const existingThread = await db.query.emailThreads.findFirst({
|
||||
where: and(
|
||||
eq(emailThreads.id, data.threadId),
|
||||
eq(emailThreads.portId, portId),
|
||||
),
|
||||
where: and(eq(emailThreads.id, data.threadId), eq(emailThreads.portId, portId)),
|
||||
});
|
||||
if (!existingThread) {
|
||||
throw new NotFoundError('Email thread');
|
||||
@@ -140,6 +193,10 @@ export async function sendEmail(
|
||||
bodyHtml: data.bodyHtml,
|
||||
direction: 'outbound',
|
||||
sentAt: now,
|
||||
attachmentFileIds:
|
||||
data.attachments && data.attachments.length > 0
|
||||
? data.attachments.map((a) => a.fileId)
|
||||
: null,
|
||||
})
|
||||
.returning();
|
||||
|
||||
@@ -174,3 +231,58 @@ export async function sendEmail(
|
||||
|
||||
return { message, threadId };
|
||||
}
|
||||
|
||||
/**
|
||||
* System-path send. Uses port-config noreply identity + system SMTP from
|
||||
* `lib/email/index.ts → sendEmail()`. Skips email_messages/email_threads
|
||||
* writes (no IMAP roundtrip expected). When the email targets a document's
|
||||
* signed PDF (attachments include the doc's signedFileId), logs a
|
||||
* documentEvents row so the document detail timeline reflects the send.
|
||||
*/
|
||||
async function sendSystem(
|
||||
portId: string,
|
||||
data: ComposeEmailInput,
|
||||
audit: AuditMeta,
|
||||
): Promise<{ message: { id: 'system' }; threadId: null }> {
|
||||
await assertAttachmentsForPort(data.attachments, portId);
|
||||
|
||||
await sendSystemEmail(
|
||||
data.to,
|
||||
data.subject,
|
||||
data.bodyHtml,
|
||||
undefined,
|
||||
undefined,
|
||||
portId,
|
||||
data.attachments,
|
||||
);
|
||||
|
||||
// If any attachment matches a document's signedFileId, log signed_doc_emailed.
|
||||
if (data.attachments && data.attachments.length > 0) {
|
||||
const fileIds = data.attachments.map((a) => a.fileId);
|
||||
const matchingDocs = await db
|
||||
.select({ id: documents.id, signedFileId: documents.signedFileId })
|
||||
.from(documents)
|
||||
.where(and(eq(documents.portId, portId), sql`${documents.signedFileId} = ANY(${fileIds})`));
|
||||
|
||||
for (const doc of matchingDocs) {
|
||||
await db.insert(documentEvents).values({
|
||||
documentId: doc.id,
|
||||
eventType: 'signed_doc_emailed',
|
||||
eventData: { recipients: data.to, subject: data.subject },
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
void createAuditLog({
|
||||
userId: audit.userId,
|
||||
portId: audit.portId,
|
||||
action: 'create',
|
||||
entityType: 'email_message',
|
||||
entityId: 'system',
|
||||
metadata: { senderType: 'system', to: data.to, subject: data.subject },
|
||||
ipAddress: audit.ipAddress,
|
||||
userAgent: audit.userAgent,
|
||||
});
|
||||
|
||||
return { message: { id: 'system' }, threadId: null };
|
||||
}
|
||||
|
||||
@@ -1,12 +1,17 @@
|
||||
import { and, count, eq, gt, sql } from 'drizzle-orm';
|
||||
|
||||
import { db } from '@/lib/db';
|
||||
import { documents, documentWatchers } from '@/lib/db/schema/documents';
|
||||
import { notifications } from '@/lib/db/schema/operations';
|
||||
import { userNotificationPreferences } from '@/lib/db/schema/system';
|
||||
import { emitToRoom } from '@/lib/socket/server';
|
||||
import { getQueue } from '@/lib/queue';
|
||||
import { NotFoundError } from '@/lib/errors';
|
||||
import type { ListNotificationsInput, UpdatePreferencesInput } from '@/lib/validators/notifications';
|
||||
import { logger } from '@/lib/logger';
|
||||
import type {
|
||||
ListNotificationsInput,
|
||||
UpdatePreferencesInput,
|
||||
} from '@/lib/validators/notifications';
|
||||
|
||||
// ─── Types ────────────────────────────────────────────────────────────────────
|
||||
|
||||
@@ -81,7 +86,10 @@ export async function createNotification(
|
||||
// 2. Preference check (skip for system_alert type — always delivered)
|
||||
if (type !== 'system_alert') {
|
||||
const [pref] = await db
|
||||
.select({ inApp: userNotificationPreferences.inApp, email: userNotificationPreferences.email })
|
||||
.select({
|
||||
inApp: userNotificationPreferences.inApp,
|
||||
email: userNotificationPreferences.email,
|
||||
})
|
||||
.from(userNotificationPreferences)
|
||||
.where(
|
||||
and(
|
||||
@@ -170,10 +178,7 @@ export async function listNotifications(
|
||||
const { page, limit, unreadOnly } = query;
|
||||
const offset = (page - 1) * limit;
|
||||
|
||||
const conditions = [
|
||||
eq(notifications.userId, userId),
|
||||
eq(notifications.portId, portId),
|
||||
];
|
||||
const conditions = [eq(notifications.userId, userId), eq(notifications.portId, portId)];
|
||||
|
||||
if (unreadOnly) {
|
||||
conditions.push(eq(notifications.isRead, false));
|
||||
@@ -239,10 +244,7 @@ export async function markAllRead(userId: string, portId: string): Promise<void>
|
||||
|
||||
// ─── getUnreadCount ───────────────────────────────────────────────────────────
|
||||
|
||||
export async function getUnreadCount(
|
||||
userId: string,
|
||||
portId: string,
|
||||
): Promise<{ count: number }> {
|
||||
export async function getUnreadCount(userId: string, portId: string): Promise<{ count: number }> {
|
||||
const c = await getUnreadCountValue(userId, portId);
|
||||
return { count: c };
|
||||
}
|
||||
@@ -261,6 +263,91 @@ export async function getPreferences(userId: string, portId: string) {
|
||||
);
|
||||
}
|
||||
|
||||
// ─── notifyDocumentEvent ──────────────────────────────────────────────────────
|
||||
|
||||
export type DocumentEventType =
|
||||
| 'sent'
|
||||
| 'signed'
|
||||
| 'completed'
|
||||
| 'expired'
|
||||
| 'cancelled'
|
||||
| 'rejected';
|
||||
|
||||
const DOCUMENT_EVENT_TITLES: Record<DocumentEventType, string> = {
|
||||
sent: 'Document sent for signing',
|
||||
signed: 'Document signed',
|
||||
completed: 'Document fully signed',
|
||||
expired: 'Document expired',
|
||||
cancelled: 'Document cancelled',
|
||||
rejected: 'Document rejected',
|
||||
};
|
||||
|
||||
const DOCUMENT_EVENT_NOTIF_TYPES: Record<DocumentEventType, string> = {
|
||||
sent: 'document_sent',
|
||||
signed: 'document_signed',
|
||||
completed: 'document_completed',
|
||||
expired: 'document_expired',
|
||||
cancelled: 'document_cancelled',
|
||||
rejected: 'document_rejected',
|
||||
};
|
||||
|
||||
/**
|
||||
* Fan out an in-app notification for a document lifecycle event to:
|
||||
* - the document creator
|
||||
* - all rows in `document_watchers` for the document
|
||||
*
|
||||
* Existing socket events (`document:created`, `document:sent`, etc.) keep
|
||||
* firing from `documents.service.ts`; this helper only adds in-app
|
||||
* notifications. Used by PR4/PR5 detail page + watcher feature.
|
||||
*
|
||||
* Future: also notify the entity assignee once that concept exists on
|
||||
* interests/reservations.
|
||||
*/
|
||||
export async function notifyDocumentEvent(
|
||||
documentId: string,
|
||||
eventType: DocumentEventType,
|
||||
): Promise<void> {
|
||||
const doc = await db.query.documents.findFirst({
|
||||
where: eq(documents.id, documentId),
|
||||
});
|
||||
if (!doc) {
|
||||
logger.warn({ documentId }, 'notifyDocumentEvent: document not found');
|
||||
return;
|
||||
}
|
||||
|
||||
const watcherRows = await db
|
||||
.select({ userId: documentWatchers.userId })
|
||||
.from(documentWatchers)
|
||||
.where(eq(documentWatchers.documentId, documentId));
|
||||
|
||||
const recipientIds = new Set<string>();
|
||||
if (doc.createdBy && doc.createdBy !== 'system') {
|
||||
recipientIds.add(doc.createdBy);
|
||||
}
|
||||
for (const row of watcherRows) {
|
||||
recipientIds.add(row.userId);
|
||||
}
|
||||
|
||||
const title = DOCUMENT_EVENT_TITLES[eventType];
|
||||
const notifType = DOCUMENT_EVENT_NOTIF_TYPES[eventType];
|
||||
|
||||
await Promise.all(
|
||||
Array.from(recipientIds).map((userId) =>
|
||||
createNotification({
|
||||
portId: doc.portId,
|
||||
userId,
|
||||
type: notifType,
|
||||
title,
|
||||
description: `"${doc.title}"`,
|
||||
link: `/documents/${doc.id}`,
|
||||
entityType: 'document',
|
||||
entityId: doc.id,
|
||||
dedupeKey: `document:${doc.id}:${eventType}`,
|
||||
}),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
// ─── updatePreferences ────────────────────────────────────────────────────────
|
||||
|
||||
export async function updatePreferences(
|
||||
|
||||
@@ -19,6 +19,7 @@ export const SETTING_KEYS = {
|
||||
emailReplyTo: 'email_reply_to',
|
||||
emailSignatureHtml: 'email_signature_html',
|
||||
emailFooterHtml: 'email_footer_html',
|
||||
emailAllowPersonalAccountSends: 'email_allow_personal_account_sends',
|
||||
smtpHostOverride: 'smtp_host_override',
|
||||
smtpPortOverride: 'smtp_port_override',
|
||||
smtpUserOverride: 'smtp_user_override',
|
||||
@@ -27,6 +28,7 @@ export const SETTING_KEYS = {
|
||||
// Documenso / EOI
|
||||
documensoApiUrlOverride: 'documenso_api_url_override',
|
||||
documensoApiKeyOverride: 'documenso_api_key_override',
|
||||
documensoApiVersionOverride: 'documenso_api_version_override',
|
||||
documensoEoiTemplateId: 'documenso_eoi_template_id',
|
||||
eoiDefaultPathway: 'eoi_default_pathway',
|
||||
|
||||
@@ -65,6 +67,12 @@ export interface PortEmailConfig {
|
||||
smtpPort: number;
|
||||
smtpUser: string | null;
|
||||
smtpPass: string | null;
|
||||
/**
|
||||
* When false, only the system (port-config) sender identity is allowed.
|
||||
* When true, admins/users may send via their connected personal email
|
||||
* account. Defaults to false for safety.
|
||||
*/
|
||||
allowPersonalAccountSends: boolean;
|
||||
}
|
||||
|
||||
export async function getPortEmailConfig(portId: string): Promise<PortEmailConfig> {
|
||||
@@ -78,6 +86,7 @@ export async function getPortEmailConfig(portId: string): Promise<PortEmailConfi
|
||||
smtpPort,
|
||||
smtpUser,
|
||||
smtpPass,
|
||||
allowPersonalAccountSends,
|
||||
] = await Promise.all([
|
||||
readSetting<string>(SETTING_KEYS.emailFromName, portId),
|
||||
readSetting<string>(SETTING_KEYS.emailFromAddress, portId),
|
||||
@@ -88,6 +97,7 @@ export async function getPortEmailConfig(portId: string): Promise<PortEmailConfi
|
||||
readSetting<number>(SETTING_KEYS.smtpPortOverride, portId),
|
||||
readSetting<string>(SETTING_KEYS.smtpUserOverride, portId),
|
||||
readSetting<string>(SETTING_KEYS.smtpPassOverride, portId),
|
||||
readSetting<boolean>(SETTING_KEYS.emailAllowPersonalAccountSends, portId),
|
||||
]);
|
||||
|
||||
// Parse env.SMTP_FROM into name + address if no port override
|
||||
@@ -113,24 +123,28 @@ export async function getPortEmailConfig(portId: string): Promise<PortEmailConfi
|
||||
smtpPort: smtpPort ?? env.SMTP_PORT,
|
||||
smtpUser: smtpUser ?? env.SMTP_USER ?? null,
|
||||
smtpPass: smtpPass ?? env.SMTP_PASS ?? null,
|
||||
allowPersonalAccountSends: allowPersonalAccountSends ?? false,
|
||||
};
|
||||
}
|
||||
|
||||
// ─── Documenso ──────────────────────────────────────────────────────────────
|
||||
|
||||
export type EoiPathway = 'documenso-template' | 'inapp';
|
||||
export type DocumensoApiVersion = 'v1' | 'v2';
|
||||
|
||||
export interface PortDocumensoConfig {
|
||||
apiUrl: string;
|
||||
apiKey: string;
|
||||
apiVersion: DocumensoApiVersion;
|
||||
eoiTemplateId: string | null;
|
||||
defaultPathway: EoiPathway;
|
||||
}
|
||||
|
||||
export async function getPortDocumensoConfig(portId: string): Promise<PortDocumensoConfig> {
|
||||
const [apiUrl, apiKey, eoiTemplateId, defaultPathway] = await Promise.all([
|
||||
const [apiUrl, apiKey, apiVersion, eoiTemplateId, defaultPathway] = await Promise.all([
|
||||
readSetting<string>(SETTING_KEYS.documensoApiUrlOverride, portId),
|
||||
readSetting<string>(SETTING_KEYS.documensoApiKeyOverride, portId),
|
||||
readSetting<DocumensoApiVersion>(SETTING_KEYS.documensoApiVersionOverride, portId),
|
||||
readSetting<string>(SETTING_KEYS.documensoEoiTemplateId, portId),
|
||||
readSetting<EoiPathway>(SETTING_KEYS.eoiDefaultPathway, portId),
|
||||
]);
|
||||
@@ -138,6 +152,7 @@ export async function getPortDocumensoConfig(portId: string): Promise<PortDocume
|
||||
return {
|
||||
apiUrl: apiUrl ?? env.DOCUMENSO_API_URL,
|
||||
apiKey: apiKey ?? env.DOCUMENSO_API_KEY,
|
||||
apiVersion: apiVersion ?? env.DOCUMENSO_API_VERSION,
|
||||
eoiTemplateId: eoiTemplateId ?? null,
|
||||
defaultPathway: defaultPathway ?? 'documenso-template',
|
||||
};
|
||||
|
||||
136
src/lib/services/reservation-agreement-context.ts
Normal file
136
src/lib/services/reservation-agreement-context.ts
Normal file
@@ -0,0 +1,136 @@
|
||||
import { and, eq } from 'drizzle-orm';
|
||||
|
||||
import { db } from '@/lib/db';
|
||||
import { berths } from '@/lib/db/schema/berths';
|
||||
import { berthReservations } from '@/lib/db/schema/reservations';
|
||||
import { clients } from '@/lib/db/schema/clients';
|
||||
import { ports } from '@/lib/db/schema/ports';
|
||||
import { yachts } from '@/lib/db/schema/yachts';
|
||||
import { NotFoundError } from '@/lib/errors';
|
||||
|
||||
export type ReservationAgreementContext = {
|
||||
client: {
|
||||
id: string;
|
||||
fullName: string;
|
||||
nationality: string | null;
|
||||
};
|
||||
yacht: {
|
||||
id: string;
|
||||
name: string;
|
||||
lengthFt: string | null;
|
||||
flag: string | null;
|
||||
};
|
||||
berth: {
|
||||
id: string;
|
||||
mooringNumber: string;
|
||||
area: string | null;
|
||||
lengthFt: string | null;
|
||||
priceCurrency: string;
|
||||
};
|
||||
reservation: {
|
||||
id: string;
|
||||
status: string;
|
||||
startDate: Date;
|
||||
endDate: Date | null;
|
||||
tenureType: string;
|
||||
termSummary: string;
|
||||
signedDate: string | null;
|
||||
};
|
||||
port: {
|
||||
name: string;
|
||||
defaultCurrency: string;
|
||||
};
|
||||
date: {
|
||||
today: string;
|
||||
year: string;
|
||||
};
|
||||
};
|
||||
|
||||
/**
|
||||
* Build the merge-context shape used when generating a reservation agreement
|
||||
* document. Mirrors `buildEoiContext` for consistency: pure read-only,
|
||||
* tenant-scoped via `portId`, throws on missing rows.
|
||||
*
|
||||
* `termSummary` is a human-readable rendering of `tenureType` + dates that
|
||||
* templates can use as `{{reservation.termSummary}}` without needing date
|
||||
* formatting helpers in the template language.
|
||||
*/
|
||||
export async function buildReservationAgreementContext(
|
||||
reservationId: string,
|
||||
portId: string,
|
||||
): Promise<ReservationAgreementContext> {
|
||||
const reservation = await db.query.berthReservations.findFirst({
|
||||
where: and(eq(berthReservations.id, reservationId), eq(berthReservations.portId, portId)),
|
||||
});
|
||||
if (!reservation) throw new NotFoundError('Reservation');
|
||||
|
||||
const [client, yacht, berth, port] = await Promise.all([
|
||||
db.query.clients.findFirst({
|
||||
where: and(eq(clients.id, reservation.clientId), eq(clients.portId, portId)),
|
||||
}),
|
||||
db.query.yachts.findFirst({
|
||||
where: and(eq(yachts.id, reservation.yachtId), eq(yachts.portId, portId)),
|
||||
}),
|
||||
db.query.berths.findFirst({
|
||||
where: and(eq(berths.id, reservation.berthId), eq(berths.portId, portId)),
|
||||
}),
|
||||
db.query.ports.findFirst({ where: eq(ports.id, portId) }),
|
||||
]);
|
||||
if (!client) throw new NotFoundError('Client');
|
||||
if (!yacht) throw new NotFoundError('Yacht');
|
||||
if (!berth) throw new NotFoundError('Berth');
|
||||
if (!port) throw new NotFoundError('Port');
|
||||
|
||||
const start = reservation.startDate.toISOString().slice(0, 10);
|
||||
const end = reservation.endDate ? reservation.endDate.toISOString().slice(0, 10) : null;
|
||||
|
||||
let termSummary: string;
|
||||
if (reservation.tenureType === 'permanent') {
|
||||
termSummary = `Permanent berth, commencing ${start}`;
|
||||
} else if (reservation.tenureType === 'fixed_term' && end) {
|
||||
termSummary = `Fixed term: ${start} to ${end}`;
|
||||
} else if (reservation.tenureType === 'seasonal' && end) {
|
||||
termSummary = `Seasonal: ${start} to ${end}`;
|
||||
} else {
|
||||
termSummary = `${reservation.tenureType} from ${start}`;
|
||||
}
|
||||
|
||||
const now = new Date();
|
||||
return {
|
||||
client: {
|
||||
id: client.id,
|
||||
fullName: client.fullName,
|
||||
nationality: client.nationality,
|
||||
},
|
||||
yacht: {
|
||||
id: yacht.id,
|
||||
name: yacht.name,
|
||||
lengthFt: yacht.lengthFt,
|
||||
flag: yacht.flag,
|
||||
},
|
||||
berth: {
|
||||
id: berth.id,
|
||||
mooringNumber: berth.mooringNumber,
|
||||
area: berth.area,
|
||||
lengthFt: berth.lengthFt,
|
||||
priceCurrency: berth.priceCurrency,
|
||||
},
|
||||
reservation: {
|
||||
id: reservation.id,
|
||||
status: reservation.status,
|
||||
startDate: reservation.startDate,
|
||||
endDate: reservation.endDate,
|
||||
tenureType: reservation.tenureType,
|
||||
termSummary,
|
||||
signedDate: null,
|
||||
},
|
||||
port: {
|
||||
name: port.name,
|
||||
defaultCurrency: port.defaultCurrency,
|
||||
},
|
||||
date: {
|
||||
today: now.toISOString().slice(0, 10),
|
||||
year: String(now.getFullYear()),
|
||||
},
|
||||
};
|
||||
}
|
||||
@@ -61,6 +61,13 @@ export const MERGE_FIELDS: MergeFieldCatalog = {
|
||||
{ token: '{{berth.tenureType}}', label: 'Tenure Type', required: false },
|
||||
{ token: '{{berth.tenureYears}}', label: 'Tenure Years', required: false },
|
||||
],
|
||||
reservation: [
|
||||
{ token: '{{reservation.startDate}}', label: 'Reservation Start Date', required: false },
|
||||
{ token: '{{reservation.endDate}}', label: 'Reservation End Date', required: false },
|
||||
{ token: '{{reservation.tenureType}}', label: 'Reservation Tenure Type', required: false },
|
||||
{ token: '{{reservation.termSummary}}', label: 'Reservation Term Summary', required: false },
|
||||
{ token: '{{reservation.signedDate}}', label: 'Reservation Signed Date', required: false },
|
||||
],
|
||||
port: [
|
||||
{ token: '{{port.name}}', label: 'Port Name', required: false },
|
||||
{ token: '{{port.defaultCurrency}}', label: 'Default Currency', required: false },
|
||||
|
||||
@@ -15,7 +15,9 @@ const mergeFieldsSchema = z
|
||||
},
|
||||
);
|
||||
|
||||
export const createTemplateSchema = z.object({
|
||||
export const templateFormats = ['html', 'pdf_form', 'pdf_overlay', 'documenso_render'] as const;
|
||||
|
||||
const createTemplateBaseSchema = z.object({
|
||||
name: z.string().min(1).max(200),
|
||||
description: z.string().max(500).optional(),
|
||||
templateType: z.enum([
|
||||
@@ -26,12 +28,18 @@ export const createTemplateSchema = z.object({
|
||||
'correspondence',
|
||||
'custom',
|
||||
]),
|
||||
bodyHtml: z.string().min(1),
|
||||
templateFormat: z.enum(templateFormats).default('html'),
|
||||
bodyHtml: z.string().min(1).optional(),
|
||||
mergeFields: mergeFieldsSchema,
|
||||
isActive: z.boolean().default(true),
|
||||
});
|
||||
|
||||
export const updateTemplateSchema = createTemplateSchema.partial();
|
||||
export const createTemplateSchema = createTemplateBaseSchema.refine(
|
||||
(data) => data.templateFormat !== 'html' || (data.bodyHtml && data.bodyHtml.length > 0),
|
||||
{ path: ['bodyHtml'], message: 'bodyHtml is required when templateFormat is html' },
|
||||
);
|
||||
|
||||
export const updateTemplateSchema = createTemplateBaseSchema.partial();
|
||||
|
||||
export const listTemplatesSchema = baseListQuerySchema.extend({
|
||||
templateType: z.string().optional(),
|
||||
|
||||
@@ -17,11 +17,83 @@ export const updateDocumentSchema = z.object({
|
||||
status: z.enum(DOCUMENT_STATUSES).optional(),
|
||||
});
|
||||
|
||||
const wizardSignerSchema = z.object({
|
||||
signerName: z.string().min(1),
|
||||
signerEmail: z.string().email(),
|
||||
signerRole: z.enum(['client', 'sales', 'approver', 'developer', 'other']),
|
||||
signingOrder: z.number().int().min(1),
|
||||
});
|
||||
|
||||
export const createDocumentWizardSchema = z
|
||||
.object({
|
||||
source: z.enum(['template', 'upload']).default('template'),
|
||||
templateId: z.string().optional(),
|
||||
uploadedFileId: z.string().optional(),
|
||||
|
||||
documentType: z.enum(DOCUMENT_TYPES),
|
||||
title: z.string().min(1).max(200),
|
||||
notes: z.string().optional(),
|
||||
|
||||
interestId: z.string().optional(),
|
||||
reservationId: z.string().optional(),
|
||||
clientId: z.string().optional(),
|
||||
companyId: z.string().optional(),
|
||||
yachtId: z.string().optional(),
|
||||
|
||||
signers: z.array(wizardSignerSchema).optional(),
|
||||
signingMode: z.enum(['sequential', 'parallel']).default('sequential'),
|
||||
pathway: z.enum(['documenso-template', 'inapp', 'upload']).default('documenso-template'),
|
||||
|
||||
watchers: z.array(z.string()).default([]),
|
||||
|
||||
reminderCadenceOverride: z.number().int().min(1).max(365).nullable().optional(),
|
||||
remindersDisabled: z.boolean().default(false),
|
||||
|
||||
autoPlaceFields: z.boolean().default(true),
|
||||
sendImmediately: z.boolean().default(true),
|
||||
})
|
||||
.refine(
|
||||
(d) =>
|
||||
[d.interestId, d.reservationId, d.clientId, d.companyId, d.yachtId].filter(Boolean).length ===
|
||||
1,
|
||||
{ message: 'Exactly one subject (interest/reservation/client/company/yacht) is required' },
|
||||
)
|
||||
.refine((d) => d.source !== 'template' || Boolean(d.templateId), {
|
||||
path: ['templateId'],
|
||||
message: 'templateId is required when source=template',
|
||||
})
|
||||
.refine((d) => d.source !== 'upload' || Boolean(d.uploadedFileId), {
|
||||
path: ['uploadedFileId'],
|
||||
message: 'uploadedFileId is required when source=upload',
|
||||
});
|
||||
|
||||
export type CreateDocumentWizardInput = z.infer<typeof createDocumentWizardSchema>;
|
||||
|
||||
export const documentsHubTabs = [
|
||||
'all',
|
||||
'awaiting_them',
|
||||
'awaiting_me',
|
||||
'completed',
|
||||
'expired',
|
||||
] as const;
|
||||
export type DocumentsHubTab = (typeof documentsHubTabs)[number];
|
||||
|
||||
export const listDocumentsSchema = baseListQuerySchema.extend({
|
||||
interestId: z.string().optional(),
|
||||
clientId: z.string().optional(),
|
||||
documentType: z.string().optional(),
|
||||
status: z.string().optional(),
|
||||
/** Hub tab filter — applies tab-specific status / signer-membership constraints. */
|
||||
tab: z.enum(documentsHubTabs).optional(),
|
||||
/** Restrict to docs being watched by this user id. */
|
||||
watcherUserId: z.string().optional(),
|
||||
/** When true, only docs intended for signing (default true on hub). */
|
||||
signatureOnly: z
|
||||
.enum(['true', 'false'])
|
||||
.optional()
|
||||
.transform((v) => (v === undefined ? undefined : v === 'true')),
|
||||
sentSince: z.string().datetime().optional(),
|
||||
sentUntil: z.string().datetime().optional(),
|
||||
});
|
||||
|
||||
export const uploadSignedSchema = z.object({
|
||||
|
||||
@@ -15,15 +15,25 @@ export const toggleAccountSchema = z.object({
|
||||
isActive: z.boolean(),
|
||||
});
|
||||
|
||||
export const composeEmailSchema = z.object({
|
||||
accountId: z.string().uuid(),
|
||||
threadId: z.string().uuid().optional(),
|
||||
to: z.array(z.string().email()).min(1),
|
||||
cc: z.array(z.string().email()).optional(),
|
||||
subject: z.string().min(1),
|
||||
bodyHtml: z.string().min(1),
|
||||
inReplyToMessageId: z.string().optional(),
|
||||
});
|
||||
export const composeEmailSchema = z
|
||||
.object({
|
||||
senderType: z.enum(['system', 'user']).default('user'),
|
||||
/** Required when senderType=user; ignored otherwise. */
|
||||
accountId: z.string().uuid().optional(),
|
||||
threadId: z.string().uuid().optional(),
|
||||
to: z.array(z.string().email()).min(1),
|
||||
cc: z.array(z.string().email()).optional(),
|
||||
subject: z.string().min(1),
|
||||
bodyHtml: z.string().min(1),
|
||||
inReplyToMessageId: z.string().optional(),
|
||||
attachments: z
|
||||
.array(z.object({ fileId: z.string().uuid(), filename: z.string().optional() }))
|
||||
.optional(),
|
||||
})
|
||||
.refine((d) => d.senderType !== 'user' || Boolean(d.accountId), {
|
||||
path: ['accountId'],
|
||||
message: 'accountId is required when senderType=user',
|
||||
});
|
||||
|
||||
export const listThreadsSchema = z.object({
|
||||
page: z.coerce.number().int().positive().default(1),
|
||||
|
||||
@@ -24,10 +24,12 @@ export const useUIStore = create<UIStore>()(
|
||||
}),
|
||||
{
|
||||
name: 'pn-crm-ui',
|
||||
// currentPortId/Slug are URL-derived, not user preferences. PortProvider
|
||||
// re-populates them from the route on every navigation. Persisting them
|
||||
// creates a hydration race where queries fire with a stale port id from
|
||||
// the previous session before the URL-derived effect runs.
|
||||
partialize: (state) => ({
|
||||
sidebarCollapsed: state.sidebarCollapsed,
|
||||
currentPortId: state.currentPortId,
|
||||
currentPortSlug: state.currentPortSlug,
|
||||
darkMode: state.darkMode,
|
||||
}),
|
||||
},
|
||||
|
||||
@@ -1,172 +1,180 @@
|
||||
import type { Config } from "tailwindcss";
|
||||
import type { Config } from 'tailwindcss';
|
||||
import tailwindcssAnimate from 'tailwindcss-animate';
|
||||
|
||||
export default {
|
||||
darkMode: ["class", "class"],
|
||||
content: ["./src/**/*.{ts,tsx}"],
|
||||
darkMode: ['class', 'class'],
|
||||
content: ['./src/**/*.{ts,tsx}'],
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
border: "hsl(var(--border))",
|
||||
input: "hsl(var(--input))",
|
||||
ring: "hsl(var(--ring))",
|
||||
background: "hsl(var(--background))",
|
||||
foreground: "hsl(var(--foreground))",
|
||||
primary: {
|
||||
DEFAULT: "hsl(var(--primary))",
|
||||
foreground: "hsl(var(--primary-foreground))",
|
||||
},
|
||||
secondary: {
|
||||
DEFAULT: "hsl(var(--secondary))",
|
||||
foreground: "hsl(var(--secondary-foreground))",
|
||||
},
|
||||
destructive: {
|
||||
DEFAULT: "hsl(var(--destructive))",
|
||||
foreground: "hsl(var(--destructive-foreground))",
|
||||
},
|
||||
muted: {
|
||||
DEFAULT: "hsl(var(--muted))",
|
||||
foreground: "hsl(var(--muted-foreground))",
|
||||
},
|
||||
accent: {
|
||||
DEFAULT: "hsl(var(--accent))",
|
||||
foreground: "hsl(var(--accent-foreground))",
|
||||
},
|
||||
popover: {
|
||||
DEFAULT: "hsl(var(--popover))",
|
||||
foreground: "hsl(var(--popover-foreground))",
|
||||
},
|
||||
card: {
|
||||
DEFAULT: "hsl(var(--card))",
|
||||
foreground: "hsl(var(--card-foreground))",
|
||||
},
|
||||
brand: {
|
||||
'50': '#d8e5f4',
|
||||
'100': '#b1cbe9',
|
||||
'200': '#89b0de',
|
||||
'300': '#6196d3',
|
||||
'400': '#3a7bc8',
|
||||
'500': '#2f6ab5',
|
||||
'600': '#255a9e',
|
||||
'700': '#1c4a87',
|
||||
DEFAULT: '#3a7bc8',
|
||||
dark: '#1e2844'
|
||||
},
|
||||
navy: {
|
||||
'50': '#cdcfd6',
|
||||
'100': '#9ea1af',
|
||||
'200': '#71768a',
|
||||
'300': '#474e66',
|
||||
'400': '#1e2844',
|
||||
'500': '#171f35',
|
||||
'600': '#101625',
|
||||
DEFAULT: '#1e2844'
|
||||
},
|
||||
sage: {
|
||||
DEFAULT: '#dae3c1',
|
||||
light: '#edf1e2',
|
||||
dark: '#b8c49e'
|
||||
},
|
||||
mint: {
|
||||
DEFAULT: '#add5b3',
|
||||
light: '#d6ead9',
|
||||
dark: '#7dba85'
|
||||
},
|
||||
teal: {
|
||||
DEFAULT: '#83aab1',
|
||||
light: '#b1cdd2',
|
||||
dark: '#5a8a92'
|
||||
},
|
||||
purple: {
|
||||
DEFAULT: '#685aa3',
|
||||
light: '#a49ac6',
|
||||
dark: '#4d4280'
|
||||
},
|
||||
success: {
|
||||
DEFAULT: '#2d8a4e',
|
||||
bg: '#e8f5e9',
|
||||
border: '#a5d6a7'
|
||||
},
|
||||
warning: {
|
||||
DEFAULT: '#e6a817',
|
||||
bg: '#fff8e1',
|
||||
border: '#ffe082'
|
||||
},
|
||||
error: {
|
||||
DEFAULT: '#d32f2f',
|
||||
bg: '#ffebee',
|
||||
border: '#ef9a9a'
|
||||
},
|
||||
sidebar: {
|
||||
DEFAULT: '#1e2844',
|
||||
text: '#cdcfd6',
|
||||
hover: '#171f35',
|
||||
active: '#3a7bc8',
|
||||
divider: '#474e66'
|
||||
}
|
||||
},
|
||||
fontFamily: {
|
||||
sans: [
|
||||
'Inter',
|
||||
'system-ui',
|
||||
'-apple-system',
|
||||
'Arial',
|
||||
'sans-serif'
|
||||
],
|
||||
mono: [
|
||||
'JetBrains Mono',
|
||||
'ui-monospace',
|
||||
'monospace'
|
||||
],
|
||||
serif: [
|
||||
'Georgia',
|
||||
'Times New Roman',
|
||||
'serif'
|
||||
]
|
||||
},
|
||||
boxShadow: {
|
||||
sm: '0 1px 2px rgba(30, 40, 68, 0.06)',
|
||||
DEFAULT: '0 1px 3px rgba(30, 40, 68, 0.10), 0 1px 2px rgba(30, 40, 68, 0.06)',
|
||||
md: '0 4px 6px rgba(30, 40, 68, 0.10), 0 2px 4px rgba(30, 40, 68, 0.06)',
|
||||
lg: '0 10px 15px rgba(30, 40, 68, 0.10), 0 4px 6px rgba(30, 40, 68, 0.05)',
|
||||
xl: '0 20px 25px rgba(30, 40, 68, 0.10), 0 8px 10px rgba(30, 40, 68, 0.04)'
|
||||
},
|
||||
borderRadius: {
|
||||
sm: '0.25rem',
|
||||
DEFAULT: '0.375rem',
|
||||
md: '0.5rem',
|
||||
lg: '0.75rem',
|
||||
xl: '1rem'
|
||||
},
|
||||
width: {
|
||||
sidebar: '256px',
|
||||
'sidebar-collapsed': '64px'
|
||||
},
|
||||
transitionDuration: {
|
||||
sidebar: '200ms'
|
||||
},
|
||||
keyframes: {
|
||||
'accordion-down': {
|
||||
from: {
|
||||
height: '0'
|
||||
},
|
||||
to: {
|
||||
height: 'var(--radix-accordion-content-height)'
|
||||
}
|
||||
},
|
||||
'accordion-up': {
|
||||
from: {
|
||||
height: 'var(--radix-accordion-content-height)'
|
||||
},
|
||||
to: {
|
||||
height: '0'
|
||||
}
|
||||
}
|
||||
},
|
||||
animation: {
|
||||
'accordion-down': 'accordion-down 0.2s ease-out',
|
||||
'accordion-up': 'accordion-up 0.2s ease-out'
|
||||
}
|
||||
}
|
||||
extend: {
|
||||
colors: {
|
||||
border: 'hsl(var(--border))',
|
||||
input: 'hsl(var(--input))',
|
||||
ring: 'hsl(var(--ring))',
|
||||
background: 'hsl(var(--background))',
|
||||
foreground: 'hsl(var(--foreground))',
|
||||
primary: {
|
||||
DEFAULT: 'hsl(var(--primary))',
|
||||
foreground: 'hsl(var(--primary-foreground))',
|
||||
},
|
||||
secondary: {
|
||||
DEFAULT: 'hsl(var(--secondary))',
|
||||
foreground: 'hsl(var(--secondary-foreground))',
|
||||
},
|
||||
destructive: {
|
||||
DEFAULT: 'hsl(var(--destructive))',
|
||||
foreground: 'hsl(var(--destructive-foreground))',
|
||||
},
|
||||
muted: {
|
||||
DEFAULT: 'hsl(var(--muted))',
|
||||
foreground: 'hsl(var(--muted-foreground))',
|
||||
},
|
||||
accent: {
|
||||
DEFAULT: 'hsl(var(--accent))',
|
||||
foreground: 'hsl(var(--accent-foreground))',
|
||||
},
|
||||
popover: {
|
||||
DEFAULT: 'hsl(var(--popover))',
|
||||
foreground: 'hsl(var(--popover-foreground))',
|
||||
},
|
||||
card: {
|
||||
DEFAULT: 'hsl(var(--card))',
|
||||
foreground: 'hsl(var(--card-foreground))',
|
||||
},
|
||||
brand: {
|
||||
'50': '#d8e5f4',
|
||||
'100': '#b1cbe9',
|
||||
'200': '#89b0de',
|
||||
'300': '#6196d3',
|
||||
'400': '#3a7bc8',
|
||||
'500': '#2f6ab5',
|
||||
'600': '#255a9e',
|
||||
'700': '#1c4a87',
|
||||
DEFAULT: '#3a7bc8',
|
||||
dark: '#1e2844',
|
||||
},
|
||||
navy: {
|
||||
'50': '#cdcfd6',
|
||||
'100': '#9ea1af',
|
||||
'200': '#71768a',
|
||||
'300': '#474e66',
|
||||
'400': '#1e2844',
|
||||
'500': '#171f35',
|
||||
'600': '#101625',
|
||||
DEFAULT: '#1e2844',
|
||||
},
|
||||
sage: {
|
||||
DEFAULT: '#dae3c1',
|
||||
light: '#edf1e2',
|
||||
dark: '#b8c49e',
|
||||
},
|
||||
mint: {
|
||||
DEFAULT: '#add5b3',
|
||||
light: '#d6ead9',
|
||||
dark: '#7dba85',
|
||||
},
|
||||
teal: {
|
||||
DEFAULT: '#83aab1',
|
||||
light: '#b1cdd2',
|
||||
dark: '#5a8a92',
|
||||
},
|
||||
purple: {
|
||||
DEFAULT: '#685aa3',
|
||||
light: '#a49ac6',
|
||||
dark: '#4d4280',
|
||||
},
|
||||
success: {
|
||||
DEFAULT: '#2d8a4e',
|
||||
bg: '#e8f5e9',
|
||||
border: '#a5d6a7',
|
||||
},
|
||||
warning: {
|
||||
DEFAULT: '#e6a817',
|
||||
bg: '#fff8e1',
|
||||
border: '#ffe082',
|
||||
},
|
||||
error: {
|
||||
DEFAULT: '#d32f2f',
|
||||
bg: '#ffebee',
|
||||
border: '#ef9a9a',
|
||||
},
|
||||
sidebar: {
|
||||
DEFAULT: '#1e2844',
|
||||
text: '#cdcfd6',
|
||||
hover: '#171f35',
|
||||
active: '#3a7bc8',
|
||||
divider: '#474e66',
|
||||
},
|
||||
},
|
||||
fontFamily: {
|
||||
sans: ['Inter', 'system-ui', '-apple-system', 'Arial', 'sans-serif'],
|
||||
mono: ['JetBrains Mono', 'ui-monospace', 'monospace'],
|
||||
serif: ['Georgia', 'Times New Roman', 'serif'],
|
||||
},
|
||||
boxShadow: {
|
||||
xs: '0 1px 2px 0 rgb(15 23 42 / 0.04)',
|
||||
sm: '0 2px 4px -1px rgb(15 23 42 / 0.06)',
|
||||
DEFAULT: '0 1px 3px rgba(30, 40, 68, 0.10), 0 1px 2px rgba(30, 40, 68, 0.06)',
|
||||
md: '0 4px 12px -2px rgb(15 23 42 / 0.08)',
|
||||
lg: '0 12px 32px -8px rgb(15 23 42 / 0.12)',
|
||||
xl: '0 20px 25px rgba(30, 40, 68, 0.10), 0 8px 10px rgba(30, 40, 68, 0.04)',
|
||||
glow: '0 0 0 4px rgb(58 123 200 / 0.12)',
|
||||
},
|
||||
borderRadius: {
|
||||
sm: '0.375rem',
|
||||
DEFAULT: '0.375rem',
|
||||
md: '0.5rem',
|
||||
lg: '0.625rem',
|
||||
xl: '0.875rem',
|
||||
},
|
||||
backgroundImage: {
|
||||
'gradient-brand': 'linear-gradient(135deg, #3a7bc8 0%, #2f6ab5 100%)',
|
||||
'gradient-brand-soft': 'linear-gradient(135deg, #d8e5f4 0%, #ffffff 100%)',
|
||||
'gradient-success': 'linear-gradient(135deg, #e8f5e9 0%, #ffffff 100%)',
|
||||
'gradient-warning': 'linear-gradient(135deg, #fef3c7 0%, #ffffff 100%)',
|
||||
},
|
||||
transitionTimingFunction: {
|
||||
spring: 'cubic-bezier(0.34, 1.56, 0.64, 1)',
|
||||
smooth: 'cubic-bezier(0.4, 0, 0.2, 1)',
|
||||
},
|
||||
width: {
|
||||
sidebar: '256px',
|
||||
'sidebar-collapsed': '64px',
|
||||
},
|
||||
transitionDuration: {
|
||||
sidebar: '200ms',
|
||||
fast: '150ms',
|
||||
base: '200ms',
|
||||
slow: '300ms',
|
||||
},
|
||||
keyframes: {
|
||||
'accordion-down': {
|
||||
from: {
|
||||
height: '0',
|
||||
},
|
||||
to: {
|
||||
height: 'var(--radix-accordion-content-height)',
|
||||
},
|
||||
},
|
||||
'accordion-up': {
|
||||
from: {
|
||||
height: 'var(--radix-accordion-content-height)',
|
||||
},
|
||||
to: {
|
||||
height: '0',
|
||||
},
|
||||
},
|
||||
'badge-pop': {
|
||||
'0%': { transform: 'scale(0.5)', opacity: '0' },
|
||||
'60%': { transform: 'scale(1.18)', opacity: '1' },
|
||||
'100%': { transform: 'scale(1)', opacity: '1' },
|
||||
},
|
||||
},
|
||||
animation: {
|
||||
'accordion-down': 'accordion-down 0.2s ease-out',
|
||||
'accordion-up': 'accordion-up 0.2s ease-out',
|
||||
'badge-pop': 'badge-pop 0.32s cubic-bezier(0.34, 1.56, 0.64, 1)',
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [require("tailwindcss-animate")],
|
||||
plugins: [tailwindcssAnimate],
|
||||
} satisfies Config;
|
||||
|
||||
56
tests/e2e/realapi/documenso-cancel.spec.ts
Normal file
56
tests/e2e/realapi/documenso-cancel.spec.ts
Normal file
@@ -0,0 +1,56 @@
|
||||
import 'dotenv/config';
|
||||
import { test, expect } from '@playwright/test';
|
||||
|
||||
import { login, apiHeaders } from '../smoke/helpers';
|
||||
|
||||
/**
|
||||
* Real-API spec for the cancel flow (Phase A PR2 + PR5).
|
||||
*
|
||||
* Generates a real Documenso document, then calls POST
|
||||
* /api/v1/documents/[id]/cancel and asserts the local DB flips to cancelled.
|
||||
* Per PR2 review, voidDocument treats transient remote failures as
|
||||
* recoverable so the local cancel succeeds even if Documenso flakes.
|
||||
*
|
||||
* Skips when Documenso env not present.
|
||||
*/
|
||||
|
||||
const DOCUMENSO_BASE = process.env.DOCUMENSO_API_URL;
|
||||
const DOCUMENSO_API_KEY = process.env.DOCUMENSO_API_KEY;
|
||||
|
||||
test.describe('Documenso cancel pathway', () => {
|
||||
test.skip(!DOCUMENSO_BASE || !DOCUMENSO_API_KEY, 'DOCUMENSO_API_URL / DOCUMENSO_API_KEY not set');
|
||||
|
||||
test.beforeEach(async ({ page }) => {
|
||||
await login(page, 'super_admin');
|
||||
});
|
||||
|
||||
test('cancel an in-flight document flips status to cancelled', async ({ page }) => {
|
||||
const stamp = Date.now();
|
||||
const headers = await apiHeaders(page);
|
||||
|
||||
// Seed a minimal client to ensure a doc can be created. Real cancel
|
||||
// testing assumes either an existing in-flight doc or the wizard flow
|
||||
// has already produced one. We probe the hub for an in-flight doc and
|
||||
// skip if none — this lets the spec run as a smoke check rather than
|
||||
// a fixture-dependent integration.
|
||||
const list = await page.request.get(
|
||||
'/api/v1/documents?tab=awaiting_them&signatureOnly=true&limit=1',
|
||||
{ headers },
|
||||
);
|
||||
expect(list.ok()).toBe(true);
|
||||
const body = (await list.json()) as { data: Array<{ id: string; status: string }> };
|
||||
test.skip(body.data.length === 0, 'no in-flight documents to cancel');
|
||||
|
||||
const docId = body.data[0]!.id;
|
||||
const cancelRes = await page.request.post(`/api/v1/documents/${docId}/cancel`, {
|
||||
headers,
|
||||
data: { _stamp: stamp },
|
||||
});
|
||||
expect(cancelRes.ok(), `cancel: ${cancelRes.status()}`).toBe(true);
|
||||
|
||||
// Verify status flipped
|
||||
const after = await page.request.get(`/api/v1/documents/${docId}`, { headers });
|
||||
const afterBody = (await after.json()) as { data: { status: string } };
|
||||
expect(afterBody.data.status).toBe('cancelled');
|
||||
});
|
||||
});
|
||||
41
tests/e2e/realapi/email-attachments-roundtrip.spec.ts
Normal file
41
tests/e2e/realapi/email-attachments-roundtrip.spec.ts
Normal file
@@ -0,0 +1,41 @@
|
||||
import 'dotenv/config';
|
||||
import { test, expect } from '@playwright/test';
|
||||
|
||||
import { login, apiHeaders } from '../smoke/helpers';
|
||||
|
||||
/**
|
||||
* Real-API spec covering attachment cross-port enforcement (Phase A PR8).
|
||||
*
|
||||
* The hot-path SMTP+IMAP roundtrip is exercised by smtp-system-send.spec.ts.
|
||||
* This spec specifically verifies that attaching a fileId from a different
|
||||
* port returns 403 *before* SMTP is touched.
|
||||
*
|
||||
* Requires SMTP_HOST + a second port slug (PHASE_A_OTHER_PORT_SLUG) seeded
|
||||
* with a file the calling user cannot reach. Skips otherwise.
|
||||
*/
|
||||
|
||||
const SMTP_HOST = process.env.SMTP_HOST;
|
||||
const OTHER_PORT_FILE_ID = process.env.PHASE_A_CROSS_PORT_FILE_ID;
|
||||
|
||||
test.describe('Email attachments — port isolation', () => {
|
||||
test.skip(!SMTP_HOST || !OTHER_PORT_FILE_ID, 'cross-port fixture not configured');
|
||||
|
||||
test.beforeEach(async ({ page }) => {
|
||||
await login(page, 'super_admin');
|
||||
});
|
||||
|
||||
test('rejects cross-port fileId with 403 before SMTP', async ({ page }) => {
|
||||
const headers = await apiHeaders(page);
|
||||
const res = await page.request.post('/api/v1/email/compose', {
|
||||
headers,
|
||||
data: {
|
||||
senderType: 'system',
|
||||
to: ['noop@example.test'],
|
||||
subject: 'cross-port attempt',
|
||||
bodyHtml: '<p>should fail before SMTP</p>',
|
||||
attachments: [{ fileId: OTHER_PORT_FILE_ID! }],
|
||||
},
|
||||
});
|
||||
expect(res.status()).toBe(403);
|
||||
});
|
||||
});
|
||||
62
tests/e2e/realapi/minio-file-lifecycle.spec.ts
Normal file
62
tests/e2e/realapi/minio-file-lifecycle.spec.ts
Normal file
@@ -0,0 +1,62 @@
|
||||
import 'dotenv/config';
|
||||
import { test, expect } from '@playwright/test';
|
||||
|
||||
import { login, apiHeaders } from '../smoke/helpers';
|
||||
|
||||
/**
|
||||
* Real-API spec for the MinIO file lifecycle (Phase A PR11).
|
||||
*
|
||||
* Uploads a file via POST /api/v1/files, lists it, downloads it, asserts
|
||||
* byte-equality with the upload, then deletes it. Verifies port-isolation
|
||||
* by attempting download with no auth and expecting 401.
|
||||
*
|
||||
* Requires MINIO_* env to be configured (the dev-server startup already
|
||||
* validates these via env.ts). Skips when MINIO_ENDPOINT is unset.
|
||||
*/
|
||||
|
||||
const MINIO_ENDPOINT = process.env.MINIO_ENDPOINT;
|
||||
|
||||
test.describe('MinIO file lifecycle', () => {
|
||||
test.skip(!MINIO_ENDPOINT, 'MINIO_ENDPOINT not configured');
|
||||
|
||||
test.beforeEach(async ({ page }) => {
|
||||
await login(page, 'super_admin');
|
||||
});
|
||||
|
||||
test('upload → list → download → delete round-trip', async ({ page }) => {
|
||||
const headers = await apiHeaders(page);
|
||||
const sentinel = `phase-a-minio-${Date.now()}`;
|
||||
const buffer = Buffer.from(sentinel.repeat(8));
|
||||
|
||||
// Upload
|
||||
const uploadRes = await page.request.post('/api/v1/files', {
|
||||
headers,
|
||||
multipart: {
|
||||
file: {
|
||||
name: 'phase-a-minio.txt',
|
||||
mimeType: 'text/plain',
|
||||
buffer,
|
||||
},
|
||||
},
|
||||
});
|
||||
expect(uploadRes.ok(), `upload: ${uploadRes.status()}`).toBe(true);
|
||||
const uploadBody = (await uploadRes.json()) as { data: { id: string } };
|
||||
const fileId = uploadBody.data.id;
|
||||
|
||||
// List should include the file
|
||||
const list = await page.request.get('/api/v1/files?limit=50', { headers });
|
||||
expect(list.ok()).toBe(true);
|
||||
const listBody = (await list.json()) as { data: Array<{ id: string }> };
|
||||
expect(listBody.data.find((f) => f.id === fileId)).toBeDefined();
|
||||
|
||||
// Download — assert byte-equality
|
||||
const dlRes = await page.request.get(`/api/v1/files/${fileId}/download`, { headers });
|
||||
expect(dlRes.ok()).toBe(true);
|
||||
const dlBody = await dlRes.body();
|
||||
expect(dlBody.equals(buffer)).toBe(true);
|
||||
|
||||
// Delete
|
||||
const delRes = await page.request.delete(`/api/v1/files/${fileId}`, { headers });
|
||||
expect(delRes.ok()).toBe(true);
|
||||
});
|
||||
});
|
||||
98
tests/e2e/realapi/smtp-system-send.spec.ts
Normal file
98
tests/e2e/realapi/smtp-system-send.spec.ts
Normal file
@@ -0,0 +1,98 @@
|
||||
import 'dotenv/config';
|
||||
import { test, expect } from '@playwright/test';
|
||||
import { ImapFlow } from 'imapflow';
|
||||
import { simpleParser } from 'mailparser';
|
||||
|
||||
import { login, apiHeaders } from '../smoke/helpers';
|
||||
|
||||
/**
|
||||
* Real-API spec for the system-path send (Phase A PR8).
|
||||
*
|
||||
* Composes via the email composer with senderType=system, asserts the message
|
||||
* lands in the configured IMAP mailbox via the port-config noreply identity,
|
||||
* and verifies the attachment bytes round-trip end-to-end.
|
||||
*
|
||||
* Requires:
|
||||
* SMTP_HOST / SMTP_PORT / SMTP_USER / SMTP_PASS — outbound transport
|
||||
* IMAP_HOST / IMAP_PORT / IMAP_USER / IMAP_PASS — inbound for verification
|
||||
*/
|
||||
|
||||
const SMTP_HOST = process.env.SMTP_HOST;
|
||||
const IMAP_HOST = process.env.IMAP_HOST;
|
||||
const IMAP_PORT = process.env.IMAP_PORT ? Number(process.env.IMAP_PORT) : 993;
|
||||
const IMAP_USER = process.env.IMAP_USER;
|
||||
const IMAP_PASS = process.env.IMAP_PASS;
|
||||
|
||||
test.describe('SMTP system-path send', () => {
|
||||
test.skip(!SMTP_HOST || !IMAP_HOST || !IMAP_USER || !IMAP_PASS, 'SMTP/IMAP env not configured');
|
||||
|
||||
test.beforeEach(async ({ page }) => {
|
||||
await login(page, 'super_admin');
|
||||
});
|
||||
|
||||
test('system send → IMAP fetch → attachment bytes match', async ({ page }) => {
|
||||
const headers = await apiHeaders(page);
|
||||
|
||||
// 1. Upload a small file we'll attach to the email.
|
||||
const sentinel = `phase-a-attach-${Date.now()}`;
|
||||
const uploadRes = await page.request.post('/api/v1/files', {
|
||||
headers,
|
||||
multipart: {
|
||||
file: {
|
||||
name: 'phase-a.txt',
|
||||
mimeType: 'text/plain',
|
||||
buffer: Buffer.from(sentinel),
|
||||
},
|
||||
},
|
||||
});
|
||||
expect(uploadRes.ok(), `upload: ${uploadRes.status()}`).toBe(true);
|
||||
const uploadBody = (await uploadRes.json()) as { data: { id: string } };
|
||||
|
||||
// 2. Compose via system path
|
||||
const subject = `Phase A system send ${Date.now()}`;
|
||||
const sendRes = await page.request.post('/api/v1/email/compose', {
|
||||
headers,
|
||||
data: {
|
||||
senderType: 'system',
|
||||
to: [IMAP_USER!],
|
||||
subject,
|
||||
bodyHtml: '<p>System-path send.</p>',
|
||||
attachments: [{ fileId: uploadBody.data.id, filename: 'phase-a.txt' }],
|
||||
},
|
||||
});
|
||||
expect(sendRes.ok(), `compose: ${sendRes.status()} ${await sendRes.text()}`).toBe(true);
|
||||
|
||||
// 3. Poll IMAP for the message.
|
||||
const client = new ImapFlow({
|
||||
host: IMAP_HOST!,
|
||||
port: IMAP_PORT,
|
||||
secure: IMAP_PORT === 993,
|
||||
auth: { user: IMAP_USER!, pass: IMAP_PASS! },
|
||||
logger: false,
|
||||
});
|
||||
await client.connect();
|
||||
try {
|
||||
let attempts = 0;
|
||||
let attachmentMatched = false;
|
||||
while (attempts++ < 18 && !attachmentMatched) {
|
||||
await new Promise((r) => setTimeout(r, 5_000));
|
||||
const lock = await client.getMailboxLock('INBOX');
|
||||
try {
|
||||
for await (const msg of client.fetch({ subject } as never, { source: true })) {
|
||||
const parsed = await simpleParser(msg.source as Buffer);
|
||||
const att = parsed.attachments.find((a) => a.filename === 'phase-a.txt');
|
||||
if (att && att.content.toString() === sentinel) {
|
||||
attachmentMatched = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
} finally {
|
||||
lock.release();
|
||||
}
|
||||
}
|
||||
expect(attachmentMatched, 'attachment bytes match').toBe(true);
|
||||
} finally {
|
||||
await client.logout();
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -1,5 +1,5 @@
|
||||
import { test, expect } from '@playwright/test';
|
||||
import { login, navigateTo, waitForSheet, PORT_SLUG } from './helpers';
|
||||
import { login, navigateTo, waitForSheet } from './helpers';
|
||||
|
||||
test.describe('Interest Pipeline', () => {
|
||||
test.beforeEach(async ({ page }) => {
|
||||
@@ -9,7 +9,10 @@ test.describe('Interest Pipeline', () => {
|
||||
test('create a client and interest', async ({ page }) => {
|
||||
// First create a client
|
||||
await navigateTo(page, '/clients');
|
||||
await page.getByRole('button', { name: /new client/i }).first().click();
|
||||
await page
|
||||
.getByRole('button', { name: /new client/i })
|
||||
.first()
|
||||
.click();
|
||||
await waitForSheet(page);
|
||||
|
||||
const clientName = `Pipeline Client ${Date.now()}`;
|
||||
@@ -76,16 +79,31 @@ test.describe('Interest Pipeline', () => {
|
||||
test('interests page loads with data', async ({ page }) => {
|
||||
await navigateTo(page, '/interests');
|
||||
await page.waitForLoadState('networkidle');
|
||||
await page.waitForTimeout(3000);
|
||||
|
||||
// Should see interests page content
|
||||
const heading = page.getByText(/interests/i).first();
|
||||
await expect(heading).toBeVisible({ timeout: 10_000 });
|
||||
await expect(heading).toBeVisible({ timeout: 15_000 });
|
||||
|
||||
// Check for table or board view
|
||||
const hasTable = await page.locator('table').isVisible({ timeout: 3_000 }).catch(() => false);
|
||||
const hasBoard = await page.getByText(/open|board|kanban/i).isVisible({ timeout: 3_000 }).catch(() => false);
|
||||
expect(hasTable || hasBoard).toBeTruthy();
|
||||
// Wait for either the table or pipeline board to render (dev-mode JIT can
|
||||
// take >3s on first hit). `isVisible()` is non-waiting; use `expect.poll`
|
||||
// to actually wait for one of the views to appear.
|
||||
await expect
|
||||
.poll(
|
||||
async () => {
|
||||
const table = await page
|
||||
.locator('table')
|
||||
.isVisible()
|
||||
.catch(() => false);
|
||||
const board = await page
|
||||
.locator('[data-testid="pipeline-board"], [class*="board"]')
|
||||
.first()
|
||||
.isVisible()
|
||||
.catch(() => false);
|
||||
return table || board;
|
||||
},
|
||||
{ timeout: 15_000 },
|
||||
)
|
||||
.toBe(true);
|
||||
});
|
||||
|
||||
test('interest detail page works', async ({ page }) => {
|
||||
|
||||
@@ -12,9 +12,10 @@ test.describe('Dashboard', () => {
|
||||
// navigate to the port-scoped dashboard to verify the real content renders.
|
||||
await navigateTo(page, '/');
|
||||
expect(page.url()).toContain(`/${PORT_SLUG}`);
|
||||
// Should see the dashboard shell (KPI cards are always rendered at the top)
|
||||
// Should see the dashboard shell (KPI cards are always rendered at the top).
|
||||
// Dev-mode JIT compilation can push first-hit render past 10s.
|
||||
await expect(page.getByText(/total clients/i).first()).toBeVisible({
|
||||
timeout: 10_000,
|
||||
timeout: 15_000,
|
||||
});
|
||||
// Should NOT see the old placeholder text
|
||||
await expect(page.getByText('Coming in Layer'))
|
||||
@@ -25,9 +26,11 @@ test.describe('Dashboard', () => {
|
||||
// Test 2: All 4 KPI cards render
|
||||
test('all 4 KPI cards render without errors', async ({ page }) => {
|
||||
await navigateTo(page, '/');
|
||||
await page.waitForTimeout(3_000);
|
||||
|
||||
// Look for KPI-related text/elements — the cards should contain numbers or labels
|
||||
// Wait for the KPI cards to actually render (dev mode JIT can take >3s on
|
||||
// a cold dashboard hit). The cards expose stable label text we can poll on.
|
||||
await expect(page.getByText('Total Clients')).toBeVisible({ timeout: 15_000 });
|
||||
|
||||
const cards = page.locator('[class*="card"], [data-testid*="kpi"]');
|
||||
const cardCount = await cards.count();
|
||||
expect(cardCount).toBeGreaterThanOrEqual(4);
|
||||
|
||||
@@ -27,7 +27,12 @@ test.describe('System Monitoring', () => {
|
||||
test('all BullMQ queues listed with stats', async ({ page }) => {
|
||||
await login(page, 'super_admin');
|
||||
await navigateTo(page, '/admin/monitoring');
|
||||
await page.waitForTimeout(3_000);
|
||||
|
||||
// Anchor on a queue-only name (not in sidebar) to confirm the panel
|
||||
// has finished loading before counting matches.
|
||||
await expect(page.getByText('webhooks', { exact: false }).first()).toBeVisible({
|
||||
timeout: 15_000,
|
||||
});
|
||||
|
||||
// Expected queue names from QUEUE_CONFIGS
|
||||
const queueNames = [
|
||||
@@ -46,7 +51,7 @@ test.describe('System Monitoring', () => {
|
||||
let foundCount = 0;
|
||||
for (const name of queueNames) {
|
||||
const queueCard = page.getByText(name, { exact: false }).first();
|
||||
if (await queueCard.isVisible({ timeout: 2_000 }).catch(() => false)) {
|
||||
if (await queueCard.isVisible().catch(() => false)) {
|
||||
foundCount++;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -8,30 +8,10 @@ test.describe('Role-Based UI', () => {
|
||||
// Give React Query time to resolve permissions
|
||||
await page.waitForTimeout(3_000);
|
||||
|
||||
// Admin section (Settings / Administration) should appear in the sidebar
|
||||
const adminNav = page
|
||||
.getByText(/admin/i)
|
||||
.first()
|
||||
.or(page.getByRole('link', { name: /settings/i }).first())
|
||||
.or(page.getByRole('link', { name: /administration/i }).first());
|
||||
|
||||
const adminNavVisible = await adminNav.isVisible({ timeout: 10_000 }).catch(() => false);
|
||||
|
||||
if (!adminNavVisible) {
|
||||
// Some layouts collapse the admin section behind a toggle — try expanding
|
||||
const adminToggle = page.locator('[data-testid*="admin"], [class*="admin"]').first();
|
||||
if (await adminToggle.isVisible({ timeout: 3_000 }).catch(() => false)) {
|
||||
await adminToggle.click();
|
||||
await page.waitForTimeout(1_000);
|
||||
}
|
||||
}
|
||||
|
||||
// Re-check for admin-related navigation after any expansion attempt
|
||||
const settingsLink = page
|
||||
.getByRole('link', { name: /settings/i })
|
||||
.first()
|
||||
.or(page.getByText(/settings|administration|admin/i).first());
|
||||
|
||||
// Sidebar exposes a Settings link inside the Admin section (visible by
|
||||
// default for super_admin). Match the link directly — earlier OR-fallbacks
|
||||
// ambiguously matched the section header label too.
|
||||
const settingsLink = page.getByRole('link', { name: 'Settings', exact: true }).first();
|
||||
await expect(settingsLink).toBeVisible({ timeout: 10_000 });
|
||||
|
||||
// "+ New" button (or equivalent CTA) should be visible
|
||||
|
||||
@@ -162,7 +162,13 @@ test.describe('Admin Features', () => {
|
||||
|
||||
test('monitoring dashboard shows queue overview with expected queues', async ({ page }) => {
|
||||
await navigateTo(page, '/admin/monitoring');
|
||||
await page.waitForTimeout(3_000);
|
||||
|
||||
// Wait for the queue overview section to render. The queue cards expose
|
||||
// names that don't appear in the sidebar (e.g. webhooks, maintenance) so
|
||||
// we anchor on one of those to confirm the panel has loaded.
|
||||
await expect(page.getByText('webhooks', { exact: false }).first()).toBeVisible({
|
||||
timeout: 15_000,
|
||||
});
|
||||
|
||||
// All 10 expected queue names from QUEUE_CONFIGS
|
||||
const expectedQueues = [
|
||||
@@ -181,7 +187,7 @@ test.describe('Admin Features', () => {
|
||||
let foundCount = 0;
|
||||
for (const queueName of expectedQueues) {
|
||||
const queueEl = page.getByText(queueName, { exact: false }).first();
|
||||
const visible = await queueEl.isVisible({ timeout: 2_000 }).catch(() => false);
|
||||
const visible = await queueEl.isVisible().catch(() => false);
|
||||
if (visible) foundCount++;
|
||||
}
|
||||
|
||||
|
||||
@@ -67,6 +67,84 @@ test.describe('Residential', () => {
|
||||
});
|
||||
});
|
||||
|
||||
test('create a residential interest via API and see it on the interests list', async ({
|
||||
page,
|
||||
}) => {
|
||||
const portId = await getPortId(page);
|
||||
const stamp = Date.now();
|
||||
|
||||
// 1) Create a residential client via the v1 API.
|
||||
const clientRes = await page.request.post('/api/v1/residential/clients', {
|
||||
data: {
|
||||
fullName: `E2E Res ${stamp}`,
|
||||
email: `e2e-res-${stamp}@test.example`,
|
||||
phone: '+1-555-0199',
|
||||
},
|
||||
headers: { 'Content-Type': 'application/json', 'x-port-id': portId },
|
||||
});
|
||||
expect(clientRes.status()).toBe(201);
|
||||
const clientBody = await clientRes.json();
|
||||
const residentialClientId = clientBody.data?.id ?? clientBody.id;
|
||||
expect(residentialClientId).toBeTruthy();
|
||||
|
||||
// 2) Create a residential interest tied to that client.
|
||||
const interestRes = await page.request.post('/api/v1/residential/interests', {
|
||||
data: {
|
||||
residentialClientId,
|
||||
preferences: `2BR oceanview, budget €${stamp}`,
|
||||
notes: `Smoke interest ${stamp}`,
|
||||
source: 'manual',
|
||||
},
|
||||
headers: { 'Content-Type': 'application/json', 'x-port-id': portId },
|
||||
});
|
||||
expect(interestRes.status()).toBe(201);
|
||||
const interestBody = await interestRes.json();
|
||||
const residentialInterestId = interestBody.data?.id ?? interestBody.id;
|
||||
expect(residentialInterestId).toBeTruthy();
|
||||
|
||||
// 3) Confirm it shows up on the residential interests list page.
|
||||
// The list renders preferences/notes (not the client name), so match
|
||||
// against the unique stamp embedded in the preferences string.
|
||||
await navigateTo(page, '/residential/interests');
|
||||
await expect(page.getByText(new RegExp(String(stamp))).first()).toBeVisible({
|
||||
timeout: 15_000,
|
||||
});
|
||||
});
|
||||
|
||||
test('residential interest detail page renders for a freshly-created interest', async ({
|
||||
page,
|
||||
}) => {
|
||||
const portId = await getPortId(page);
|
||||
const stamp = Date.now();
|
||||
|
||||
const clientRes = await page.request.post('/api/v1/residential/clients', {
|
||||
data: {
|
||||
fullName: `E2E ResDetail ${stamp}`,
|
||||
email: `e2e-res-detail-${stamp}@test.example`,
|
||||
},
|
||||
headers: { 'Content-Type': 'application/json', 'x-port-id': portId },
|
||||
});
|
||||
expect(clientRes.status()).toBe(201);
|
||||
const clientId = (await clientRes.json()).data?.id;
|
||||
|
||||
const interestRes = await page.request.post('/api/v1/residential/interests', {
|
||||
data: { residentialClientId: clientId, preferences: 'penthouse, sea view', source: 'manual' },
|
||||
headers: { 'Content-Type': 'application/json', 'x-port-id': portId },
|
||||
});
|
||||
expect(interestRes.status()).toBe(201);
|
||||
const interestId = (await interestRes.json()).data?.id;
|
||||
|
||||
// Navigate to the detail route — the page should render the standard
|
||||
// residential-interest detail layout (eyebrow + client name h1 + sections).
|
||||
await navigateTo(page, `/residential/interests/${interestId}`);
|
||||
await expect(page.getByText('Residential interest', { exact: true }).first()).toBeVisible({
|
||||
timeout: 15_000,
|
||||
});
|
||||
await expect(page.getByRole('heading', { name: /E2E ResDetail/ }).first()).toBeVisible({
|
||||
timeout: 5_000,
|
||||
});
|
||||
});
|
||||
|
||||
test('public residential inquiry endpoint accepts a submission', async ({ page }) => {
|
||||
// Direct API call to the public endpoint — confirms wiring without UI.
|
||||
// Public endpoint takes portId via query string (no auth, but the helper
|
||||
|
||||
71
tests/global-setup.ts
Normal file
71
tests/global-setup.ts
Normal file
@@ -0,0 +1,71 @@
|
||||
/**
|
||||
* Vitest global setup. The teardown phase runs after the test run completes
|
||||
* (whether passing or failing) and purges any `test-port-*` rows the
|
||||
* `makePort()` factory created during the run, plus the dependent rows
|
||||
* those ports own.
|
||||
*
|
||||
* Without this, integration tests leak hundreds of test ports per run; we
|
||||
* once accumulated >17k such rows in dev, slowing every page load that
|
||||
* fetches the port-switcher list.
|
||||
*/
|
||||
|
||||
// `globalSetup` runs in vitest's parent process, so the test workers' env
|
||||
// from `loadEnv` doesn't apply here — we have to load .env ourselves before
|
||||
// importing the db module (which validates DATABASE_URL at import time).
|
||||
import 'dotenv/config';
|
||||
import { sql } from 'drizzle-orm';
|
||||
import { db, closeDb } from '@/lib/db';
|
||||
|
||||
export async function setup() {
|
||||
// No-op: per-suite setup happens inside individual test files.
|
||||
}
|
||||
|
||||
export async function teardown() {
|
||||
// Same DB as the dev/test environment — only delete obvious test rows
|
||||
// (slug prefix is a marker the factory always sets).
|
||||
await db.execute(sql`
|
||||
-- Stage the doomed port ids
|
||||
WITH doomed AS (
|
||||
SELECT id FROM ports WHERE slug LIKE 'test-port-%'
|
||||
)
|
||||
-- Cascade-delete dependent rows. Order respects FK chains.
|
||||
, del_audit AS (DELETE FROM audit_logs WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_bml AS (DELETE FROM berth_maintenance_log WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_resv AS (DELETE FROM berth_reservations WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_caddr AS (DELETE FROM client_addresses WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_cmlog AS (DELETE FROM client_merge_log WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_crel AS (DELETE FROM client_relationships WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_compaddr AS (DELETE FROM company_addresses WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_comp AS (DELETE FROM companies WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_cfd AS (DELETE FROM custom_field_definitions WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_docs AS (DELETE FROM documents WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_dt AS (DELETE FROM document_templates WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_emt AS (DELETE FROM email_threads WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_ema AS (DELETE FROM email_accounts WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_exp AS (DELETE FROM expenses WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_files AS (DELETE FROM files WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_ft AS (DELETE FROM form_templates WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_gr AS (DELETE FROM generated_reports WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_int AS (DELETE FROM interests WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_inv AS (DELETE FROM invoices WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_notif AS (DELETE FROM notifications WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_pro AS (DELETE FROM port_role_overrides WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_pu AS (DELETE FROM portal_users WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_rem AS (DELETE FROM reminders WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_rc AS (DELETE FROM residential_clients WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_ri AS (DELETE FROM residential_interests WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_sv AS (DELETE FROM saved_views WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_sr AS (DELETE FROM scheduled_reports WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_ss AS (DELETE FROM system_settings WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_tags AS (DELETE FROM tags WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_unp AS (DELETE FROM user_notification_preferences WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_upr AS (DELETE FROM user_port_roles WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_wh AS (DELETE FROM webhooks WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_yachts AS (DELETE FROM yachts WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_berths AS (DELETE FROM berths WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_clients AS (DELETE FROM clients WHERE port_id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
, del_ports AS (DELETE FROM ports WHERE id IN (SELECT id FROM doomed) RETURNING 1)
|
||||
SELECT 1
|
||||
`);
|
||||
await closeDb();
|
||||
}
|
||||
324
tests/unit/services/documenso-place-fields.test.ts
Normal file
324
tests/unit/services/documenso-place-fields.test.ts
Normal file
@@ -0,0 +1,324 @@
|
||||
/**
|
||||
* Unit tests for the version-aware Documenso placement abstraction.
|
||||
* Covers v1/v2 dispatch, percent→pixel coord conversion for v1, and the pure
|
||||
* default-signature layout math for 1/2/3/5 recipients.
|
||||
*/
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
|
||||
vi.mock('@/lib/services/port-config', () => ({
|
||||
getPortDocumensoConfig: vi.fn(),
|
||||
}));
|
||||
|
||||
import * as portConfig from '@/lib/services/port-config';
|
||||
import {
|
||||
__resetDocumensoCachesForTests,
|
||||
computeDefaultSignatureLayout,
|
||||
placeFields,
|
||||
placeDefaultSignatureFields,
|
||||
voidDocument,
|
||||
} from '@/lib/services/documenso-client';
|
||||
|
||||
const fetchMock = vi.fn();
|
||||
|
||||
beforeEach(() => {
|
||||
vi.stubGlobal('fetch', fetchMock);
|
||||
__resetDocumensoCachesForTests();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
fetchMock.mockReset();
|
||||
vi.unstubAllGlobals();
|
||||
vi.mocked(portConfig.getPortDocumensoConfig).mockReset();
|
||||
});
|
||||
|
||||
function configurePort(version: 'v1' | 'v2'): void {
|
||||
vi.mocked(portConfig.getPortDocumensoConfig).mockResolvedValue({
|
||||
apiUrl: 'https://documenso.test',
|
||||
apiKey: 'sk_test',
|
||||
apiVersion: version,
|
||||
eoiTemplateId: null,
|
||||
defaultPathway: 'documenso-template',
|
||||
});
|
||||
}
|
||||
|
||||
function okResponse(body: unknown = {}): Response {
|
||||
return new Response(JSON.stringify(body), {
|
||||
status: 200,
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
});
|
||||
}
|
||||
|
||||
describe('computeDefaultSignatureLayout', () => {
|
||||
it('returns one centered field for a single recipient', () => {
|
||||
const fields = computeDefaultSignatureLayout([{ id: 1, pageNumber: 3 }]);
|
||||
expect(fields).toHaveLength(1);
|
||||
expect(fields[0]).toMatchObject({
|
||||
recipientId: 1,
|
||||
type: 'SIGNATURE',
|
||||
pageNumber: 3,
|
||||
pageWidth: 20, // 80/1 capped at 20
|
||||
pageHeight: 6,
|
||||
pageY: 88,
|
||||
});
|
||||
expect(fields[0]!.pageX).toBeCloseTo(40, 5); // 50 - 20/2
|
||||
});
|
||||
|
||||
it('staggers two recipients without overlap', () => {
|
||||
const fields = computeDefaultSignatureLayout([
|
||||
{ id: 1, pageNumber: 1 },
|
||||
{ id: 2, pageNumber: 1 },
|
||||
]);
|
||||
expect(fields).toHaveLength(2);
|
||||
expect(fields[1]!.pageX).toBeGreaterThan(fields[0]!.pageX + fields[0]!.pageWidth - 0.001);
|
||||
});
|
||||
|
||||
it('keeps total row width <= 80% for 5 recipients', () => {
|
||||
const fields = computeDefaultSignatureLayout(
|
||||
[1, 2, 3, 4, 5].map((id) => ({ id, pageNumber: 1 })),
|
||||
);
|
||||
const totalWidth = fields[fields.length - 1]!.pageX + fields[0]!.pageWidth - fields[0]!.pageX;
|
||||
expect(totalWidth).toBeLessThanOrEqual(80 + 0.001);
|
||||
expect(fields.every((f) => f.pageX >= 0)).toBe(true);
|
||||
expect(fields.every((f) => f.pageX + f.pageWidth <= 100)).toBe(true);
|
||||
});
|
||||
|
||||
it('returns empty array for zero recipients', () => {
|
||||
expect(computeDefaultSignatureLayout([])).toEqual([]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('placeFields v2 dispatch', () => {
|
||||
beforeEach(() => configurePort('v2'));
|
||||
|
||||
it('makes a single bulk POST to envelope/field/create-many', async () => {
|
||||
fetchMock.mockResolvedValueOnce(okResponse());
|
||||
await placeFields(
|
||||
'env-123',
|
||||
[
|
||||
{
|
||||
recipientId: 'rec-a',
|
||||
type: 'SIGNATURE',
|
||||
pageNumber: 1,
|
||||
pageX: 25,
|
||||
pageY: 88,
|
||||
pageWidth: 20,
|
||||
pageHeight: 6,
|
||||
fieldMeta: { label: 'Sign here' },
|
||||
},
|
||||
],
|
||||
'port-1',
|
||||
);
|
||||
|
||||
expect(fetchMock).toHaveBeenCalledTimes(1);
|
||||
const [url, init] = fetchMock.mock.calls[0]!;
|
||||
expect(url).toBe('https://documenso.test/api/v2/envelope/field/create-many');
|
||||
expect((init as RequestInit).method).toBe('POST');
|
||||
const body = JSON.parse(String((init as RequestInit).body));
|
||||
expect(body.envelopeId).toBe('env-123');
|
||||
expect(body.fields[0]).toMatchObject({
|
||||
recipientId: 'rec-a',
|
||||
type: 'SIGNATURE',
|
||||
positionX: 25,
|
||||
positionY: 88,
|
||||
width: 20,
|
||||
height: 6,
|
||||
fieldMeta: { label: 'Sign here' },
|
||||
});
|
||||
});
|
||||
|
||||
it('throws on non-2xx response', async () => {
|
||||
fetchMock.mockResolvedValueOnce(new Response('boom', { status: 500 }));
|
||||
await expect(
|
||||
placeFields(
|
||||
'env-123',
|
||||
[
|
||||
{
|
||||
recipientId: 'rec-a',
|
||||
type: 'SIGNATURE',
|
||||
pageNumber: 1,
|
||||
pageX: 0,
|
||||
pageY: 0,
|
||||
pageWidth: 10,
|
||||
pageHeight: 10,
|
||||
},
|
||||
],
|
||||
'port-1',
|
||||
),
|
||||
).rejects.toThrow(/v2 placeFields/);
|
||||
});
|
||||
});
|
||||
|
||||
describe('placeFields v1 dispatch', () => {
|
||||
beforeEach(() => configurePort('v1'));
|
||||
|
||||
it('issues one POST per field with pixel coords on a default A4 page', async () => {
|
||||
fetchMock.mockResolvedValue(okResponse());
|
||||
await placeFields(
|
||||
'doc-123',
|
||||
[
|
||||
{
|
||||
recipientId: 42,
|
||||
type: 'SIGNATURE',
|
||||
pageNumber: 1,
|
||||
pageX: 50, // 50% of 595 = 298 (rounded)
|
||||
pageY: 88, // 88% of 842 = 741
|
||||
pageWidth: 20, // 20% of 595 = 119
|
||||
pageHeight: 6, // 6% of 842 = 51
|
||||
},
|
||||
{
|
||||
recipientId: 43,
|
||||
type: 'TEXT',
|
||||
pageNumber: 2,
|
||||
pageX: 10,
|
||||
pageY: 10,
|
||||
pageWidth: 30,
|
||||
pageHeight: 5,
|
||||
},
|
||||
],
|
||||
'port-1',
|
||||
);
|
||||
|
||||
expect(fetchMock).toHaveBeenCalledTimes(2);
|
||||
const firstCall = fetchMock.mock.calls[0]!;
|
||||
expect(firstCall[0]).toBe('https://documenso.test/api/v1/documents/doc-123/fields');
|
||||
const firstBody = JSON.parse(String((firstCall[1] as RequestInit).body));
|
||||
expect(firstBody).toMatchObject({
|
||||
recipientId: 42,
|
||||
type: 'SIGNATURE',
|
||||
pageNumber: 1,
|
||||
});
|
||||
expect(firstBody.pageX).toBe(298);
|
||||
expect(firstBody.pageY).toBe(741);
|
||||
expect(firstBody.pageWidth).toBe(119);
|
||||
expect(firstBody.pageHeight).toBe(51);
|
||||
});
|
||||
|
||||
it('coerces string recipientId to number on v1', async () => {
|
||||
fetchMock.mockResolvedValue(okResponse());
|
||||
await placeFields(
|
||||
'doc-1',
|
||||
[
|
||||
{
|
||||
recipientId: '99',
|
||||
type: 'SIGNATURE',
|
||||
pageNumber: 1,
|
||||
pageX: 0,
|
||||
pageY: 0,
|
||||
pageWidth: 1,
|
||||
pageHeight: 1,
|
||||
},
|
||||
],
|
||||
'port-1',
|
||||
);
|
||||
const body = JSON.parse(String((fetchMock.mock.calls[0]![1] as RequestInit).body));
|
||||
expect(body.recipientId).toBe(99);
|
||||
});
|
||||
|
||||
it('throws on non-2xx response', async () => {
|
||||
fetchMock.mockResolvedValueOnce(new Response('nope', { status: 422 }));
|
||||
await expect(
|
||||
placeFields(
|
||||
'doc-1',
|
||||
[
|
||||
{
|
||||
recipientId: 1,
|
||||
type: 'SIGNATURE',
|
||||
pageNumber: 1,
|
||||
pageX: 0,
|
||||
pageY: 0,
|
||||
pageWidth: 1,
|
||||
pageHeight: 1,
|
||||
},
|
||||
],
|
||||
'port-1',
|
||||
),
|
||||
).rejects.toThrow(/v1 placeField/);
|
||||
});
|
||||
});
|
||||
|
||||
describe('placeDefaultSignatureFields integration', () => {
|
||||
it('places staggered defaults on v2 envelope', async () => {
|
||||
configurePort('v2');
|
||||
fetchMock.mockResolvedValueOnce(okResponse());
|
||||
await placeDefaultSignatureFields(
|
||||
'env-x',
|
||||
[
|
||||
{ id: 'r1', pageNumber: 4 },
|
||||
{ id: 'r2', pageNumber: 4 },
|
||||
{ id: 'r3', pageNumber: 4 },
|
||||
],
|
||||
'port-1',
|
||||
);
|
||||
expect(fetchMock).toHaveBeenCalledTimes(1);
|
||||
const body = JSON.parse(String((fetchMock.mock.calls[0]![1] as RequestInit).body));
|
||||
expect(body.fields).toHaveLength(3);
|
||||
expect(body.fields.every((f: { type: string }) => f.type === 'SIGNATURE')).toBe(true);
|
||||
expect(body.fields.every((f: { pageNumber: number }) => f.pageNumber === 4)).toBe(true);
|
||||
});
|
||||
|
||||
it('skips the API call entirely with zero recipients', async () => {
|
||||
configurePort('v1');
|
||||
await placeDefaultSignatureFields('doc-y', [], 'port-1');
|
||||
expect(fetchMock).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('issues N per-field POSTs with pixel-converted coords on v1', async () => {
|
||||
configurePort('v1');
|
||||
fetchMock.mockResolvedValue(okResponse());
|
||||
await placeDefaultSignatureFields(
|
||||
'doc-z',
|
||||
[
|
||||
{ id: 7, pageNumber: 1 },
|
||||
{ id: 8, pageNumber: 1 },
|
||||
],
|
||||
'port-1',
|
||||
);
|
||||
expect(fetchMock).toHaveBeenCalledTimes(2);
|
||||
for (const call of fetchMock.mock.calls) {
|
||||
expect(call[0]).toBe('https://documenso.test/api/v1/documents/doc-z/fields');
|
||||
const body = JSON.parse(String((call[1] as RequestInit).body));
|
||||
expect(body.type).toBe('SIGNATURE');
|
||||
expect(body.pageNumber).toBe(1);
|
||||
// 88% of 842 = 741 (footer band)
|
||||
expect(body.pageY).toBe(741);
|
||||
// height = 6% of 842 = 51
|
||||
expect(body.pageHeight).toBe(51);
|
||||
// width = 20% of 595 = 119
|
||||
expect(body.pageWidth).toBe(119);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
describe('voidDocument', () => {
|
||||
it('issues DELETE to /api/v1/documents/{id} on v1', async () => {
|
||||
configurePort('v1');
|
||||
fetchMock.mockResolvedValueOnce(new Response(null, { status: 204 }));
|
||||
await voidDocument('doc-1', 'port-1');
|
||||
expect(fetchMock).toHaveBeenCalledWith(
|
||||
'https://documenso.test/api/v1/documents/doc-1',
|
||||
expect.objectContaining({ method: 'DELETE' }),
|
||||
);
|
||||
});
|
||||
|
||||
it('issues DELETE to /api/v2/envelope/{id} on v2', async () => {
|
||||
configurePort('v2');
|
||||
fetchMock.mockResolvedValueOnce(new Response(null, { status: 204 }));
|
||||
await voidDocument('env-1', 'port-1');
|
||||
expect(fetchMock).toHaveBeenCalledWith(
|
||||
'https://documenso.test/api/v2/envelope/env-1',
|
||||
expect.objectContaining({ method: 'DELETE' }),
|
||||
);
|
||||
});
|
||||
|
||||
it('treats 404 as idempotent success', async () => {
|
||||
configurePort('v1');
|
||||
fetchMock.mockResolvedValueOnce(new Response('not found', { status: 404 }));
|
||||
await expect(voidDocument('doc-1', 'port-1')).resolves.toBeUndefined();
|
||||
});
|
||||
|
||||
it('throws on other non-2xx responses', async () => {
|
||||
configurePort('v2');
|
||||
fetchMock.mockResolvedValueOnce(new Response('boom', { status: 500 }));
|
||||
await expect(voidDocument('env-1', 'port-1')).rejects.toThrow(/voidDocument/);
|
||||
});
|
||||
});
|
||||
70
tests/unit/services/document-reminders-cadence.test.ts
Normal file
70
tests/unit/services/document-reminders-cadence.test.ts
Normal file
@@ -0,0 +1,70 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
|
||||
import { isReminderDue } from '@/lib/services/document-reminders';
|
||||
|
||||
const now = new Date('2026-04-28T12:00:00Z');
|
||||
|
||||
function args(overrides: Partial<Parameters<typeof isReminderDue>[0]> = {}) {
|
||||
return {
|
||||
status: 'sent' as const,
|
||||
documensoId: 'doc-1',
|
||||
remindersDisabled: false,
|
||||
reminderCadenceOverride: null,
|
||||
templateCadenceDays: 7,
|
||||
lastReminderAt: null,
|
||||
now,
|
||||
...overrides,
|
||||
};
|
||||
}
|
||||
|
||||
describe('isReminderDue', () => {
|
||||
it('returns true when no prior reminder exists and cadence is set', () => {
|
||||
expect(isReminderDue(args())).toBe(true);
|
||||
});
|
||||
|
||||
it('returns false when document is completed', () => {
|
||||
expect(isReminderDue(args({ status: 'completed' }))).toBe(false);
|
||||
});
|
||||
|
||||
it('returns false when document has no Documenso id', () => {
|
||||
expect(isReminderDue(args({ documensoId: null }))).toBe(false);
|
||||
});
|
||||
|
||||
it('returns false when reminders are disabled per-doc', () => {
|
||||
expect(isReminderDue(args({ remindersDisabled: true }))).toBe(false);
|
||||
});
|
||||
|
||||
it('returns false when neither override nor template cadence is set', () => {
|
||||
expect(isReminderDue(args({ templateCadenceDays: null }))).toBe(false);
|
||||
});
|
||||
|
||||
it('respects per-doc override over template default', () => {
|
||||
// 1-day override, last fired 12h ago → not due
|
||||
const lastReminderAt = new Date(now.getTime() - 12 * 60 * 60 * 1000);
|
||||
expect(
|
||||
isReminderDue(args({ templateCadenceDays: 7, reminderCadenceOverride: 1, lastReminderAt })),
|
||||
).toBe(false);
|
||||
|
||||
// 1-day override, last fired 25h ago → due
|
||||
const earlier = new Date(now.getTime() - 25 * 60 * 60 * 1000);
|
||||
expect(
|
||||
isReminderDue(
|
||||
args({
|
||||
templateCadenceDays: 7,
|
||||
reminderCadenceOverride: 1,
|
||||
lastReminderAt: earlier,
|
||||
}),
|
||||
),
|
||||
).toBe(true);
|
||||
});
|
||||
|
||||
it('treats template cadence as the fallback when no override', () => {
|
||||
// 7-day template, last fired 6 days ago → not due
|
||||
const lastReminderAt = new Date(now.getTime() - 6 * 24 * 60 * 60 * 1000);
|
||||
expect(isReminderDue(args({ lastReminderAt }))).toBe(false);
|
||||
|
||||
// 7 days exactly → due
|
||||
const sevenDays = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
|
||||
expect(isReminderDue(args({ lastReminderAt: sevenDays }))).toBe(true);
|
||||
});
|
||||
});
|
||||
@@ -10,6 +10,7 @@ export default defineConfig({
|
||||
include: ['tests/unit/**/*.test.ts', 'tests/integration/**/*.test.ts'],
|
||||
exclude: ['tests/e2e/**', 'node_modules/**'],
|
||||
pool: 'forks',
|
||||
globalSetup: ['./tests/global-setup.ts'],
|
||||
coverage: {
|
||||
provider: 'v8',
|
||||
reporter: ['text', 'lcov', 'json-summary'],
|
||||
|
||||
Reference in New Issue
Block a user