Commit Graph

199 Commits

Author SHA1 Message Date
4da74d2bd4 feat(members): add /members page for organisation-scoped member management 2026-04-16 22:31:52 +02:00
0ca7c0f20f refactor(members): consolidate Platform Admin + Org members into shared useMembers
- useMembers.ts gains a scope param ('organisation' | 'platform') on list,
  invite, update-role, and remove; endpoints branch accordingly.
- Platform Admin's [id].vue now consumes useMembers via scope='platform';
  deleted the duplicated useInviteOrganisationMember / useRemoveOrganisationMember
  / useUpdateOrganisationMemberRole helpers from useAdmin.ts.
- Deduplicated InviteMemberPayload / UpdateMemberRolePayload / AdminOrganisationMember
  from types/admin.ts; Member is now the canonical type.
- SettingsMembers.vue and EditMemberRoleDialog.vue removed (no remaining imports).
- InviteMemberDialog accepts an optional scope prop and is restricted to the
  two organisation-level roles matching the /members UX.
2026-04-16 22:30:42 +02:00
7695011f4b chore(settings): remove Leden tab from Instellingen sidebar 2026-04-16 22:28:20 +02:00
11924b54bb refactor(nav): promote Leden to top-level menu item 2026-04-16 22:28:04 +02:00
c18323de8e chore(companies): refactor filter row for responsive layout
- Wrap filter row so controls flow to a second line on narrow screens
- Search field now flex-fills available width instead of fixed 300px
- Type select: removed inline label, widened to 240px, prevented
  shrink with flex-shrink-0

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-16 22:12:21 +02:00
8774fff3e9 refactor(settings): move Verzendlog under new Systeem subheader
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-16 22:06:02 +02:00
dac6aa4c30 fix: add password constraint validation to all password-set/change forms
Login forms correctly only check for empty fields (no password
constraints needed). But password-reset, password-set, and
password-change forms now enforce constraints client-side:

- App reset-password: add PasswordRequirements component,
  confirmation mismatch check, canSubmit guard, disabled button
- Portal wachtwoord-resetten: add canSubmit guard, confirmation
  check, disabled button (PasswordRequirements was rendered but
  not enforced)
- App SecurityTab (change password): replace static requirements
  list with interactive PasswordRequirements, add canSubmit guard

Also created PasswordRequirements.vue component for the organizer
app (portal already had one).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 20:58:26 +02:00
824b28897e fix: don't show success on validation error in forgot-password forms
The catch-all error handler (for anti-email-enumeration) was also
swallowing 422 validation errors, making it appear that a reset
email was sent even for empty or invalid input. Now 422 responses
are excluded from the catch — the user stays on the form so the
field-level validation messages remain visible.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 20:53:03 +02:00
e5fdb3efb1 fix: add client-side validation to forgot-password forms
Both the organizer app and portal forgot-password pages now
validate the email field before submission: required + email
format check. Backend already validated this, but empty or
malformed emails were being sent to the API unnecessarily.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 20:51:01 +02:00
b7473a68e1 fix: add client-side validation to portal login form
Add requiredValidator and emailValidator rules to the portal login
form, matching the organizer app login. Empty fields and invalid
email format are now caught before the API call.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 20:47:47 +02:00
b647d2827a fix: compact options layout, consistent ImageUploadField across app
- Replace card-based multi-line options with compact single-line rows
  (grip + label + description + delete all on one row)
- Standardize event registration appearance page on ImageUploadField
  (was VFileInput + manual preview, now consistent with email branding)
- Fix EmailBrandingTab logoUrl ref to properly handle null from
  ImageUploadField, ensuring existing image preview works on page load

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 19:15:03 +02:00
6a8d21a5b6 feat: registration field polish, multi-category tags, file uploads, Partner icon
- Restructure field editor dialog: move Options section to bottom with
  divider and subheader, fix delete button with flex layout
- Change tag_category (single string) to tag_categories (JSON array)
  supporting multiple category selection in tag picker fields
