All checks were successful
CI / ci (push) Successful in 13s
Setups now lives alongside My Gear and Planning under /collection?tab=setups instead of its own /setups route. Dashboard card updated to link to the new tab. Setup detail pages (/setups/:id) remain unchanged. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
37 lines
910 B
TypeScript
37 lines
910 B
TypeScript
type TabKey = "gear" | "planning" | "setups";
|
|
|
|
interface CollectionTabsProps {
|
|
active: TabKey;
|
|
onChange: (tab: TabKey) => void;
|
|
}
|
|
|
|
const tabs = [
|
|
{ key: "gear" as const, label: "My Gear" },
|
|
{ key: "planning" as const, label: "Planning" },
|
|
{ key: "setups" as const, label: "Setups" },
|
|
];
|
|
|
|
export function CollectionTabs({ active, onChange }: CollectionTabsProps) {
|
|
return (
|
|
<div className="flex border-b border-gray-200">
|
|
{tabs.map((tab) => (
|
|
<button
|
|
key={tab.key}
|
|
type="button"
|
|
onClick={() => onChange(tab.key)}
|
|
className={`px-4 py-2.5 text-sm font-medium transition-colors relative ${
|
|
active === tab.key
|
|
? "text-gray-700"
|
|
: "text-gray-500 hover:text-gray-700"
|
|
}`}
|
|
>
|
|
{tab.label}
|
|
{active === tab.key && (
|
|
<span className="absolute bottom-0 left-0 right-0 h-0.5 bg-gray-700 rounded-t" />
|
|
)}
|
|
</button>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|