feat(portal): replace magic-link with email/password + admin-initiated activation
All checks were successful
Build & Push Docker Images / lint (pull_request) Successful in 1m0s
Build & Push Docker Images / build-and-push (pull_request) Has been skipped

The client portal no longer uses passwordless / magic-link sign-in. Each
client now has a `portal_users` row with a scrypt-hashed password,
created by an admin from the client detail page; the admin's invite
mails an activation link that the client uses to set their own password.
Forgot-password is wired through the same token mechanism.

Schema (migration `0009_outgoing_rumiko_fujikawa.sql`):

- `portal_users` — one per client account, separate from the CRM
  `users` table (better-auth) so the auth realms stay isolated. Email
  is globally unique, password is null until activation.
- `portal_auth_tokens` — single-use activation / reset tokens. Stores
  only the SHA-256 hash so a DB compromise never leaks live tokens.

Services:

- `src/lib/portal/passwords.ts` — scrypt hash/verify (no new deps;
  uses node:crypto), token mint+hash helpers.
- `src/lib/services/portal-auth.service.ts` — createPortalUser,
  resendActivation, activateAccount, signIn (timing-safe),
  requestPasswordReset, resetPassword. Auth failures throw the new
  UnauthorizedError (401); enumeration-safe behaviour everywhere.

Routes:

- POST /api/portal/auth/sign-in — sets the existing portal JWT cookie.
- POST /api/portal/auth/forgot-password — always 200.
- POST /api/portal/auth/reset-password — token + new password.
- POST /api/portal/auth/activate — token + initial password.
- POST /api/v1/clients/:id/portal-user — admin invite (and `?action=resend`).
- Removed: /api/portal/auth/request, /api/portal/auth/verify (magic link).

UI:

- /portal/login — replaced email-only magic-link form with email +
  password + "forgot password" link.
- /portal/forgot-password, /portal/reset-password, /portal/activate — new.
- New shared `PasswordSetForm` component used by activate + reset.
- New `PortalInviteButton` rendered on the client detail header.

Email send:

- `createTransporter` now wires SMTP auth when SMTP_USER+SMTP_PASS are
  set (gmail app-password or marina-server creds, configured via env).
- `SMTP_FROM` env var lets the sender address be overridden without
  pinning it to `noreply@${SMTP_HOST}`.

Tests:

- Smoke spec 17 (client-portal) updated to the new flow: 7/7 green.
- Smoke specs 02-crud-spine, 05-invoices, 20-critical-path updated to
  match the post-refactor client + invoice forms (drop companyName,
  use OwnerPicker + billingEmail).
- Vitest 652/652 still green; type-check clean.

Drops the dead `requestMagicLink` from portal.service.ts.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Matt Ciaccio
2026-04-26 15:34:02 +02:00
parent 4da8ed3ae4
commit 475b051e29
33 changed files with 10129 additions and 331 deletions

View File

