import { useState, useCallback } from 'react'; import { Head } from '@inertiajs/react'; import OLMap from '@/Components/Map/OLMap'; import FilterPanel from '@/Components/Map/FilterPanel'; import FeaturePopup from '@/Components/Map/FeaturePopup'; export interface FeatureParams { famille: 'tous' | 'dossiers' | 'annuaire'; types: string[]; search: string; date_from: string; // ISO YYYY-MM-DD date_to: string; // ISO YYYY-MM-DD eh_min: number; eh_max: number; eh_plus20: boolean; } export interface GeoJSONCollection { type: 'FeatureCollection'; features: Record[]; total: number; } interface SelectedFeature { id: number; famille: 'dossiers' | 'annuaire' | 'spancs' | 'depanneurs'; type: string; } export default function Map() { const [features, setFeatures] = useState(null); const [loading, setLoading] = useState(false); const [selected, setSelected] = useState(null); const handleApply = useCallback(async (params: FeatureParams) => { setLoading(true); setSelected(null); try { const qs = new URLSearchParams(); qs.set('famille', params.famille); qs.set('search', params.search); qs.set('date_from', params.date_from); qs.set('date_to', params.date_to); qs.set('eh_min', String(params.eh_min)); qs.set('eh_max', String(params.eh_max)); qs.set('eh_plus20', params.eh_plus20 ? '1' : '0'); params.types.forEach(t => qs.append('types[]', t)); const res = await fetch(`/api/carte/features?${qs}`); const data = await res.json() as GeoJSONCollection; setFeatures(data); } finally { setLoading(false); } }, []); const handleFeatureClick = useCallback((id: number, famille: 'dossiers' | 'annuaire' | 'spancs' | 'depanneurs', type: string) => { setSelected({ id, famille, type }); }, []); return ( <>

{selected && ( setSelected(null)} /> )}

); }