letsbe/pn-new-crm
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(expenses+interests): trip/event grouping (lightweight)

Browse Source 
Per the trips/events design discussion: instead of building a full
events domain (table + CRUD UI + calendar) for the 6–12 yacht shows
a year, ship the cheap version that covers the actual asks.

Expenses — `tripLabel` free-text:
- New `expenses.trip_label` text column (migration 0039) + index for
  filter / autocomplete lookup.
- Validator: createExpenseShape + listExpensesSchema +
  exportExpensePdfSchema.filter all accept tripLabel.
- Service: createExpense + updateExpense persist; listExpenses filters;
  new `listTripLabels(portId, search?)` returns distinct values
  ordered by most-recent expenseDate so the autocomplete surfaces
  recently-used labels first.
- New `GET /api/v1/expenses/trip-labels` endpoint (gated by
  expenses.view) backs the autocomplete.
- Form dialog: native `<datalist>` powered by the autocomplete query
  so reps don't end up with "Palm Beach 2026" / "palm-beach 2026"
  fragmented across two PDF sections.
- Expense list: new "Trip" column (badge) + free-text filter.
- Detail page: trip label rendered alongside Category / Payer.
- PDF export: GroupBy gains 'trip'; filter.tripLabel narrows the
  export. Untagged rows fall under "(no trip)".
- Trim/normalize on write so " Palm Beach 2026 " === "Palm Beach 2026".

Interests — event tagging via existing tag system:
- Reps can tag interests with an event tag (e.g. "Palm Beach 2026")
  via the existing InlineTagEditor on the detail page; tags are
  port-scoped and reusable.
