Sebastian Krüger
28747a6c8f
- Rename ColorPage → ColorManipulation (no AppPage wrapper inside) - Move AppPage + title/description/icon to color/page.tsx, consistent with other tools - AppPage now accepts icon prop directly; removes internal usePathname lookup and 'use client' - All tool pages pass tool.summary as description and tool.icon as icon Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
32 lines
883 B
TypeScript
32 lines
883 B
TypeScript
import * as React from 'react';
|
|
import { cn } from '@/lib/utils';
|
|
|
|
interface AppPageProps {
|
|
title: string;
|
|
description?: string;
|
|
icon?: React.ElementType;
|
|
children: React.ReactNode;
|
|
className?: string;
|
|
}
|
|
|
|
export function AppPage({ title, description, icon: Icon, children, className }: AppPageProps) {
|
|
return (
|
|
<div className={cn("min-h-screen py-8", className)}>
|
|
<div className="max-w-7xl mx-auto px-8 space-y-6 animate-fade-in">
|
|
<div>
|
|
<div className="flex items-center gap-3 mb-1">
|
|
{Icon && <Icon className="h-6 w-6 text-primary shrink-0" />}
|
|
<h1 className="text-2xl font-bold">{title}</h1>
|
|
</div>
|
|
{description && (
|
|
<p className="text-sm text-muted-foreground">
|
|
{description}
|
|
</p>
|
|
)}
|
|
</div>
|
|
{children}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|