diff --git a/src/routes/Liste/Map/ResistantsMap.tsx b/src/routes/Liste/Map/ResistantsMap.tsx index 83106f2..2199c97 100644 --- a/src/routes/Liste/Map/ResistantsMap.tsx +++ b/src/routes/Liste/Map/ResistantsMap.tsx @@ -1,7 +1,7 @@ -import React from "react"; -import Map, { Marker, NavigationControl, Popup } from "react-map-gl"; import maplibregl from "maplibre-gl"; import "maplibre-gl/dist/maplibre-gl.css"; +import React from "react"; +import Map, { Marker, NavigationControl, Popup } from "react-map-gl"; import { Resistant } from "../../../Resistant"; import { Picto } from "./Picto"; import { PopupContent } from "./PopupContent"; @@ -12,7 +12,7 @@ interface Props { const accessToken = "LiH20XNxcFiTXyT4fgjM"; -export const ResistantsMap = ({ resistants }: Props) => { +export default ({ resistants }: Props) => { const [selectedResistant, selectResistant] = React.useState( null ); diff --git a/src/routes/Liste/index.tsx b/src/routes/Liste/index.tsx index 6e665ea..f1ff9d2 100644 --- a/src/routes/Liste/index.tsx +++ b/src/routes/Liste/index.tsx @@ -1,23 +1,28 @@ -import React from "react"; -import { Outlet } from "react-router"; -import { Center, Group, SegmentedControl, TextInput } from "@mantine/core"; +import { + Center, + Group, + Loader, + SegmentedControl, + TextInput, +} from "@mantine/core"; import { IconCameraSelfie, IconList, IconMap, IconUsers, } from "@tabler/icons-react"; +import React, { Suspense, lazy } from "react"; +import { Outlet } from "react-router"; +import { resistantsOrder } from "../../Resistant"; import { Separator } from "../../components/Separator"; import { DisplayModeContext } from "../../context/DisplayModeContext"; +import { HomeContext } from "../../context/HomeContext"; import { resistants } from "../../resistants"; import { ViewMode } from "../ViewMode"; import { FiltreAcademie } from "./FiltreAcademie"; -import { ResistantsMap } from "./Map/ResistantsMap"; -import { ResistantsThumbs } from "./Thumbs/ResistantsThumbs"; import { FiltreDepartement } from "./FiltreDepartement"; import { ResistantRow } from "./List/ResistantRow"; -import { HomeContext } from "../../context/HomeContext"; -import { resistantsOrder } from "../../Resistant"; +import { ResistantsThumbs } from "./Thumbs/ResistantsThumbs"; const normalize = (text: string) => (text || "") @@ -25,6 +30,8 @@ const normalize = (text: string) => .normalize("NFD") .replace(/\p{Diacritic}/gu, ""); +const LazyResistantsMap = lazy(() => import("./Map/ResistantsMap")); + export const ListeResistants = () => { const { mode, setMode } = React.useContext(DisplayModeContext); const { isHome } = React.useContext(HomeContext); @@ -118,8 +125,13 @@ export const ListeResistants = () => { )} - {mode === "map" && } - + {mode === "map" && ( + } + > + + + )}