@@ -12,12 +12,14 @@ test.describe('CRUD Spine', () => {
await navigateTo(page, '/clients');
// Click "New Client" button (use first() in case of duplicates in empty state)
await page.getByRole('button', { name: /new client/i }).first().click();
await page
.getByRole('button', { name: /new client/i })
.first()
.click();
await waitForSheet(page);
const sheet = page.locator('[role="dialog"]');
await sheet.locator('input[name="fullName"]').fill(TEST_CLIENT_NAME);
await sheet.locator('input[name="companyName"]').fill('E2E Test Corp');
await sheet.locator('input[name="nationality"]').fill('British');
await sheet.locator('input[name="contacts.0.value"]').fill('e2e@test.com');
@@ -34,7 +36,10 @@ test.describe('CRUD Spine', () => {
await page.waitForTimeout(2000);
// The client name should appear somewhere in the table or page
const hasClient = await page.getByText(TEST_CLIENT_NAME).isVisible({ timeout: 5_000 }).catch(() => false);
const hasClient = await page
.getByText(TEST_CLIENT_NAME)
.isVisible({ timeout: 5_000 })
.catch(() => false);
if (!hasClient) {
// Maybe the table loaded empty and we need to wait for data
await page.waitForTimeout(3000);
@@ -92,7 +97,10 @@ test.describe('CRUD Spine', () => {
await page.waitForTimeout(2000);
// Client should disappear from active list
const stillVisible = await page.getByText(TEST_CLIENT_NAME).isVisible({ timeout: 3_000 }).catch(() => false);
const stillVisible = await page
.getByText(TEST_CLIENT_NAME)
.isVisible({ timeout: 3_000 })
.catch(() => false);
if (!stillVisible) {
console.log(' ✓ Client archived and removed from list');
}

View File

@@ -1,5 +1,5 @@
import { test, expect } from '@playwright/test';
import { login, navigateTo, PORT_SLUG } from './helpers';
import { login, navigateTo, apiHeaders, PORT_SLUG } from './helpers';
test.describe('Invoicing', () => {
test.beforeEach(async ({ page }) => {
@@ -15,18 +15,40 @@ test.describe('Invoicing', () => {
});
test('create a new invoice with 3 line items', async ({ page }) => {
// Seed a client via API to pick in the billing-entity picker.
const clientName = `Invoice Test Client ${Date.now()}`;
const createRes = await page.request.post('/api/v1/clients', {
headers: await apiHeaders(page),
data: {
fullName: clientName,
contacts: [{ channel: 'email', value: 'billing@test.com', isPrimary: true }],
},
});
expect(createRes.ok(), `client create returned ${createRes.status()}`).toBe(true);
await navigateTo(page, '/invoices');
await page.waitForLoadState('networkidle');
// Click "New Invoice" (use first() for strict mode)
const newBtn = page.getByRole('link', { name: /new invoice/i }).first()
const newBtn = page
.getByRole('link', { name: /new invoice/i })
.first()
.or(page.getByRole('button', { name: /new invoice/i }).first());
await newBtn.first().click();
// Step 1: Client Info
await page.waitForURL(`**/${PORT_SLUG}/invoices/new**`, { timeout: 10_000 });
await page.fill('#clientName', 'Invoice Test Client');
// Step 1: pick the client in the OwnerPicker. The trigger renders as a
// button with role="combobox" and the placeholder "Select owner..." while
// empty.
const ownerTrigger = page.locator('button[role="combobox"]:has-text("Select owner")').first();
await expect(ownerTrigger).toBeVisible({ timeout: 5_000 });
await ownerTrigger.click();
const searchInput = page.getByPlaceholder(/search clients/i);
await expect(searchInput).toBeVisible({ timeout: 5_000 });
await searchInput.fill(clientName);
await page.waitForTimeout(500); // let the debounced query fire
await page.getByRole('option', { name: clientName }).first().click();
await page.fill('#billingEmail', 'billing@test.com');
const dueDate = new Date();
@@ -36,7 +58,6 @@ test.describe('Invoicing', () => {
await page.getByRole('button', { name: /next/i }).click();
await page.waitForTimeout(1000);
// Step 2: Line Items — add 3 items
for (let i = 0; i < 3; i++) {
await page.getByRole('button', { name: /add line item/i }).click();
await page.waitForTimeout(300);
@@ -54,21 +75,16 @@ test.describe('Invoicing', () => {
await page.locator('input[name="lineItems.2.quantity"]').fill('4');
await page.locator('input[name="lineItems.2.unitPrice"]').fill('500');
// Verify subtotal appears (53800 formatted per locale)
await expect(page.getByText(/53[,.]?800/).first()).toBeVisible({ timeout: 5_000 });
// Click Next to Review
await page.getByRole('button', { name: /next/i }).click();
await page.waitForTimeout(1000);
await page.getByRole('button', { name: /^next$/i }).click();
const createBtn = page.getByRole('button', { name: /create invoice/i });
await expect(createBtn).toBeVisible({ timeout: 10_000 });
// Step 3: Review — verify summary
await expect(page.getByText('Invoice Test Client')).toBeVisible();
await expect(page.getByText(/53[,.]?800/).first()).toBeVisible();
// Submit
await page.getByRole('button', { name: /create invoice/i }).click();
await createBtn.click();
// Should redirect to invoice detail or list
await page.waitForURL(
(url) => url.pathname.includes('/invoices') && !url.pathname.includes('/new'),
{ timeout: 15_000 },

View File

@@ -2,63 +2,35 @@ import { test, expect } from '@playwright/test';
import { PORT_SLUG } from './helpers';
test.describe('Client Portal', () => {
// Test 34: Portal login page is separate from CRM login
test('portal login page loads at separate URL', async ({ page }) => {
await page.goto('/login');
await page.waitForTimeout(1_000);
// Test 34: Portal login page renders the email + password form.
test('portal login page shows email + password form', async ({ page }) => {
await page.context().clearCookies();
await page.goto('/portal/login');
await page.waitForLoadState('networkidle');
// The portal login should be at a different path
// Try common portal paths
const portalPaths = ['/portal/login', '/login?portal=true'];
let portalFound = false;
for (const path of portalPaths) {
await page.goto(path);
await page.waitForTimeout(1_000);
// Check if we got a portal-specific login page
const portalHeading = page.getByText(/client portal|portal login|access your account/i).first();
if (await portalHeading.isVisible({ timeout: 3_000 }).catch(() => false)) {
portalFound = true;
break;
}
// Check for email-only input (magic link flow)
const emailInput = page.locator('#email, input[type="email"], input[placeholder*="email" i]').first();
const passwordInput = page.locator('#password, input[type="password"]').first();
const hasEmail = await emailInput.isVisible({ timeout: 2_000 }).catch(() => false);
const hasPassword = await passwordInput.isVisible({ timeout: 1_000 }).catch(() => false);
if (hasEmail && !hasPassword) {
// Magic link flow — email only, no password
portalFound = true;
break;
}
}
// Portal page should exist at one of the paths
expect(portalFound).toBeTruthy();
await expect(page.getByText(/client portal/i).first()).toBeVisible({ timeout: 5_000 });
await expect(page.locator('#email')).toBeVisible();
await expect(page.locator('#password')).toBeVisible();
await expect(page.getByRole('button', { name: /^sign in$/i })).toBeVisible();
await expect(page.getByRole('link', { name: /forgot password/i })).toBeVisible();
});
// Test 35: Portal authentication via magic link
test('portal accepts email for magic link', async ({ page }) => {
await page.goto('/portal/login');
await page.waitForTimeout(1_000);
// Test 35: Portal sign-in with bad credentials returns 401.
test('portal sign-in rejects bad credentials with 401', async ({ page }) => {
await page.context().clearCookies();
const res = await page.request.post('/api/portal/auth/sign-in', {
data: { email: 'noone@example.com', password: 'definitelywrong123' },
});
expect(res.status()).toBe(401);
});
const emailInput = page.locator('input[type="email"], input[placeholder*="email" i], #email').first();
if (await emailInput.isVisible({ timeout: 5_000 }).catch(() => false)) {
await emailInput.fill('client@example.com');
const submitBtn = page.getByRole('button', { name: /send|submit|access|login/i }).first();
if (await submitBtn.isVisible({ timeout: 3_000 }).catch(() => false)) {
await submitBtn.click();
await page.waitForTimeout(3_000);
// Should show a "check your email" confirmation
const confirmation = page.getByText(/check your email|link sent|magic link/i).first();
await expect(confirmation).toBeVisible({ timeout: 5_000 });
}
}
// Test 35b: Forgot-password endpoint always returns 200 (anti-enumeration).
test('portal forgot-password returns 200 for any email', async ({ page }) => {
await page.context().clearCookies();
const res = await page.request.post('/api/portal/auth/forgot-password', {
data: { email: 'unknown@example.com' },
});
expect(res.status()).toBe(200);
});
// Test 36: Portal shows client-specific data (simulated via API)
@@ -91,7 +63,10 @@ test.describe('Client Portal', () => {
const url = page.url();
const isOnLogin = url.includes('/login');
const isOnClients = url.includes('/clients');
const hasAuthError = await page.getByText(/authentication required|sign in/i).isVisible({ timeout: 2_000 }).catch(() => false);
const hasAuthError = await page
.getByText(/authentication required|sign in/i)
.isVisible({ timeout: 2_000 })
.catch(() => false);
// If on clients page, it means we still have CRM auth from previous tests — that's expected
// The key point is that portal auth (separate JWT) wouldn't grant CRM access

View File

@@ -39,7 +39,10 @@ test.describe('Critical Path: Client → Interest → Invoice', () => {
await page.waitForTimeout(2_000);
// Retry if data hasn't loaded yet
const hasClient = await page.getByText(TEST_CLIENT_NAME).isVisible({ timeout: 5_000 }).catch(() => false);
const hasClient = await page
.getByText(TEST_CLIENT_NAME)
.isVisible({ timeout: 5_000 })
.catch(() => false);
if (!hasClient) {
await page.waitForTimeout(3_000);
}
@@ -94,7 +97,10 @@ test.describe('Critical Path: Client → Interest → Invoice', () => {
for (let attempt = 0; attempt < 5; attempt++) {
const count = await cmdItems.count();
for (let i = 0; i < count; i++) {
const text = await cmdItems.nth(i).textContent().catch(() => '');
const text = await cmdItems
.nth(i)
.textContent()
.catch(() => '');
if (text && text.includes('Critical Path')) {
await cmdItems.nth(i).click();
selected = true;
@@ -161,7 +167,9 @@ test.describe('Critical Path: Client → Interest → Invoice', () => {
.or(page.getByRole('combobox').first())
.or(page.getByRole('button', { name: /stage|pipeline/i }).first());
const stageSelectorVisible = await stageSelector.isVisible({ timeout: 5_000 }).catch(() => false);
const stageSelectorVisible = await stageSelector
.isVisible({ timeout: 5_000 })
.catch(() => false);
if (stageSelectorVisible) {
await stageSelector.click();
@@ -195,10 +203,18 @@ test.describe('Critical Path: Client → Interest → Invoice', () => {
.or(page.getByRole('button', { name: /new invoice/i }).first());
await newBtn.first().click();
// Step 1: Client Info
await page.waitForURL(`**/${PORT_SLUG}/invoices/new**`, { timeout: 10_000 });
await page.fill('#clientName', TEST_CLIENT_NAME);
// Step 1: pick the previously-created client via the OwnerPicker.
const ownerTrigger = page.locator('button[role="combobox"]:has-text("Select owner")').first();
await expect(ownerTrigger).toBeVisible({ timeout: 5_000 });
await ownerTrigger.click();
const searchInput = page.getByPlaceholder(/search clients/i);
await expect(searchInput).toBeVisible({ timeout: 5_000 });
await searchInput.fill(TEST_CLIENT_NAME);
await page.waitForTimeout(500);
await page.getByRole('option', { name: TEST_CLIENT_NAME }).first().click();
await page.fill('#billingEmail', TEST_CLIENT_EMAIL);
const dueDate = new Date();
@@ -226,14 +242,14 @@ test.describe('Critical Path: Client → Interest → Invoice', () => {
await expect(page.getByText(/52[,.]?000/).first()).toBeVisible({ timeout: 5_000 });
// Step 3: Review
await page.getByRole('button', { name: /next/i }).click();
await page.waitForTimeout(1_000);
await page.getByRole('button', { name: /^next$/i }).click();
const createBtn = page.getByRole('button', { name: /create invoice/i });
await expect(createBtn).toBeVisible({ timeout: 10_000 });
await expect(page.getByText(TEST_CLIENT_NAME)).toBeVisible({ timeout: 5_000 });
await expect(page.getByText(/52[,.]?000/).first()).toBeVisible({ timeout: 5_000 });
// Submit
await page.getByRole('button', { name: /create invoice/i }).click();
await createBtn.click();
// Should redirect away from /invoices/new on success
await page.waitForURL(

View File

@@ -21,10 +21,7 @@ export const USERS = {
* Log in as a specific user via the UI login page.
* Waits for the dashboard to load after successful login.
*/
export async function login(
page: Page,
role: keyof typeof USERS = 'super_admin',
) {
export async function login(page: Page, role: keyof typeof USERS = 'super_admin') {
const user = USERS[role];
await page.goto('/login');
@@ -90,3 +87,40 @@ export async function waitForSheet(page: Page) {
timeout: 5_000,
});
}
/**
* Resolve the port-nimara port ID via API.
*
* Used by tests that drive the JSON API directly with `page.request.*`.
* The server-side `withAuth` helper resolves port context from the
* `X-Port-Id` header (or the user's default-port preference), so any
* direct API call outside a port-scoped URL has to set the header. This
* caches the lookup per page so the lookup happens once.
*/
const portIdCache = new WeakMap<Page, string>();
export async function getPortId(page: Page): Promise<string> {
const cached = portIdCache.get(page);
if (cached) return cached;
const res = await page.request.get('/api/v1/admin/ports');
if (!res.ok()) {
throw new Error(`Failed to resolve port id: ${res.status()} ${await res.text()}`);
}
const body = (await res.json()) as { data?: Array<{ id: string; slug: string }> };
const port = body.data?.find((p) => p.slug === PORT_SLUG);
if (!port) {
throw new Error(`Port ${PORT_SLUG} not in admin ports response`);
}
portIdCache.set(page, port.id);
return port.id;
}
/**
* Build headers for direct JSON-API calls inside tests, including the
* `X-Port-Id` that the auth helper requires.
*/
export async function apiHeaders(page: Page): Promise<Record<string, string>> {
return {
'Content-Type': 'application/json',
'X-Port-Id': await getPortId(page),
};
}