- Portal tag picker now groups tags by category with subheaders
- Add generic file upload endpoint (FileUploadService + UploadController)
- Replace email branding logo URL text field with ImageUploadField
- Update Partner crowd type default icon to tabler-affiliate
- Apply changes consistently to both field and template dialogs

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 18:03:49 +02:00
d57dcdb616 feat: HEADING field type for registration forms — replace section property with structural field
Replace the per-field `section` text property with a dedicated HEADING field type that
organizers add as a separate block for visual grouping. Also fixes duplicate heading bug
on portal radio fields, replaces cramped VBtnToggle with VSelect for field width, and
adds grouped field type dropdown with structure/input categories.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 16:40:41 +02:00
9718e27029 feat: registration form field display_width and option descriptions
Add configurable column widths (full/half) and optional descriptions
for radio/select/checkbox options on registration form fields.

- Migration adds display_width column to both tables
- FieldDisplayWidth enum with smart defaults per field type
- normalized_options accessor for backwards-compatible option format
- Portal form renderer uses display_width for VRow/VCol grid layout
- Radio/select/checkbox options render with descriptions
- Admin field editor supports display_width toggle and description input
- System templates updated with appropriate widths and descriptions

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 07:46:36 +02:00
c4a23b6763 feat: passwordless registration — defer account creation to approval
Removes password from the volunteer registration form. Account
creation is now deferred to the approval step:

Backend:
- Registration creates Person without User (user_id=null)
- On approval, system finds or creates User by person.email
- New accounts get a "set password" email with activation link
- Existing accounts get a portal link email
- Added registration_source column to persons (self/organizer)
- Fuzzy name matching skipped for self-registered persons
- person.email is always source of truth for account linking

Frontend:
- Registration form no longer collects password
- Email check shows info alert with login suggestion
- New wachtwoord-instellen.vue page for account activation
- PasswordRequirements.vue component (reused on reset page)
- Success page updated with activation messaging

