feat: [BienCulturelClass] Filter by the graph source

src/bienCulturelClass/bienCulturelClass.tsx

@@ -61,6 +61,10 @@ const BienCulturelClass: React.FC<BienCulturelClassProps> = (props) => {
     function toggleSelectedType(type: string): void {
         selectedType === type ? setSelectedType(null) : setSelectedType(type);
     }
+    const [selectedGraph, setSelectedGraph] = React.useState<string | null>(null);
+    function toggleSelectedGraph(graph: string): void {
+        selectedGraph === graph ? setSelectedGraph(null) : setSelectedGraph(graph);
+    }
 
     React.useEffect(() => {
         Promise.all(
@@ -122,15 +126,44 @@ const BienCulturelClass: React.FC<BienCulturelClassProps> = (props) => {
         center = L.latLngBounds(bienCulturelLocations.map(({ location }) => [location.lat, location.lng])).getCenter();
     }
 
+    const allGraphSource: string[] = [];
+    if (bienCulturelInstances !== null) {
+        for (const instance of bienCulturelInstances) {
+            if (instance.graph !== undefined && !allGraphSource.includes(instance.graph)) {
+                allGraphSource.push(instance.graph);
+            }
+        }
+    }
+
     return (
         <>
             <h1>{label}</h1>
             {types !== null ? (
-                types.map((type) => (
-                    <span onClick={() => toggleSelectedType(type)} style={{ cursor: 'pointer' }}>
-                        <URIBadge key={type} uri={type} dataFetcher={dataFetcher} selected={selectedType === type} />
-                    </span>
-                ))
+                <div>
+                    <h3>Filtrer par type alternatif : </h3>
+                    {types.map((type) => (
+                        <span onClick={() => toggleSelectedType(type)} style={{ cursor: 'pointer' }}>
+                            <URIBadge
+                                key={type}
+                                uri={type}
+                                dataFetcher={dataFetcher}
+                                selected={selectedType === type}
+                            />
+                        </span>
+                    ))}
+                </div>
+            ) : (
+                <></>
+            )}
+            {allGraphSource.length > 0 ? (
+                <div>
+                    <h3>Filtrer par source : </h3>
+                    {allGraphSource.map((currentGraph) => (
+                        <span onClick={() => toggleSelectedGraph(currentGraph)} style={{ cursor: 'pointer' }}>
+                            <URIBadge key={currentGraph} uri={currentGraph} selected={selectedGraph === currentGraph} />
+                        </span>
+                    ))}
+                </div>
             ) : (
                 <></>
             )}
@@ -144,6 +177,7 @@ const BienCulturelClass: React.FC<BienCulturelClassProps> = (props) => {
                         .filter(
                             ({ bienCulturel }) => selectedType === null || bienCulturel.typeUris.includes(selectedType)
                         )
+                        .filter(({ bienCulturel }) => selectedGraph === null || bienCulturel.graph === selectedGraph)
                         .map((bienCulturelLocation) => (
                             <Marker
                                 key={bienCulturelLocation.bienCulturel.locationUri}