tyler
63842a9efc
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
77 lines
2.3 KiB
TypeScript
77 lines
2.3 KiB
TypeScript
import { supabase } from "@/lib/supabase";
|
|
import { getAdminUser } from "@/lib/admin-permissions";
|
|
import { getActiveBrandId } from "@/lib/brand-scope";
|
|
import AdminAccessDenied from "@/components/admin/AdminAccessDenied";
|
|
import ProductsClient from "@/components/admin/ProductsClient";
|
|
|
|
// Icon for page header
|
|
const PackageIcon = () => (
|
|
<svg className="h-6 w-6" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
|
<path d="m7.5 4.27 9 5.15"/>
|
|
<path d="M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16Z"/>
|
|
<path d="m3.3 7 8.7 5 8.7-5"/>
|
|
<path d="M12 22V12"/>
|
|
</svg>
|
|
);
|
|
|
|
export default async function AdminProductsPage() {
|
|
const adminUser = await getAdminUser();
|
|
|
|
if (!adminUser) return <AdminAccessDenied />;
|
|
|
|
if (!adminUser.can_manage_products) {
|
|
return (
|
|
<main className="min-h-screen bg-[var(--admin-bg)] px-4 sm:px-6 md:px-8 py-6 sm:py-8">
|
|
<div className="mx-auto max-w-6xl">
|
|
<h1 className="text-2xl sm:text-3xl font-bold text-red-600">Access Denied</h1>
|
|
<p className="mt-2 text-sm text-stone-500">You do not have permission to manage products.</p>
|
|
</div>
|
|
</main>
|
|
);
|
|
}
|
|
|
|
const activeBrandId = await getActiveBrandId(adminUser);
|
|
const brandId = activeBrandId;
|
|
|
|
let query = supabase
|
|
.from("products")
|
|
.select(`
|
|
id,
|
|
name,
|
|
description,
|
|
price,
|
|
type,
|
|
active,
|
|
deleted_at,
|
|
image_url,
|
|
brand_id,
|
|
is_taxable
|
|
`)
|
|
.is("deleted_at", null)
|
|
.order("name");
|
|
|
|
if (brandId) {
|
|
query = query.eq("brand_id", brandId);
|
|
}
|
|
|
|
const { data: products, error } = await query;
|
|
|
|
if (error) {
|
|
return (
|
|
<main className="min-h-screen bg-[var(--admin-bg)] px-4 sm:px-6 md:px-8 py-6 sm:py-8">
|
|
<div className="mx-auto max-w-6xl">
|
|
<h1 className="text-2xl sm:text-3xl font-bold text-red-600">Error loading products</h1>
|
|
<pre className="mt-4 rounded-xl bg-white border border-[var(--admin-border)] p-4 text-sm text-stone-600">
|
|
{error.message}
|
|
</pre>
|
|
</div>
|
|
</main>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="min-h-screen bg-[var(--admin-bg)]">
|
|
<ProductsClient products={products ?? []} brandId={brandId ?? undefined} />
|
|
</div>
|
|
);
|
|
} |