project-standalo-note-to-app/app/components/AppGallery.tsx

43 lines
1.1 KiB
TypeScript

'use client';
import type { AppGalleryProps } from '@/types/component-props';
import AppCard from './AppCard';
export default function AppGallery({
apps,
isLoading = false,
onSelectApp,
}: AppGalleryProps) {
if (isLoading) {
return (
<div className="flex items-center justify-center py-12">
<div className="w-8 h-8 border-4 border-blue-500 border-t-transparent rounded-full animate-spin" />
<span className="ml-3 text-gray-600">Loading apps...</span>
</div>
);
}
if (apps.length === 0) {
return (
<div className="text-center py-12">
<p className="text-gray-500 text-lg">No apps generated yet</p>
<p className="text-gray-400 text-sm mt-2">
Record a voice note and say "create an app" to generate your first application
</p>
</div>
);
}
return (
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{apps.map((app) => (
<AppCard
key={app.id}
app={app}
onClick={onSelectApp}
/>
))}
</div>
);
}