- Interest list now has a TagPicker filter rendered next to the
  FilterBar so reps can sort prospects by event attended ("show me
  every lead from Palm Beach"). Hidden 'relation'-typed
  FilterDefinition for tagIds wires URL round-trip + saved-views
  capture without rendering inside the FilterBar.
- FilterBar deserializer now handles `relation` types as comma-joined
  arrays on URL load.

Why a free-text trip label and not a trips table:
- 6–12 events/year doesn't justify a domain. The CRUD UI cost would
  be most of the engineering, and reps already have the events on
  their personal calendars.
- If usage proves demand for per-event ROI dashboards or richer
  attribution, promote to a real `trips` table later. Migration
  path: trip_label → tripId is a backfill+swap.

Test status: 1168/1168 vitest. tsc clean. Migration 0039 applied
in dev (also caught + fixed an unrelated audit-v3 follow-up: 0037
had `idx_br_interest` colliding with the existing
`berth_recommendations.idx_br_interest`; renamed to
`idx_brr_interest` / `idx_brr_contract_file`).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Matt Ciaccio
2026-05-05 13:46:54 +02:00
parent 687a1f1c2f
commit c4a41d5f5b
17 changed files with 234 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/api/v1/expenses/export/pdf/route.ts
View File

@@ -45,6 +45,7 @@ export const POST = withAuth(
category: input.filter.category ?? null,
paymentStatus: input.filter.paymentStatus ?? null,
payer: input.filter.payer ?? null,
tripLabel: input.filter.tripLabel ?? null,
includeArchived: input.filter.includeArchived ?? false,
}
: undefined,

29
src/app/api/v1/expenses/trip-labels/route.ts Normal file
View File

@@ -0,0 +1,29 @@
import { NextResponse } from 'next/server';
import { withAuth, withPermission } from '@/lib/api/helpers';
import { errorResponse } from '@/lib/errors';
import { listTripLabels } from '@/lib/services/expenses';
/**
* GET /api/v1/expenses/trip-labels?search=palm
*
* Returns the distinct trip-label values used in this port, ordered by
* most-recent expense date. Powers the autocomplete on the expense form
* + the trip filter on the list page so reps don't end up with
* "Palm Beach 2026" vs " palm beach 2026 " split across two groups in
* the PDF export.
*
* Permission: `expenses.view` — same gate as the list endpoint.
*/
export const GET = withAuth(
withPermission('expenses', 'view', async (req, ctx) => {
try {
const url = new URL(req.url);
const search = url.searchParams.get('search') ?? undefined;
const labels = await listTripLabels(ctx.portId, search);
return NextResponse.json({ data: labels });
} catch (error) {
return errorResponse(error);
}
}),
);

16
src/components/expenses/expense-columns.tsx
View File

@@ -28,6 +28,7 @@ export interface ExpenseRow {
payer: string | null;
receiptFileIds: string[] | null;
noReceiptAcknowledged?: boolean;
tripLabel: string | null;
archivedAt: string | null;
createdAt: string;
/** Set by the dedup engine when this expense looks like a duplicate of another. */
@@ -122,6 +123,21 @@ export function getExpenseColumns({
);
},
},
{
id: 'tripLabel',
accessorKey: 'tripLabel',
header: 'Trip',
enableSorting: false,
cell: ({ getValue }) => {
const trip = getValue() as string | null;
if (!trip) return <span className="text-muted-foreground text-xs">-</span>;
return (
<Badge variant="secondary" className="text-xs font-normal">
{trip}
</Badge>
);
},
},
{
id: 'paymentStatus',
accessorKey: 'paymentStatus',

12
src/components/expenses/expense-detail.tsx
View File

@@ -235,6 +235,18 @@ export function ExpenseDetail({ expenseId, onEdit, onArchived }: ExpenseDetailPr
<span className="text-muted-foreground">Payer</span>
<p className="mt-0.5">{expense.payer ?? '-'}</p>
</div>
<div>
<span className="text-muted-foreground">Trip / event</span>
<p className="mt-0.5">
{expense.tripLabel ? (
<Badge variant="secondary" className="text-xs font-normal">
{expense.tripLabel}
</Badge>
) : (
'-'
)}
</p>
</div>
<div>
<span className="text-muted-foreground">Description</span>
<p className="mt-0.5">{expense.description ?? '-'}</p>

6
src/components/expenses/expense-filters.tsx
View File

@@ -45,6 +45,12 @@ export const expenseFilterDefinitions: FilterDefinition[] = [
type: 'text',
placeholder: 'e.g. USD, EUR',
},
{
key: 'tripLabel',
label: 'Trip / event',
type: 'text',
placeholder: 'e.g. Palm Beach 2026',
},
{
key: 'includeArchived',
label: 'Include Archived',

37
src/components/expenses/expense-form-dialog.tsx
View File

@@ -3,7 +3,7 @@
import { useEffect, useRef, useState } from 'react';
import { useForm } from 'react-hook-form';
import { zodResolver } from '@hookform/resolvers/zod';
import { useMutation, useQueryClient } from '@tanstack/react-query';
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
import { AlertTriangle, Loader2, Upload, X } from 'lucide-react';
import { Button } from '@/components/ui/button';
@@ -59,6 +59,16 @@ export function ExpenseFormDialog({ open, onOpenChange, expense }: ExpenseFormDi
},
});
// Distinct trip labels for the port — fed into the datalist so the
// form input doubles as an autocomplete. Cached for the dialog's life
// since the list rarely changes mid-session.
const tripLabelsQuery = useQuery<{ data: string[] }>({
queryKey: ['expenses', 'trip-labels'],
queryFn: () => apiFetch('/api/v1/expenses/trip-labels'),
enabled: open,
staleTime: 60_000,
});
useEffect(() => {
if (open && expense) {
reset({
@@ -70,6 +80,7 @@ export function ExpenseFormDialog({ open, onOpenChange, expense }: ExpenseFormDi
payer: expense.payer ?? undefined,
expenseDate: new Date(expense.expenseDate),
paymentStatus: (expense.paymentStatus as CreateExpenseInput['paymentStatus']) ?? 'unpaid',
tripLabel: expense.tripLabel ?? undefined,
});
setUploadedReceipt(null);
setPreviewUrl(null);
@@ -295,6 +306,30 @@ export function ExpenseFormDialog({ open, onOpenChange, expense }: ExpenseFormDi
</Select>
</div>
<div className="space-y-2">
<Label htmlFor="tripLabel">Trip / event</Label>
<Input
id="tripLabel"
placeholder="e.g. Palm Beach 2026 (optional)"
maxLength={120}
list="expense-trip-label-suggestions"
autoComplete="off"
{...register('tripLabel')}
/>
{/* Native datalist gives the rep prior trip values as
* autocomplete suggestions — keeps spellings consistent
* ("Palm Beach 2026" vs "palm-beach 2026") so the PDF
* group-by-trip section actually merges them. */}
<datalist id="expense-trip-label-suggestions">
{(tripLabelsQuery.data?.data ?? []).map((label) => (
<option key={label} value={label} />
))}
</datalist>
<p className="text-xs text-muted-foreground">
Group expenses by yacht show or business trip. Leave empty for everyday spend.
</p>
</div>
<div className="space-y-2">
<Label htmlFor="description">Description</Label>
<Textarea

8
src/components/interests/interest-filters.tsx
View File

@@ -58,4 +58,12 @@ export const interestFilterDefinitions: FilterDefinition[] = [
label: 'Include Archived',
type: 'boolean',
},
// Rendered OUTSIDE the FilterBar by `<TagPicker>` in interest-list, but
// declared here so URL round-trip + saved-views capture the value.
// `relation` skips the FilterBar's render switch.
{
key: 'tagIds',
label: 'Tags',
type: 'relation',
},
];

14
src/components/interests/interest-list.tsx
View File

@@ -19,6 +19,7 @@ import { PipelineBoard } from '@/components/interests/pipeline-board';
import { interestFilterDefinitions } from '@/components/interests/interest-filters';
import { getInterestColumns, type InterestRow } from '@/components/interests/interest-columns';
import { InterestCard } from '@/components/interests/interest-card';
import { TagPicker } from '@/components/shared/tag-picker';
import { usePaginatedQuery } from '@/hooks/use-paginated-query';
import { useRealtimeInvalidation } from '@/hooks/use-realtime-invalidation';
import { apiFetch } from '@/lib/api/client';
@@ -123,13 +124,24 @@ export function InterestList() {
}
/>
<div className="flex items-center gap-2">
<div className="flex flex-wrap items-center gap-2">
<FilterBar
filters={interestFilterDefinitions}
values={filters}
onChange={setFilter}
onClear={clearFilters}
/>
{/* Tag picker — primary use case is filtering by event/yacht-show
* ("Palm Beach 2026") that the rep tagged interests with at the
* show. The validator already accepts `tagIds` on listInterests;
* this surfaces the input in the filter UI. */}
<div className="min-w-[200px]">
<TagPicker
selectedIds={Array.isArray(filters.tagIds) ? (filters.tagIds as string[]) : []}
onChange={(ids) => setFilter('tagIds', ids)}
placeholder="Filter by tag / event…"
/>
</div>
<SavedViewsDropdown
entityType="interests"
currentFilters={filters}

29
src/components/shared/filter-bar.tsx
View File

@@ -5,11 +5,7 @@ import { X, Filter, ChevronDown } from 'lucide-react';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Badge } from '@/components/ui/badge';
import {
Popover,
PopoverContent,
PopoverTrigger,
} from '@/components/ui/popover';
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
import {
Select,
SelectContent,
@@ -20,13 +16,7 @@ import {
import { Checkbox } from '@/components/ui/checkbox';
import { Label } from '@/components/ui/label';
export type FilterType =
| 'text'
| 'select'
| 'multi-select'
| 'date-range'
| 'boolean'
| 'relation';
export type FilterType = 'text' | 'select' | 'multi-select' | 'date-range' | 'boolean' | 'relation';
export interface FilterOption {
label: string;
@@ -77,7 +67,9 @@ export function deserializeFiltersFromParams(
for (const def of definitions) {
const raw = params.get(def.key);
if (!raw) continue;
if (def.type === 'multi-select') {
if (def.type === 'multi-select' || def.type === 'relation') {
// `relation` types (e.g. tag-pickers rendered outside the FilterBar)
// also serialize as comma-joined arrays so the URL round-trips.
values[def.key] = raw.split(',');
} else if (def.type === 'boolean') {
values[def.key] = raw === 'true';
@@ -148,8 +140,10 @@ export function FilterBar({ filters, values, onChange, onClear }: FilterBarProps
const displayValue = Array.isArray(value)
? `${value.length} selected`
: typeof value === 'boolean'
? value ? 'Yes' : 'No'
: filter.options?.find((o) => o.value === String(value))?.label ?? String(value);
? value
? 'Yes'
: 'No'
: (filter.options?.find((o) => o.value === String(value))?.label ?? String(value));
return (
<Badge key={filter.key} variant="secondary" className="h-7 gap-1 px-2 font-normal">
@@ -194,10 +188,7 @@ function FilterField({
return (
<div className="space-y-1">
<Label className="text-xs">{definition.label}</Label>
<Select
value={(value as string) ?? ''}
onValueChange={(v) => onChange(v || undefined)}
>
<Select value={(value as string) ?? ''} onValueChange={(v) => onChange(v || undefined)}>
<SelectTrigger className="h-8">
<SelectValue placeholder={definition.placeholder ?? 'Any'} />
</SelectTrigger>

6
src/lib/db/migrations/0037_missing_fk_indexes.sql
View File

@@ -3,10 +3,10 @@
-- the child table fully. CREATE INDEX IF NOT EXISTS keeps the migration safe
-- to re-run.
-- berth_reservations
CREATE INDEX IF NOT EXISTS idx_br_interest
-- berth_reservations (idx_br_interest is taken by berth_recommendations)
CREATE INDEX IF NOT EXISTS idx_brr_interest
ON berth_reservations(interest_id);
CREATE INDEX IF NOT EXISTS idx_br_contract_file
CREATE INDEX IF NOT EXISTS idx_brr_contract_file
ON berth_reservations(contract_file_id);
-- documents (file FKs)

12
src/lib/db/migrations/0039_expense_trip_label.sql Normal file
View File

@@ -0,0 +1,12 @@
-- Free-text trip / event label so reps can group expenses by yacht show
-- or business trip (e.g. "Palm Beach 2026"). Un-normalized on purpose —
-- 6–12 events/year doesn't justify a `trips` table + CRUD UI. The
-- autocomplete on the expense form keeps spellings consistent so the
-- group-by works.
ALTER TABLE expenses
ADD COLUMN IF NOT EXISTS trip_label text;
-- Powers the trip filter on the list endpoint + the autocomplete query.
CREATE INDEX IF NOT EXISTS idx_expenses_trip_label
ON expenses(port_id, trip_label);

7
src/lib/db/migrations/meta/_journal.json
View File

@@ -274,6 +274,13 @@
"when": 1778200000000,
"tag": "0038_document_sends_sent_by_user_fk",
"breakpoints": true
},
{
"idx": 39,
"version": "7",
"when": 1778250000000,
"tag": "0039_expense_trip_label",
"breakpoints": true
}
]
}

10
src/lib/db/schema/financial.ts
View File

@@ -49,6 +49,14 @@ export const expenses = pgTable(
paymentDate: date('payment_date'),
paymentReference: text('payment_reference'),
paymentNotes: text('payment_notes'),
/**
* Free-text trip / event label so reps can group expenses for one
* yacht show or business trip (e.g. "Palm Beach 2026"). Deliberately
* un-normalized — events are 6–12/year and full event-management
* functionality lives outside this CRM. The autocomplete on the
* expense form keeps spellings consistent so group-by works.
*/
tripLabel: text('trip_label'),
/** When set, this expense is flagged as a duplicate of another in the
* same port. Self-referencing FK; the dedup service writes this. */
duplicateOf: text('duplicate_of').references((): AnyPgColumn => expenses.id, {
@@ -75,6 +83,8 @@ export const expenses = pgTable(
index('idx_expenses_dedup')
.on(table.portId, table.establishmentName, table.amount, table.expenseDate)
.where(sql`duplicate_of IS NULL`),
// Powers the autocomplete + group-by-trip filter / PDF section.
index('idx_expenses_trip_label').on(table.portId, table.tripLabel),
],
);

7
src/lib/db/schema/reservations.ts
View File

@@ -43,9 +43,10 @@ export const berthReservations = pgTable(
index('idx_br_port').on(table.portId),
// Cover the FKs Postgres doesn't auto-index. Without these, deleting
// (or restrict-checking) the parent interest / contract file row
// requires a full scan of berth_reservations.
index('idx_br_interest').on(table.interestId),
index('idx_br_contract_file').on(table.contractFileId),
// requires a full scan of berth_reservations. (idx_br_interest is
// already used by berth_recommendations — namespace this one.)
index('idx_brr_interest').on(table.interestId),
index('idx_brr_contract_file').on(table.contractFileId),
uniqueIndex('idx_br_active')
.on(table.berthId)
.where(sql`${table.status} = 'active'`),

11
src/lib/services/expense-pdf.service.ts
View File

@@ -47,7 +47,7 @@ import { logger } from '@/lib/logger';
// ─── Public options + result types ──────────────────────────────────────────
export type GroupBy = 'none' | 'payer' | 'category' | 'date';
export type GroupBy = 'none' | 'payer' | 'category' | 'date' | 'trip';
export type PageFormat = 'A4' | 'Letter' | 'Legal';
export type TargetCurrency = 'USD' | 'EUR';
@@ -84,6 +84,7 @@ export interface ExpensePdfArgs {
category?: string | null;
paymentStatus?: string | null;
payer?: string | null;
tripLabel?: string | null;
includeArchived?: boolean;
};
options: ExpensePdfOptions;
@@ -171,6 +172,8 @@ interface ExpenseRow {
* the table + a footnote at the bottom of the summary box. */
noReceiptAcknowledged: boolean;
paymentStatus: string | null;
/** Free-text trip / event label — drives `groupBy=trip` sectioning. */
tripLabel: string | null;
}
interface ProcessedExpense extends ExpenseRow {
@@ -328,6 +331,10 @@ function groupKey(row: ProcessedExpense, by: GroupBy): string {
return row.payer ?? 'Unknown payer';
case 'category':
return row.category ?? 'Uncategorized';
case 'trip':
// Untagged rows go under "(no trip)" so they're still in the
// export, just collected at the bottom.
return row.tripLabel ?? '(no trip)';
case 'date':
return row.expenseDate.toISOString().slice(0, 10);
default:
@@ -388,6 +395,7 @@ async function fetchExpenseRows(args: ExpensePdfArgs): Promise<ExpenseRow[]> {
if (args.filter?.payer) conditions.push(eq(expenses.payer, args.filter.payer));
if (args.filter?.paymentStatus)
conditions.push(eq(expenses.paymentStatus, args.filter.paymentStatus));
if (args.filter?.tripLabel) conditions.push(eq(expenses.tripLabel, args.filter.tripLabel));
}
const rows = await db
@@ -404,6 +412,7 @@ async function fetchExpenseRows(args: ExpensePdfArgs): Promise<ExpenseRow[]> {
description: expenses.description,
receiptFileIds: expenses.receiptFileIds,
noReceiptAcknowledged: expenses.noReceiptAcknowledged,
tripLabel: expenses.tripLabel,
paymentStatus: expenses.paymentStatus,
})
.from(expenses)

49
src/lib/services/expenses.ts
View File

@@ -1,4 +1,4 @@
import { eq, and, gte, lte, sql } from 'drizzle-orm';
import { eq, and, gte, lte, sql, isNull, ilike, isNotNull, desc, ne } from 'drizzle-orm';
import type { PgColumn } from 'drizzle-orm/pg-core';
import { db } from '@/lib/db';
@@ -19,6 +19,46 @@ import type {
export type { ListExpensesInput };
/**
* Trim + collapse whitespace on free-text trip labels so "Palm Beach 2026"
* and " Palm Beach 2026 " end up identical for the group-by + filter.
* Empty / whitespace-only collapses to null.
*/
function normalizeTripLabel(input: string | null | undefined): string | null {
if (input == null) return null;
const trimmed = input.replace(/\s+/g, ' ').trim();
return trimmed.length > 0 ? trimmed : null;
}
/**
* Distinct trip labels used in this port, ordered by most-recent first
* so the autocomplete surfaces "what reps actually used lately" rather
* than alphabetically. Powers the `tripLabel` <Combobox> on the expense
* form. Read-only — no mutation hooks.
*/
export async function listTripLabels(portId: string, search?: string): Promise<string[]> {
const conditions = [
eq(expenses.portId, portId),
isNotNull(expenses.tripLabel),
ne(expenses.tripLabel, ''),
isNull(expenses.archivedAt),
];
if (search && search.trim().length > 0) {
conditions.push(ilike(expenses.tripLabel, `%${search.trim()}%`));
}
const rows = await db
.selectDistinct({
tripLabel: expenses.tripLabel,
latest: sql<Date>`MAX(${expenses.expenseDate})`.as('latest'),
})
.from(expenses)
.where(and(...conditions))
.groupBy(expenses.tripLabel)
.orderBy(desc(sql`MAX(${expenses.expenseDate})`))
.limit(50);
return rows.map((r) => r.tripLabel as string).filter((s): s is string => Boolean(s));
}
export async function listExpenses(portId: string, query: ListExpensesInput) {
const filters = [];
@@ -34,6 +74,9 @@ export async function listExpenses(portId: string, query: ListExpensesInput) {
if (query.payer) {
filters.push(eq(expenses.payer, query.payer));
}
if (query.tripLabel) {
filters.push(eq(expenses.tripLabel, query.tripLabel));
}
if (query.dateFrom) {
filters.push(gte(expenses.expenseDate, new Date(query.dateFrom)));
}
@@ -106,6 +149,7 @@ export async function createExpense(portId: string, data: CreateExpenseInput, me
payer: data.payer,
expenseDate: data.expenseDate,
description: data.description,
tripLabel: normalizeTripLabel(data.tripLabel),
receiptFileIds: data.receiptFileIds ?? [],
noReceiptAcknowledged: data.noReceiptAcknowledged ?? false,
paymentStatus: data.paymentStatus,
@@ -175,6 +219,9 @@ export async function updateExpense(
}
const updateData: Record<string, unknown> = { ...data, updatedAt: new Date() };
if (data.tripLabel !== undefined) {
updateData.tripLabel = normalizeTripLabel(data.tripLabel);
}
// Re-convert to USD if amount or currency changed
const newAmount = data.amount ?? Number(existing.amount);

10
src/lib/validators/expenses.ts
View File

@@ -29,6 +29,12 @@ export const createExpenseShape = z.object({
paymentDate: z.string().optional(),
paymentReference: z.string().optional(),
paymentNotes: z.string().optional(),
/**
* Free-text trip / event label (e.g. "Palm Beach 2026"). Empty / null
* means "no trip". The form's autocomplete suggests prior values per
* port to keep spellings consistent so group-by works downstream.
*/
tripLabel: z.string().max(120).optional(),
});
export const createExpenseSchema = createExpenseShape.refine(
@@ -52,6 +58,7 @@ export const listExpensesSchema = baseListQuerySchema.extend({
dateTo: z.string().optional(),
currency: z.string().optional(),
payer: z.string().optional(),
tripLabel: z.string().optional(),
});
/**
@@ -75,13 +82,14 @@ export const exportExpensePdfSchema = z.object({
category: z.string().optional().nullable(),
paymentStatus: z.string().optional().nullable(),
payer: z.string().optional().nullable(),
tripLabel: z.string().optional().nullable(),
includeArchived: z.boolean().optional(),
})
.optional(),
options: z.object({
documentName: z.string().min(1).max(200),
subheader: z.string().max(300).optional(),
groupBy: z.enum(['none', 'payer', 'category', 'date']).default('none'),
groupBy: z.enum(['none', 'payer', 'category', 'date', 'trip']).default('none'),
includeReceipts: z.boolean().default(false),
includeReceiptContents: z.boolean().default(false),
includeSummary: z.boolean().default(true),