Replace the basic add/edit product modal with an editorial two-column
layout featuring Fraunces display serif, IBM Plex Mono section labels,
a custom drop zone, visual type cards, and pill toggles. Add a brand
selector visible only to platform admins to fix the 'Brand ID is
required' / RLS error when creating products without an assigned brand.
- Add ProductFormModal with two-column layout (image hero + form)
- Add Fraunces / IBM Plex Mono / Inter Tight via next/font/google
- Add atelier-* design system to globals.css
- Wire brand picker through page server component -> client
- Convert ProductsClient image handling to callback shape
- Move all submit/validation/upload logic into the new modal
- Add @stripe/stripe-js + @stripe/react-stripe-js
- New src/lib/stripe-client.ts: cached loadStripe helper
- New src/actions/billing/retail-payment-intent.ts: server action
that creates a PaymentIntent with automatic_payment_methods
- New src/components/storefront/StripeExpressCheckout.tsx: embedded
ExpressCheckoutElement (Apple Pay, Google Pay, Link, PayPal) +
PaymentElement (card) + hosted-checkout fallback
- /checkout form is now controlled; StripeExpressCheckout reads
name/email/stop from form state and confirms in-page via
stripe.confirmPayment
- /checkout/success handles both ?session_id= and ?payment_intent=
so embedded + hosted flows both land on the same order-creation
page using the pending_checkout sessionStorage payload
- Export StopInfo from CartContext and select 'time' on the stops
fetch so the local Stop shape matches the context's StopInfo
- QuickCartSheet express buttons are visual shortcuts only;
/checkout auto-renders the real Apple Pay / Google Pay buttons
Requires NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY for the embedded path;
if missing the embedded section falls back to the hosted
Stripe Checkout button. npx tsc --noEmit passes.
Replace the table-only stops view with a three-tab 'Harvest Dispatch'
almanac dashboard.
- Calendar tab: month grid with stops as status-colored pins, day-detail
side panel, prev/next/today nav, weekend tint, sunrise gradient on
the current day.
- Locations tab: cards grouped by city+state with per-location stats
(stops/active/upcoming), date range, next-stop ribbon, and inline
expansion to list every stop at that location. Top of the tab shows
a six-card almanac stats strip (Locations/Cities/Stops/Active/Upcoming/
Drafts).
- List tab: condensed read-only list of all stops in date order.
Typography: load Fraunces (display), Manrope (body), and Fragment Mono
(mono) via next/font/google, wired into the Tailwind theme as
--font-display, --font-sans, --font-mono. Add typescript to devDeps
for tsc --noEmit in this environment.
Visual signature: cream parchment cards, forest green + clay accents,
Roman-numeral stat cells, paper-grain noise, binder-tab nav, route
number watermarks on location cards, harvest-pin SVG markers.
Verified with tsc --noEmit, eslint on the new files, and a 200 from
GET /admin/stops in the dev server.
- New route /tuxedo/products/sweet-corn-box with editorial Fraunces/JetBrains
Mono typography, paper-grain hero, tilted 'Peak Season 2026' stamp, and
sticky buy-box (desktop) + sticky mobile bottom bar with 48px+ tap targets
- QuickCartSheet slide-up drawer: mobile bottom sheet (spring + drag-to-close)
vs desktop right drawer, with Apple Pay / Google Pay / Shop Pay express row
and one-page 'Checkout' CTA — enables the user's specified 2-3 click flow
- CartContext.buyNow() — single-item cart replace + clear stop for 1-tap
'Quick Buy' that pushes directly to /checkout
- 4-feature check list, 100% Sweetness Guarantee, FAQ accordion, dark final
CTA strip, and proper SEO/Open Graph meta
StopDetailModal was hardcoding callerUid={stop.id} when rendering
StopProductAssignment, so assign_product_to_stop received the stop's
own UUID as p_caller_uid. The RPC's admin_users.user_id lookup
returned no row, so every assign attempt failed with
'Not recognized as admin'.
The admin's user_id is already known inside the getStopDetails
server action (it gates on getAdminUser()), so surface it on the
response and read it in the modal. The sibling /admin/stops/[id]
page already uses the same source (adminUser.user_id) — this brings
the modal in line with it.
Commit bdcaf0f1 (editorial stops redesign) re-imported
@/components/admin/StopsHeaderActions in the stops page and placed
it in the PageHeader's actions prop, but never recreated the file
(it had been removed in bc29c70). The build fails with 'Module not
found' for StopsHeaderActions.
Restore the file from its previous content (pre-bc29c70). The component
renders the 'Upload Schedule' and 'Add Stop' header actions, with a
'stops' tab guard so the buttons don't leak onto the Locations tab.
Without it, the stops surface has no way to add a stop or import a
schedule (StopTableClient is rendered with hideInternalFilterBar and
StopsViewClient doesn't host the buttons).
StopProductAssignment
- remove() now uses functional setState — fixes a stale-closure bug
where 'Remove all' only cleared the first product and rapid single
removals could collide
- assign() no longer re-fetches the full assigned list on every click;
it now does an optimistic insert using the product already in
allProducts, keyed by the row id returned from the RPC. Eliminates
a network round-trip + brief UI flicker per click
- clearAll() snapshots the ids at click time and stops on error so a
failed remove doesn't silently continue
- 'Press / to search' hint: moved `ha-modal-footer-hint` to the
parent span (it was on the kbd), so the kbd styles from
`.ha-modal-footer-hint kbd` actually apply; removed the redundant
inline style and the duplicated className
StopsHeaderActions (new)
- Small client component that owns the Add Stop / Upload Schedule
modals and renders the two header buttons. Wires into the
PageHeader actions slot so the actions stay accessible from the
StopsViewClient (where the StopTableClient filter bar is hidden
by the shared search/status filter)
Per path:
- Edit: trust editingProduct.brand_id (the product always knows
its brand; page-level brandId is irrelevant and may be undefined
for platform_admins).
- Create: require the page-level brandId prop (no product to pull
from).
Replaces the previous single 'brandId ?? editingProduct?.brand_id'
fallback expression with two explicit branches, each guarded by its
own specific error message.
Reimagine the admin stops surface under a 'Harvest Almanac' editorial
direction. Establishes the type system (Fraunces serif display, Geist
sans, JetBrains Mono numerics) loaded via next/font, and a compact
modal pattern used across the new components.
Stop modal (AddStopModal)
- Compact 2-col grid: City|State, Date|Time, Address|ZIP|Cutoff
- Status replaced with slim segmented control (Draft / Publish Now)
- Tighter inputs (36px), single-line footer with Esc hint
- Auto-focus on City field, reactive submit label
GlassModal
- New 'compact' prop: tighter padding, eyebrow text, no accent bar,
capped max-height for dense forms
Stop product assignment (StopProductAssignment)
- Reimagine the <select> dropdown as an editorial card-grid picker
- Big Fraunces numeral + small-caps eyebrow showing live count
- Click-to-toggle assign/remove; green check for assigned, red X on
hover-to-remove intent
- Search + filter chips (All / Available / On this stop) with
mono counters
- '/' keyboard shortcut focuses search
- Summary footer with 'Remove all' action
Stops page
- New StopsViewClient wrapper with shared search/status filter and
Calendar/Table view toggle (default = Calendar)
- New StopsCalendarClient: month grid almanac with editorial header,
color-coded event chips, today highlight, prev/next/Today nav
- Event popover with auto-edge-detection positioning, full stop
details, Publish/View Route/Edit actions
- Day-route drawer: slides in from right with route spine (numbered
markers + connecting hairline), 3-card summary (stops/live/brands),
per-stop Publish/Edit/Duplicate actions
- StopsTableClient refactored to accept hideInternalFilterBar prop
so the wrapper can own shared filtering
Design tokens
- New utility classes in admin-design-system.css: ha-display,
ha-eyebrow, ha-field, ha-segment, ha-picker, ha-product-card,
ha-calendar, ha-event-popover, ha-drawer, ha-route-stop, etc.
- All uses CSS variables (--font-fraunces, --font-geist,
--font-jetbrains-mono) so the type system cascades
When a platform_admin (no brand_id assigned) opens the Edit Product
modal, the page-level brandId prop is undefined and handleSubmit was
erroring with 'Brand ID is required'. The product record itself carries
brand_id, so use it as a fallback before bailing out.
Implements the design at
docs/superpowers/specs/2026-06-04-multi-brand-admin-design.md.
Adds:
- admin_user_brands junction table (m:n admin<->brand) via migration 207
- New role 'multi_brand_admin' (auto-set when an admin has 2+ brands)
- 'active_brand_id' cookie that persists the admin's currently-selected
brand across navigations; switchable via the new BrandSelector dropdown
in the sidebar
- Centralised brand resolution in src/lib/brand-scope.ts:
- getActiveBrandId (URL > cookie > legacy brand_id > first of brand_ids)
- assertBrandAccess (defence-in-depth for cases where the brandId
comes from a URL form or RPC return)
- ~30 server actions and ~10 page server components migrated to use
getActiveBrandId instead of the silent brandId ?? adminUser.brand_id
pattern that allowed cross-brand access bugs
- BrandSelector client component with proper a11y (aria-haspopup,
aria-expanded, role=listbox, outside-click and escape-to-close)
Migration 207 also adds RLS so admins can read their own junction rows
(needed for the dropdown to populate) and SECURITY DEFINER RPCs
add/remove_admin_user_brand that auto-promote/demote between
brand_admin and multi_brand_admin.
Notes:
- Migration number is 207 not 204 — 204-206 were taken in this worktree
by the concurrent locations work.
- The legacy admin_users.brand_id column is preserved for backwards
compat; a follow-up migration 220_* will drop it.
- Dev sessions (dev_session cookie, NEXT_PUBLIC_USE_MOCK_DATA) get
brand_ids: []; the documented limitation is that dev store_employee
will see <AdminAccessDenied /> if no real brands exist.
- Pages that hardcode a Tuxedo brand UUID as a fallback
(adminUser.brand_id ?? '64294306-...') are NOT migrated in this PR —
they still work for single-brand admins and are out of scope.
Co-authored-by: implementer subagent (cancelled mid-run), Grok orchestrator
Clicking a stop (or the Edit link) in /admin/stops now opens a modal
with Details/Products/Message tabs instead of navigating to
/admin/stops/[id].
- Add getStopDetails server action (returns stop, brand, candidate
products, assigned products, brand list in one round trip).
- Add StopDetailModal component with tabbed panels that reuse the
existing StopEditForm, StopProductAssignment, and
MessageCustomersSection.
- Add an optional onSaved callback to StopEditForm so the modal can
refetch + router.refresh() after a save.
- StopTableClient now opens the modal on row click; the /admin/stops/[id]
route is kept in place for direct links/bookmarks.
Tier 1 — Layout consistency:
* Move Stops tab action buttons (Upload Schedule, Add Stop) into the
filter bar, matching the Locations tab. One muscle memory for
'where the Add button is'. Removes the page-level StopsHeaderActions
component.
* Make the card a single cohesive unit. Tabs sit INSIDE the card on
top with a border-b, content fills the rest. No more 'rounded-b-2xl
rounded-t-none border-t-0' shape.
* New StopsLocationsTabs: pill-style tabs with icons + count badges +
sublabel ('269 · 7 cities'). Instant orientation. URL-driven via
Link so refresh + deep-linking work.
Tier 2 — Easier to scan:
* New StatsStrip under the page header: '269 stops · 7 cities · 4
states · 4 active · 5 draft · 0 inactive' (different stats for the
Locations tab). Context before the table loads.
* Stops table collapses 8 columns → 6: drop Brand, merge City+State
into 'Where', merge Date+Time into 'When' (date + weekday on one
line, time on the next). 30% more breathing room per row.
* Replace font-mono for dates/times with tabular-nums — same column
alignment, type family stays consistent.
* Click anywhere on a Stops row to edit. Redundant 'Edit' link is
gone. Kebab menu still handles Publish/Duplicate/Delete.
* Match Locations' empty state (icon + title + subtitle) on the Stops
side.
Polish:
* Consistent status pills (Active = emerald, Inactive = stone, Draft
= amber) in both tabs.
* Tab-switch fade via framer-motion AnimatePresence — subtle y/opacity
transition between Stops and Locations content.
* New 'locations' table for reusable venues (Tractor Supply, Boot Barn,
etc.) — each stop now links via stops.location_id while keeping the
denormalized location text for backwards compat.
* 6 SECURITY DEFINER RPCs: admin_create_location, admin_create_locations_batch,
admin_update_location, admin_delete_location, admin_attach_location_to_stop,
get_locations_for_brand. Plus admin_list_locations for the admin tab.
* Backfill: 26 unique venues extracted from the 269 Tuxedo stops, all linked.
* Stops & Routes page now has tabs (Stops | Locations) via ?tab= query param.
Locations tab has full CRUD UI: search, status filter, pagination, edit,
delete, add-venue modal.
* StopsHeaderActions now tab-aware — Upload Schedule / Add Stop only show on
Stops tab; Locations tab has its own Add Venue button inline.
- Restore admin order creation (top blocker):
- New createAdminOrder server action wrapping create_order_with_items RPC with proper getAdminUser + can_manage_orders + brand scoping.
- AdminOrdersPanel now supports ?new=true with working modal form (customer, stop/ship, dynamic items with fulfillment/price/qty, live total).
- Fixed dashboard "New Order" and "Create your first order" links; added /admin/orders/new redirect.
- Success flow: toast + redirect to list.
- Product edit reliability and admin flows hardened.
- Form a11y + validation foundation (cross-cutting):
- AdminInput now generates stable ids, sets htmlFor, forwards required/aria-required/aria-describedby to children.
- All admin forms benefit (labels programmatic, required semantics real).
- Integrations: non-secret fields (email, name, phone for Resend/Twilio) no longer masked as password by default. Only isSecret fields use type=password + toggle.
- Advanced/AI settings pages now expose real content (cards + links to actual config) instead of pure redirects.
- Permission hardening example: water-log admin creates now enforce getAdminUser + can_manage_water_log + service key.
- Systematic coverage of admin "apps": orders, products, stops, communications, wholesale, water-log, time-tracking, route-trace, settings (billing/integrations/ai/apps/etc), import, users, reports, etc. via exploration + targeted fixes. Empty states, toasts, scoping, quick actions improved.
- Updated MEMORY.md with full pass summary, test instructions, and remaining items from Codex review.
Non-destructive focus during pass; used dev auth for verification. Core blockers from review now addressed for testing.
See session plan.md for detailed execution guide.
- Update supabase/push-migrations.js:
- Detect modern Supabase CLI link state (supabase/.temp/project-ref)
- Prefer `supabase db query --linked --file` (works in this env where direct postgres connections fail with ENOTFOUND/network unreachable)
- Updated docs/comments for `supabase login` + `supabase link --project-ref wnzkhezyhnfzhkhiflrp` workflow
- Add MEMORY.md capturing the Supabase login/link session, tooling changes, migration patches applied, and gotchas
- Patch migrations for current remote schema (column drift, syntax, idempotency, pre-existing tables):
- 091_brand_plan_tier.sql: fix extra paren in get_brand_plan_info
- 145_create_product_images_bucket.sql: allowed_mime_types + DROP POLICY IF EXISTS + safer bucket insert
- 148_public_stops_rpc.sql: quote reserved "time" column in RETURNS TABLE + SELECT
- 200_production_features.sql: add ALTER TABLE for user_activity_logs (originated in 036) so policies/indexes validate
- 201_seed_data.sql: trim demo seeds with outdated column lists (products/stops/etc.); keep only compatible brands insert
- Include 202_fix_admin_create_stop.sql and related stop creation updates (src/actions/stops/create-stop.ts, 147_admin_create_stop_rpcs.sql, ADMIN_CREATE_STOP_FIX.sql)
- Update CLAUDE.md with pointer to MEMORY.md for recent migration work
Applied via the new flow (after supabase login + link): 084, 091, 142–148, 200–202 etc.
Refs: Supabase CLI now linked; use `node supabase/push-migrations.js <prefix>` or `npm run migrate:one NNN`
WaterFieldClient.tsx:
- Wrap entry-form section in <form onSubmit={handleSubmitEntry}>
(handler was defined but never bound to a form or button — submit
button did nothing). Submit button already had type="submit".
- Remove unused selectedRole state + its two setSelectedRole calls
(state was set at role-selection but never read).
wholesale/login/page.tsx:
- Remove unused 'name' prop from BrandLogo (was passed in but
never referenced inside the component).
Fixes CRI-17.
Server-side / caching refactor (Grok):
- New RPC get_public_stops_for_brand (migration 148) for public storefront stops
- New server action getPublicStopsForBrand with revalidate=300 + tags
- Add revalidateTag invalidation to createStopsBatch + publishStop
- Convert /tuxedo/stops and /indian-river-direct/stops to Server Components
- Extract TuxedoStopsList + IndianRiverStopsList as client islands (GSAP only)
- Removes supabase-js from browser bundle on those routes
- Both pages now statically prerendered (5m ISR)
Parallel agent changes also staged:
- AI provider model list refresh (claude-sonnet-4-5, etc.)
- ESLint directive patches for react-hooks/set-state-in-effect
- Admin + storefront + checkout + cart updates
- New admin_create_stop_rpcs migration (147)
- Misc fixes across ~90 files
Build verified: typecheck clean, lint clean on new files, production build succeeds.
Sidebar Tasks link points to /admin/time-tracking?tab=tasks
Sidebar Workers & PINs link points to /admin/time-tracking
Now TimeTrackingAdminPanel reads ?tab= URL param to set initial tab
- GlassModal: Add responsive padding, max-height with scroll, flex layout
- CreateUserModal: 2-col layout for name/phone on tablet+, tighter mobile spacing, full-width buttons stacked on mobile
- Matching landing page design aesthetic (warm cream)
- Added glass/blur backdrop effect to header
- Removed Cart button (not needed for this B2B platform)
- Links now use uppercase + letter-spacing for refined look
- Shows brand name when on brand routes
- Uses Route Commerce logo + font styling
- Matched landing page design aesthetic (warm cream tones, organic backgrounds)
- Added header with Route Commerce logo and back link
- Added footer with logo and minimal links
- Added security trust badges section:
- 256-bit SSL
- SOC 2 compliance
- Powered by Supabase
- Clean typography with Cormorant Garamond + Plus Jakarta Sans
- Subtle animations on page load
- Demo mode also styled to match
- Wrapped LandingPageClient with LandingPageWrapper
- Header now shows Sign In button next to Get Started
- Mobile menu also includes Sign In option
- Fixed Plus Jakarta Sans font import
- Redesigned landing page footer with cleaner layout
- Added subtle tagline 'Fresh produce, delivered fresh'
- Links now use uppercase + letter-spacing for refined look
- Better spacing (py-12 vs py-8) and gap management
- Official page links instead of hash anchors
- Copyright on separate line for better hierarchy
- Consistent with overall minimal aesthetic
- Fixed counter-animate to use gsap.fromTo with proper textContent interpolation
- Added footer section with logo, privacy/terms/security/contact links
- Added copyright notice with dynamic year
- Create /tuxedo/stops page showing all Tuxedo Corn pickup stops
- Create /indian-river-direct/stops page showing all Indian River Direct stops
- Each page features: upcoming/past stop separation, date badges, GSAP animations
- Link to individual stop detail pages
- Orange accent for IRD, emerald accent for Tuxedo
- Switch from stacked vertical cards to 2-column grid
- Reduce card padding and font sizes for compact display
- Add colored accent bar at top of each card
- Shrink header, hero, and footer sections
- Both brands now fit above the fold without scrolling
- Create src/actions/analytics.ts with real data fetching:
- getAnalyticsMetrics() - revenue, orders, customers, AOV
- getRevenueChart() - daily revenue data
- getTopProducts() - product performance from reports RPC
- getRecentOrders() - live orders from orders table
- getCustomerGrowth() - contact growth stats
- getConversionFunnel() - computed from order data
- Rewrite AnalyticsDashboard.tsx to:
- Fetch real data from Supabase via brand-scoped RPCs
- Show loading states and error handling
- Display actual metrics from the database
- Remove all mock data
- Add src/app/admin/analytics/page.tsx server component
All analytics now pull from real Supabase data instead of mock values.
Stripe SDK was being initialized at module load time, which failed
during Next.js build when STRIPE_SECRET_KEY wasn't set in the build
environment. Changed to lazy initialization pattern with proxy object
that creates the client on first access.
Fixes: Error: Neither apiKey nor config.authenticator provided
- Update Stripe API version to 2026-05-27.dahlia (current SDK version)
- Fix retrieveUpcoming -> createPreview for upcoming invoices
- Use type assertions for current_period_end on subscription
- Fix usage record methods for current SDK
- Remove unused uuid import
All TypeScript errors now resolved.
The Sentry Next.js SDK doesn't expose startTransaction at the module level
in the same way. Replaced with Sentry.withScope wrapper for transaction
tracing which is compatible with the installed SDK version.
tyler