33 lines
1.1 KiB
TypeScript
33 lines
1.1 KiB
TypeScript
|
import { Loader2 } from 'lucide-react';
|
||
|
|
import { type DashboardService } from '@/types';
|
||
|
|
import { ServiceCard } from './ServiceCard';
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
services: DashboardService[];
|
||
|
|
submitting: boolean;
|
||
|
|
onRequest: (identifier: string) => void;
|
||
|
|
}
|
||
|
|
|
||
|
|
export function ServicesSection({ services, submitting, onRequest }: Props) {
|
||
|
|
return (
|
||
|
|
<div className="flex flex-col gap-4">
|
||
|
|
<h2 className="text-lg font-semibold">Vos services</h2>
|
||
|
|
{submitting && (
|
||
|
|
<div className="flex items-center gap-2 text-sm text-muted-foreground">
|
||
|
|
<Loader2 className="size-4 animate-spin" /> Envoi en cours…
|
||
|
|
</div>
|
||
|
|
)}
|
||
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||
|
|
{services.map((service, index) => (
|
||
|
|
<ServiceCard
|
||
|
|
key={service.identifier}
|
||
|
|
service={service}
|
||
|
|
index={index}
|
||
|
|
onRequest={onRequest}
|
||
|
|
/>
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|