fix(admin): AdminShell brands type must include logo_url (AdminSidebar requires it)

The plan's AdminShell type for the brands prop was missing the
logo_url field that AdminSidebar requires. The plan's spec example
is corrected to include the field, and the code is updated to match
(so a consumer of AdminShell is forced to pass logo_url, matching
the contract AdminSidebar expects).

Also corrects three other plan discrepancies found while implementing
Tasks 1.7-1.12:
- Task 1.12: existing EmptyState.tsx is in active use; reuse it
  instead of creating a duplicate.
- Task 1.12: CardList.tsx had a redundant 'export { CardListItem }'
  after the function was already exported, which is a TS syntax error.
  Removed the redundant line.
- Plan narrative now reflects all three corrections.

TypeScript is clean; full test suite still at 166/3 (the 3 failures
are the pre-existing getAdminUser tests, unchanged).
This commit is contained in:
Tyler
2026-06-17 14:25:16 -06:00
parent 532511e1b5
commit 837f7f83cb
2 changed files with 7 additions and 35 deletions
@@ -910,7 +910,7 @@ interface AdminShellProps {
userRole: string | null;
brandIds?: string[];
activeBrandId?: string | null;
brands: { id: string; name: string; slug: string }[];
brands: { id: string; name: string; slug: string; logo_url: string | null }[];
enabledAddons?: Record<string, boolean>;
children: ReactNode;
}
@@ -1261,10 +1261,11 @@ These are small, focused, presentational. Build them all in one PR by following
**Files:**
- Create: `src/components/admin/PageHeader.tsx`
- Create: `src/components/admin/StatusPill.tsx`
- Create: `src/components/admin/EmptyState.tsx`
- Create: `src/components/admin/CardList.tsx`
- Create: `src/components/admin/StickyActionBar.tsx`
> **Note:** `EmptyState.tsx` already exists in the repo and is in active use by `DashboardClient.tsx` and `ProductsClient.tsx` (re-exported via `design-system/index.tsx`). Reusing that component in the new mobile shell — do not create a duplicate.
- [ ] **Step 1: `PageHeader.tsx`**
```tsx
@@ -1337,34 +1338,7 @@ export function StatusPill({ status, label }: StatusPillProps) {
export default StatusPill;
```
- [ ] **Step 3: `EmptyState.tsx`**
```tsx
// src/components/admin/EmptyState.tsx
import { ReactNode } from "react";
interface EmptyStateProps {
title: string;
description?: string;
action?: ReactNode;
icon?: string;
}
export function EmptyState({ title, description, action, icon = "✨" }: EmptyStateProps) {
return (
<div className="flex flex-col items-center justify-center text-center px-6 py-16">
<div className="text-6xl mb-4" aria-hidden="true">{icon}</div>
<h2 className="text-h1 font-display mb-2" style={{ fontWeight: 600 }}>{title}</h2>
{description && <p className="text-body max-w-md" style={{ color: "var(--color-text-muted)" }}>{description}</p>}
{action && <div className="mt-6">{action}</div>}
</div>
);
}
export default EmptyState;
```
- [ ] **Step 4: `CardList.tsx` + `CardListItem.tsx`**
- [ ] **Step 3: `CardList.tsx` + `CardListItem.tsx`**
```tsx
// src/components/admin/CardList.tsx
@@ -1429,8 +1403,6 @@ export function CardListItem({ onClick, href, children, as = "li" }: CardListIte
}
return <li>{content}</li>;
}
export { CardListItem };
```
- [ ] **Step 5: `StickyActionBar.tsx`**
@@ -1477,8 +1449,8 @@ Expected: PASS.
- [ ] **Step 7: Commit**
```bash
git add src/components/admin/PageHeader.tsx src/components/admin/StatusPill.tsx src/components/admin/EmptyState.tsx src/components/admin/CardList.tsx src/components/admin/StickyActionBar.tsx
git commit -m "feat(admin): add PageHeader, StatusPill, EmptyState, CardList, StickyActionBar"
git add src/components/admin/PageHeader.tsx src/components/admin/StatusPill.tsx src/components/admin/CardList.tsx src/components/admin/StickyActionBar.tsx
git commit -m "feat(admin): add PageHeader, StatusPill, CardList, StickyActionBar"
```
### Task 1.13: Add Lighthouse CI workflow