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:
@@ -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
|
||||
|
||||
@@ -8,7 +8,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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user