feat( member dashboard recap & services list)

resources/js/components/features/dashboard/ServicesSection.tsx

@@ -0,0 +1,32 @@
+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>
+    );
+}