Files
oysqn.app/docs/archive/handoffs/handoff-2026-04-20-home-page.md
Patrick Toal 108c042921 fix(edge-fn): replace getClaims with adminClient.auth.getUser(token)
fix(edge-fn): use user.id instead of claims.sub; fixes 500s and false cert_required
fix(migrations): drop broad reservations SELECT policy; add reservation_slots view with security_invoker=false
fix(tests): correct weekSlot() keys from start/end to start_time/end_time
fix(tests): spread overlap test slots across separate ISO weeks
fix(tests): update e2e assertion to match actual authenticated home text
fix(app): hide IonMenu before user is authenticated
feat(dx): add test:all script running unit, integration, and e2e in sequence
docs(claude-md): document SELinux fix, Edge Function auth pattern, security_invoker behaviour
2026-04-20 14:32:37 -04:00

5.2 KiB

Session Handoff: Home Page Content + E2E Fixes

Date: 2026-04-20 Session Duration: ~1.5 hours Session Focus: Build authenticated home page; fix E2E test issues from prior session Context Usage at Handoff: Low

What Was Accomplished

  1. Playwright E2E: fixed selector issuesIonButton router-link renders as role=link not button; IonInput label not associated via for/id, use getByPlaceholder instead
  2. Playwright E2E: fixed magic link redirectsupabase/config.toml had wrong site_url (127.0.0.1localhost) and missing /auth/callback in additional_redirect_urls; also added server-side redirect follow via fetch(magicLink, { redirect: 'manual' }) to avoid browser connecting to Supabase local port
  3. E2E tests passing: 2/2 — splash→login→magic link→home flow + protected route redirect
  4. Home page builtapp/pages/index.vue — Welcome heading, upcoming reservations card, Create Reservation button, inline PrimeVue DatePicker calendar
  5. WeatherWidget component createdapp/components/WeatherWidget.vue — Open-Meteo (free, no key), shows temp/conditions/wind in knots; 10-minute localStorage cache to avoid API overload
  6. Marina coordinates set: 43.4412629, -79.6696725 (Oakville/Bronte Harbour)
  7. IonSplitPane added to app/app.vue — sidebar open by default on desktop (≥992px); user reverted auto-hide="false" on IonMenuButton in index.vue — desktop sidebar toggle behavior is OPEN

Exact State of Work in Progress

  • Desktop sidebar toggle: IonSplitPane is in app.vue but auto-hide="false" was reverted from index.vue; sidebar opens on desktop but hamburger icon hides — revisit next session if needed
  • /reservations/create route: wired up as router-link on Create Reservation button but page does not exist yet

Decisions Made This Session

  • Open-Meteo for weather BECAUSE free, no API key, client-side CORS allowed, updates every 15 min — STATUS: confirmed
  • 10-minute localStorage cache for weather BECAUSE Open-Meteo updates every 15 min; survives page refresh — STATUS: confirmed
  • Server-side redirect follow for E2E magic link BECAUSE Playwright Chromium headless shell cannot reach 127.0.0.1:54321 (Supabase local auth); Node.js fetch can — STATUS: confirmed

Key Numbers Generated or Discovered This Session

  • Weather cache TTL: 10 minutes (600_000 ms)
  • Open-Meteo wind unit: knots (wind_speed_unit=kn)
  • Marina coordinates: 43.4412629, -79.6696725
  • IonSplitPane desktop breakpoint: lg = 992px (Ionic default)
  • E2E tests: 2/2 passing

Files Created or Modified

File Path Action Description
app/pages/index.vue Modified Full home content: welcome, reservations card, create button, calendar
app/components/WeatherWidget.vue Created Open-Meteo weather card with localStorage cache
app/app.vue Modified Added IonSplitPane wrapping menu + router outlet
supabase/config.toml Modified site_urlhttp://localhost:3000; added /auth/callback to additional_redirect_urls
tests/e2e/auth.spec.ts Modified Fixed selectors; added server-side redirect follow for magic link
docs/summaries/handoff-2026-04-19-playwright-e2e-setup.md Created Prior session handoff (Playwright setup)

What the NEXT Session Should Do

  1. Build app/pages/reservations/create.vue — reservation creation form
    • Fields needed: boat selection, date/time (start + end), reason, passengers (member_ids)
    • Schema ref: app/types/supabase.tsreservations table Insert type
    • On submit: supabase.from('reservations').insert(...) with user_id = user.value.id, default status = 'pending'
    • On success: navigate to / or a reservation detail page
  2. Read app/types/supabase.ts for boats + reservations schema before writing the form
  3. Read app/stores/auth.ts for user ref and member data (member_ids on the reservation)

Open Questions Requiring User Input

  • Desktop hamburger behaviourIonSplitPane is active but user reverted auto-hide="false"; should the hamburger be visible on desktop to allow closing the sidebar, or hidden when sidebar is open? Impacts IonMenuButton props on every page
  • Reservation form: boat selection — should the user pick from all booking_available = true boats, or filtered by their certifications (member.certifications vs boat.required_certs)? Impacts query in create form
  • Reservation form: time selection — free-form time pickers, or constrained to interval_templates? Impacts form UI significantly
  • After reservation created — navigate to reservation detail, home page, or show confirmation inline?

Assumptions That Need Validation

  • ASSUMED: supabase stop && supabase start was run after config.toml change — E2E tests pass so this is confirmed
  • ASSUMED: PrimeVue DatePicker inline renders correctly in Ionic card on mobile — not manually tested in browser since session end

Files to Load Next Session

  • app/types/supabase.ts — boats + reservations schema for form fields
  • app/stores/auth.ts — user/member refs for form submission
  • app/pages/index.vue — reference for page structure pattern