Tests: 837 passed (all updated for new flow)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 03:27:47 +02:00
0221e7f6d3 fix: move impersonation banner inside layout content flow
Replace position:fixed VSystemBar + fragile :deep() CSS overrides
with a normal-flow div inside the Vuexy content area. The banner
renders in VerticalNavLayout's default slot (layout-page-content)
so it sits naturally below the navbar without fighting the layout
system. Sidebar and navbar are no longer affected.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 03:17:13 +02:00
dc886fed46 fix: impersonation banner still overlapping navbar
The previous :deep() overrides had equal specificity to Vuexy's
unscoped styles in VerticalNavLayout.vue. Since child component
styles are injected after parent styles, Vuexy's inset-block-start: 0
won by source order. Add !important and simplify the navbar selector
to target .layout-navbar directly.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 03:14:01 +02:00
89645eab60 fix: impersonation banner overlapping sidebar and navbar
The previous paddingTop on a wrapper div didn't affect the Vuexy
layout's fixed-position sidebar or sticky navbar. Replace with
scoped :deep() CSS overrides that shift both elements down 48px
when impersonation is active.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 02:58:27 +02:00
fcab30e5e8 fix: portal shows stale events from localStorage after user_id unlinked
The portal store merged events from the API with localStorage events
without ever pruning stale entries. When /auth/me returned empty
portal_events (e.g. after a person's user_id was cleared), localStorage
events persisted, causing "registratie niet ophalen" when /portal/me
correctly returned 404.

Now when /auth/me succeeds, API data is the source of truth — stored
events not confirmed by the API are dropped. localStorage fallback is
only used when the API call fails (network error).

Also adds an end-to-end test covering the full register → approve →
portal/me flow including festival hierarchy.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 02:54:36 +02:00
67ce1e9d9d fix: impersonation UX — banner contrast, route blocking, nav filtering
- Banner: white elevated button for contrast, fixed 48px height,
  layout top padding offset so content isn't obscured
- Middleware: allow GET me/profile (viewing), block mutations only;
  add auth/refresh to blocked routes
- Navigation: hide Platform section during impersonation; hide
  org-dependent items when impersonated user has no organisation
- Test: add read-only routes allowed test, auth/refresh blocked test

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 02:51:50 +02:00
4df668b5b8 feat: replace token-based impersonation with enterprise-grade header-based system
Replaces the insecure token-in-localStorage approach with a header-based
impersonation system backed by cache sessions and MFA verification.

Key changes:
- New impersonation_sessions audit table (immutable, ULID PK)
- MFA verification required to start impersonation (TOTP/email/backup)
- X-Impersonate-User header + HandleImpersonation middleware
- Per-request auth context swap (admin session never modified)
- IP pinning, sensitive route blocking, no nesting, sliding 60-min TTL
- Activity log auto-tagged with impersonated_by during sessions
- Frontend: sessionStorage, BroadcastChannel sync, countdown timer
- ImpersonateDialog with reason + MFA verification flow
- 26 comprehensive tests covering core, middleware, audit, lifecycle

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 02:42:53 +02:00
47cb6b83d4 refactor: organisation settings — vertical sidebar layout with grouped sections
Replace horizontal tabs with VList-based vertical sidebar following the
Vuexy ecommerce settings pattern. Consolidate Tags, Crowd Types, Members,
and Registration Fields pages into the settings page as sidebar tabs.
Add SettingsGeneral panel with org details form and danger zone.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 02:10:50 +02:00
50e2c31dd9 fix: MFA verify succeeds but user stuck on challenge screen
After successful MFA code verification, onMfaVerified() called
authStore.initialize() which returned immediately (isInitialized
was already true from the initial page load). The auth store was
never populated with user data, so the router guard saw
isAuthenticated === false and redirected back to /login — leaving
the user stuck on the MFA challenge screen with a consumed session.

Fix: use authStore.refreshUser() instead of initialize(). This
always calls GET /auth/me (using the new auth cookie from the MFA
verify response), populates the store, and then navigation to the
dashboard succeeds.

The portal login already uses authStore.fetchUser() which has no
isInitialized guard, so it was not affected.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-16 01:49:01 +02:00
a9c84ee0a6 refactor: password change form layout — current password full width
Moves "Huidig wachtwoord" to a full-width row so "Nieuw wachtwoord"
and "Bevestig nieuw wachtwoord" sit together on the second row.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 22:54:50 +02:00
554ed68e8b refactor: remove redundant cancel button from password change form
The "Annuleren" button served no purpose — there's no prior state to
revert to in a password change form. The fields are already empty on
load and the type="reset" just cleared them to the same empty state.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 22:53:22 +02:00
0cdee1382e refactor: improve MFA section visual hierarchy in SecurityTab
Redesigns the MFA method cards and supporting sections for better
visual hierarchy and professional styling:

Method cards (organizer):
- Vertical layout with large icon (VAvatar 44px) at top
- Description text explaining each method
- Status chip with check icon when configured
- VCardActions with primary chip/button + "Opnieuw instellen"
- Primary method card highlighted with 2px primary border
- Proper h-100 for equal height side-by-side

Backup codes:
- Separate outlined VCard with key icon, progress bar, refresh button
- Cleaner spacing and visual grouping

Disable MFA:
- Replaced heavy danger-zone card with subtle text button
  (tabler-shield-off icon, error color) — less visual weight for a
  rarely-used destructive action

Portal:
- Per-method rows with VAvatar icons and stacked status chips
- Matching text-button style for disable action

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 22:51:54 +02:00
d5fb15e5fe feat: set preferred MFA method from account settings
Adds the ability for users to change their preferred/primary MFA method
when both TOTP and email are available.

Backend:
- Add PUT /auth/mfa/preferred-method endpoint with validation
  (method must be totp/email, MFA must be enabled, TOTP must be
  configured if selecting totp)
- Add totp_configured and email_configured fields to MFA status
  endpoint (totp = has secret + enabled, email = always when enabled)
- Fix setupEmail() to preserve mfa_secret so TOTP config survives
  when email is set up as a second method

Frontend (organizer + portal):
- Add useSetPreferredMethod() composable to useMfa.ts
- Add totp_configured/email_configured to MfaStatus type
- SecurityTab method cards now show "Primaire methode" chip on the
  preferred method and "Als primair instellen" button on the other
- Portal security section shows per-method rows with status chips
  and primary switching

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 22:47:34 +02:00
a77986334c fix: remove duplicate header on organisation crowd-types page
Made-with: Cursor
2026-04-15 22:34:50 +02:00
34cc57ac51 fix: remove duplicate header on organisation tags page
Made-with: Cursor
2026-04-15 22:34:36 +02:00
49f7944e34 feat: show active organisation name as sidebar section title
Made-with: Cursor
2026-04-15 22:33:32 +02:00
9f19c9ed37 feat: move organisation members to sidebar, drop tabs on org page
Made-with: Cursor
2026-04-15 22:31:21 +02:00
c62f377668 fix: MFA setup completion not updating UI state
Root cause: the MFA status endpoint returned `mfa_enabled` as the JSON
key but the TypeScript MfaStatus interface expected `enabled`. At
runtime, `mfaStatus.value?.enabled` was always `undefined`, so
`isEnabled` was always false — the banner never hid and the method
cards never showed "Geconfigureerd".

Additionally, the auth store had no way to re-fetch /auth/me after
initialization, so `mfaSetupRequired` was never properly refreshed
from the backend after MFA setup.

Fixes:
- Rename `mfa_enabled` → `enabled` in the MFA status endpoint response
  to match the TypeScript type (and the /auth/me MeResource which
  already used `enabled`)
- Add `refreshUser()` to the auth store for post-initialization
  re-fetching of /auth/me
- Call `refreshUser()` in onSetupCompleted so the store reflects the
  backend state without a full page reload
- Update backend tests to match the renamed response key

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 22:30:58 +02:00
4e6d5eb4aa feat: move tags and crowd types to sidebar from org settings tabs
Made-with: Cursor
2026-04-15 22:30:12 +02:00
79b7fe0b42 feat: account settings with Vuexy tab pattern and MFA banner fix
Restructures account/profile pages to match Vuexy's account-settings
tab pattern (Account, Security, Notifications) and fixes the MFA
enforcement banner that stayed visible after successful setup.

Backend:
- Add phone column to users table with migration
- Add PUT /me/profile endpoint for profile updates
- Create UpdateProfileRequest form request
- Update MeResource to include phone field

Organizer app:
- Rewrite account-settings as tabbed page (VTabs pill style + VWindow)
- Create AccountTab: avatar, profile form, email change, danger zone
- Create SecurityTab: password change, MFA method cards, backup codes,
  trusted devices, disable MFA danger zone
- Create NotificationsTab: placeholder with disabled toggles
- Fix MFA banner: set authStore.mfaSetupRequired = false on setup complete
- Update router guard to redirect to ?tab=security for MFA enforcement
- Update UserProfile menu links to use tab query params

Portal:
- Restructure profiel.vue with VTabs (Mijn profiel + Beveiliging)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 22:18:16 +02:00
cd2c775692 fix: eliminate all TypeScript any usage across Vue components
Replace 24 `err: any` error handler types with proper `AxiosError<ApiErrorResponse>`
typing. Fix additional `as any` casts and `Record<string, any>` patterns in registration
field components, event settings, and portal layout. Create shared `ApiErrorResponse`
type for portal app.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 21:54:01 +02:00
0be2956ea4 feat: MFA frontend with auth page restyling, challenge screen, and setup wizard
- Restyle organizer auth pages: Dutch text, remove placeholder social login
- Restyle portal auth pages to Vuexy v1 centered card pattern with decorative shapes
- MFA challenge card component with VOtpInput, method tabs, backup code input,
  trusted device checkbox, and session countdown timer
- Login pages handle mfa_required response with device fingerprint header
- Security settings page with TOTP setup (QR code), email setup, disable MFA,
  backup codes regeneration, and trusted devices management
- Portal profile page includes MFA security section
- Admin user detail page shows MFA status with reset button
- MFA enforcement route guard redirects to security settings when required
- Device fingerprint utility for trusted device identification
- MFA types, composables with TanStack Query for both apps

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 21:32:17 +02:00
df68aa8aef feat: email infrastructure frontend — settings, templates, and log tabs
Adds three new tabs to the organisation settings page:

- E-mail opmaak: replaces old EmailBrandingTab to use the new
  organisation_email_settings API (logo, colors, footer, reply-to)
- E-mail templates: list/edit/preview/test/reset all 6 template types
  with variable hints, defaults comparison, and iframe preview
- E-mail log: server-side paginated table with filters (search, status,
  type, date range), status chips, and expandable row details

Supporting files:
- types/email.ts: TypeScript interfaces for settings, templates, logs
- composables/api/useEmail.ts: TanStack Query hooks for all email endpoints

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 20:28:38 +02:00
c64875b6ef feat: align Vuexy primary with demo teal (rgb 13,147,148)
Made-with: Cursor
2026-04-15 19:43:14 +02:00
15be8a09c6 fix: remove duplicate 'Powered by Crewli' footer on registration pages
The portal layout already renders the footer — the inline copies in
[eventSlug].vue and success.vue caused it to appear twice.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 08:52:38 +02:00
28727f246b chore: remove admin SPA and update to two-app production setup
Remove apps/admin/ entirely — platform admin functionality now lives
in apps/app/ under /platform/* routes for super_admin users.

Production URL scheme changed:
- Organizer app: crewli.app (was app.crewli.app)
- Portal: portal.crewli.app (unchanged)
- API: api.crewli.app (unchanged)
- admin.crewli.app and app.crewli.app retired

Backend:
- Removed FRONTEND_ADMIN_URL config and admin cookie (crewli_admin_token)
  from SetAuthCookie, CookieBearerToken, cors.php, app.php
- Updated .env and .env.example (two origins, no port 5173)
- Updated cookie test: admin origin test → unknown origin fallback test

Infrastructure:
- Makefile: removed admin target
- deploy/nginx: updated CSP comment, removed admin vhost
- Updated README.md, CLAUDE.md, and all dev-docs

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 08:44:10 +02:00
2933d957a6 feat: add create organisation button and dialog on platform page
Add "Nieuwe organisatie" button to the platform organisations list page.
Dialog with name field (auto-generates slug) and slug field. Uses the
existing POST /organisations endpoint. On success, navigates to the
new organisation's detail page.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 01:27:40 +02:00
66e4167c03 refactor: identical VDataTable for members on both organisation pages
Both org pages now use the same VDataTable with:
- Search field (name/email filter)
- Sortable columns (Naam, E-mail, Rol) with default sort on name
- Pagination (10 per page)
- Avatar with initials, role chips with color mapping
- Consistent empty state with icon

Platform page: replaced VTable with VDataTable, added role chips
(replacing inline AppSelect), role editing via menu on edit button.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 01:22:01 +02:00
ca275723db fix: use consistent text-body-1 text-disabled for timestamps
Replace custom text-caption span with the standard
<p class="text-body-1 text-disabled mb-0"> pattern used across
all other pages in the codebase.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 01:16:29 +02:00
c7dd6aa59c fix: slug in parentheses, capitalize status, lighter timestamps, rename button
Both organisation pages: slug wrapped in parentheses, billing status
label capitalized, timestamps use text-disabled for lighter appearance,
edit button labeled "Bewerken" consistently.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 01:15:16 +02:00
1629b514e2 fix: unify date formatting and add missing updated_at timestamp
Both organisation pages now use the same date format:
"14 april 2026 om 01:11 uur". Added missing "Gewijzigd op" timestamp
to the organizer organisation page header.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 01:13:22 +02:00
1e5aa3c06b fix: align organisation page header layout with platform design
Match the header structure of /organisation to /platform/organisations/[id]:
wrap name+chip in a flex row with gap-x-2, place timestamp as span
below it inside the same container div.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 01:10:25 +02:00
c1bacb5ee9 refactor: show organisation slug after name in header
Display the organisation slug in small muted text directly after the
organisation name on both the organizer page (/organisation) and the
platform admin detail page (/platform/organisations/[id]).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 01:08:31 +02:00
b69d7c9488 Revert "refactor: show event slug after name in header"
This reverts commit 13ea2304b3.
2026-04-15 01:07:17 +02:00
13ea2304b3 refactor: show event slug after name in header
Display the event slug in small muted text directly after the event
name in the EventTabsNav header.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 01:06:05 +02:00
9923dab0f8 refactor: move KPI cards into Algemeen tab, Danger Zone into own tab
Platform org detail:
- KPI cards (events, users, persons) moved inside Algemeen tab
- Danger Zone moved from below tabs into a dedicated "Danger Zone" tab
  with red-colored tab icon
- Tab bar now shows: Algemeen | Leden | Danger Zone

Platform user detail:
- Added VTabs with Algemeen (profile info) and Organisaties tabs
- Timestamps moved below title as muted caption
- Content reorganised into tab structure matching org detail pattern

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-15 01:04:42 +02:00