DeveloperandClaude Opus 4.8
1c6f98117a
- Create ErrorBoundary class component with GlassCard fallback UI - Update LoadingSkeleton with glass shimmer animation overlay - Update EmptyState with GlassPanel and default Inbox icon - Add ErrorBoundary to shared components index export Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
44 lines
809 B
TypeScript
44 lines
809 B
TypeScript
"use client";
|
|
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface LoadingSkeletonProps {
|
|
count?: number;
|
|
height?: string;
|
|
width?: string;
|
|
columns?: number;
|
|
className?: string;
|
|
}
|
|
|
|
export function LoadingSkeleton({
|
|
count = 4,
|
|
height = "h-24",
|
|
width,
|
|
columns,
|
|
className,
|
|
}: LoadingSkeletonProps) {
|
|
const items = Array.from({ length: count }, (_, i) => (
|
|
<div
|
|
key={i}
|
|
className={cn(
|
|
"glass rounded-[var(--radius-card)] overflow-hidden",
|
|
height,
|
|
width,
|
|
className,
|
|
)}
|
|
>
|
|
<div className="w-full h-full animate-shimmer" />
|
|
</div>
|
|
));
|
|
|
|
if (columns) {
|
|
return (
|
|
<div className={`grid grid-cols-1 md:grid-cols-${columns} gap-3`}>
|
|
{items}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return <div className="space-y-2">{items}</div>;
|
|
}
|