feat: remove list on home, and always open resistant in resistant page
Also: use resistant.id in path instead of name chande resistant ids to first namesproto-module-actu-react
parent
ef5ba738cb
commit
3db267acef
|
@ -2,6 +2,7 @@ import React from "react";
|
|||
import { RouterProvider } from "react-router-dom";
|
||||
import { ViewMode } from "./routes/ViewMode";
|
||||
import { DisplayModeContext } from "./context/DisplayModeContext";
|
||||
import { HomeContext } from "./context/HomeContext";
|
||||
import { router } from "./router";
|
||||
import "mapbox-gl/dist/mapbox-gl.css";
|
||||
import "./style/SquareSpace/vars.css";
|
||||
|
@ -16,16 +17,19 @@ import "./declarations";
|
|||
|
||||
interface Props {
|
||||
defaultViewMode: ViewMode;
|
||||
home: boolean;
|
||||
}
|
||||
|
||||
export const App = ({ defaultViewMode }: Props) => {
|
||||
export const App = ({ defaultViewMode, home }: Props) => {
|
||||
const [viewMode, setViewMode] = React.useState<ViewMode>(defaultViewMode);
|
||||
|
||||
return (
|
||||
<DisplayModeContext.Provider
|
||||
value={{ mode: viewMode, setMode: setViewMode }}
|
||||
>
|
||||
<HomeContext.Provider value={{ isHome: home, setMode: () => {} }}>
|
||||
<RouterProvider router={router} />
|
||||
</HomeContext.Provider>
|
||||
</DisplayModeContext.Provider>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -0,0 +1,13 @@
|
|||
import React from "react";
|
||||
|
||||
const defaultValue: HomeContextType = {
|
||||
isHome: false,
|
||||
setMode: () => {},
|
||||
};
|
||||
|
||||
interface HomeContextType {
|
||||
isHome: boolean;
|
||||
setMode: (isHome: boolean) => void;
|
||||
}
|
||||
|
||||
export const HomeContext = React.createContext<HomeContextType>(defaultValue);
|
|
@ -0,0 +1,4 @@
|
|||
import { Resistant } from "./Resistant";
|
||||
|
||||
export const getResistantPageUrl = (resistant: Resistant) =>
|
||||
`https://www.enfance-libre.fr/#/${resistant.id}`;
|
12
src/main.tsx
12
src/main.tsx
|
@ -3,20 +3,20 @@ import ReactDOM from "react-dom/client";
|
|||
import { App } from "./App";
|
||||
import { ViewMode } from "./routes/ViewMode";
|
||||
|
||||
const renderResistants = (defaultViewMode: ViewMode) => {
|
||||
const renderResistants = (defaultViewMode: ViewMode, isHome: boolean) => {
|
||||
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
|
||||
<React.StrictMode>
|
||||
<App defaultViewMode={defaultViewMode} />
|
||||
<App defaultViewMode={defaultViewMode} home={isHome} />
|
||||
</React.StrictMode>
|
||||
);
|
||||
};
|
||||
|
||||
const render = () => {
|
||||
const defaultViewMode: ViewMode = location.href.includes("resistants")
|
||||
? "photos"
|
||||
: "map";
|
||||
const isOnPageResistants = location.href.includes("resistants");
|
||||
const defaultViewMode: ViewMode = isOnPageResistants ? "photos" : "map";
|
||||
const isHome = !isOnPageResistants;
|
||||
|
||||
renderResistants(defaultViewMode);
|
||||
renderResistants(defaultViewMode, isHome);
|
||||
};
|
||||
|
||||
if ("Squarespace" in window) {
|
||||
|
|
|
@ -3,7 +3,7 @@ import { getResistantDeclarationUrl } from "./getResistantDeclarationUrl";
|
|||
|
||||
export const resistants: Resistant[] = [
|
||||
{
|
||||
id: "farhangi-bautista",
|
||||
id: "ramin-marjorie",
|
||||
noms: "Ramïn Farhangi et Marjorie Bautista",
|
||||
enfants: "Zeÿa",
|
||||
departement: "Ariège",
|
||||
|
@ -19,7 +19,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 1.40833,
|
||||
},
|
||||
{
|
||||
id: "attias-perez",
|
||||
id: "jonathan-caroline",
|
||||
noms: "Jonathan Attias et Caroline Perez",
|
||||
enfants: "Lia et Mani",
|
||||
departement: "Haute-Vienne",
|
||||
|
@ -35,7 +35,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 0.79877,
|
||||
},
|
||||
{
|
||||
id: "taveneau-blondeau",
|
||||
id: "amelie-vincent",
|
||||
noms: "Amélie Taveneau et Vincent Blondeau",
|
||||
enfants: "Simon",
|
||||
departement: "Maine-et-Loire",
|
||||
|
@ -51,7 +51,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: -0.67314,
|
||||
},
|
||||
{
|
||||
id: "vuillaume",
|
||||
id: "marlene-benjamin",
|
||||
noms: "Marlène et Benjamin Vuillaume",
|
||||
enfants: "cinq enfants",
|
||||
departement: "Meurthe et Moselle",
|
||||
|
@ -66,7 +66,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 6.06438,
|
||||
},
|
||||
{
|
||||
id: "delhommeau",
|
||||
id: "audreyanne-michael",
|
||||
noms: "Audrey-Anne et Michaël Delhommeau",
|
||||
enfants: "Inessa et Gatien",
|
||||
departement: "Loire-Atlantique",
|
||||
|
@ -82,7 +82,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: -1.43546,
|
||||
},
|
||||
{
|
||||
id: "renaudeau",
|
||||
id: "david-coralie",
|
||||
noms: "David et Coralie Renaudeau",
|
||||
enfants: "Lilou, Noa et Soan",
|
||||
departement: "Deux-Sèvres",
|
||||
|
@ -98,7 +98,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: -0.74299,
|
||||
},
|
||||
{
|
||||
id: "chatelain",
|
||||
id: "myriam-timothee",
|
||||
noms: "Myriam et Timothée Chatelain",
|
||||
enfants: "Sam et Mayan",
|
||||
departement: "Haute-Savoie",
|
||||
|
@ -113,7 +113,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 5.93189,
|
||||
},
|
||||
{
|
||||
id: "fremeaux",
|
||||
id: "helene-f",
|
||||
noms: "Hélène Frémeaux",
|
||||
enfants: "Liyah et Ylann",
|
||||
departement: "Seine-et-Marne",
|
||||
|
@ -129,7 +129,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 2.59012,
|
||||
},
|
||||
{
|
||||
id: "delquie",
|
||||
id: "sarah-jerome",
|
||||
noms: "Sarah Piquart Delquié et Jérôme Delquié",
|
||||
enfants: "Elouan et Liam",
|
||||
departement: "Aude",
|
||||
|
@ -145,7 +145,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 2.39191,
|
||||
},
|
||||
{
|
||||
id: "godart",
|
||||
id: "florence-alexis",
|
||||
noms: "Florence et Alexis Godart",
|
||||
enfants: "Alissa et de Mélina",
|
||||
departement: "Ille-et-Vilaine",
|
||||
|
@ -161,7 +161,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: -2.06637,
|
||||
},
|
||||
{
|
||||
id: "gondange",
|
||||
id: "roseline-jonathan",
|
||||
noms: "Roseline et Jonathan Gondange",
|
||||
enfants: "Hanaé, Éline, Nael et Timoté",
|
||||
departement: "Vaucluse",
|
||||
|
@ -176,7 +176,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 5.242,
|
||||
},
|
||||
{
|
||||
id: "chapleau-lacot",
|
||||
id: "emmanuelle-philippe",
|
||||
noms: "Emmanuelle Chapleau et Philippe Lacot",
|
||||
enfants: "Salma, Soren, Ezra et Romy",
|
||||
departement: "Puy-de-Dôme",
|
||||
|
@ -192,7 +192,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 2.7651,
|
||||
},
|
||||
{
|
||||
id: "bargibant",
|
||||
id: "sita-pascal",
|
||||
noms: "Sita et Pascal Bargibant",
|
||||
enfants: "Aluna et Liara",
|
||||
departement: "Morbihan",
|
||||
|
@ -208,7 +208,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: -3.16379,
|
||||
},
|
||||
{
|
||||
id: "vannier",
|
||||
id: "mathilde-cyril",
|
||||
noms: "Mathilde et Cyril Vannier",
|
||||
enfants: "Naïs, Ëvy et Saël",
|
||||
departement: "Ille-et-Vilaine",
|
||||
|
@ -223,7 +223,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: -1.90139,
|
||||
},
|
||||
{
|
||||
id: "couge",
|
||||
id: "sylvaine-olivier",
|
||||
noms: "Sylvaine et Olivier Cougé",
|
||||
enfants: "Tanaë, Côme et Lune",
|
||||
departement: "Vendée",
|
||||
|
@ -239,7 +239,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: -1.57619,
|
||||
},
|
||||
{
|
||||
id: "reboutier",
|
||||
id: "julie-jeanchristophe",
|
||||
noms: "Julie et Jean-Christophe Reboutier",
|
||||
enfants: "Mona, Ewenn et Lukaz",
|
||||
departement: "Morbihan",
|
||||
|
@ -255,7 +255,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: -3.07123,
|
||||
},
|
||||
{
|
||||
id: "cramer-gaudillere",
|
||||
id: "marianne-denis",
|
||||
noms: "Marianne Cramer et Denis Gaudillère",
|
||||
enfants: "Amy et Nathan",
|
||||
departement: "Tarn",
|
||||
|
@ -271,7 +271,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 2.31513,
|
||||
},
|
||||
{
|
||||
id: "catalifaud-bouchet",
|
||||
id: "mathilde-dorian",
|
||||
noms: "Mathilde Catalifaud et Dorian Bouchet",
|
||||
enfants: "Owen, Livia et Mira",
|
||||
departement: "Lot",
|
||||
|
@ -287,7 +287,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 2.10137,
|
||||
},
|
||||
{
|
||||
id: "arfaoui",
|
||||
id: "karene-jalil",
|
||||
noms: "Karène et Jalil Arfaoui",
|
||||
enfants: "Jade et Nora",
|
||||
departement: "Tarn",
|
||||
|
@ -303,7 +303,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 2.14432,
|
||||
},
|
||||
{
|
||||
id: "verrier-duchesne",
|
||||
id: "nicolas-elodie",
|
||||
noms: "Nicolas Verrier et Elodie Duchesne",
|
||||
enfants: "Rayan, Maylie et Aaron",
|
||||
departement: "Haute Garonne",
|
||||
|
@ -319,7 +319,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 0.64606,
|
||||
},
|
||||
{
|
||||
id: "poiroux",
|
||||
id: "jerome-gwenaelle",
|
||||
noms: "Jérôme et Gwénaëlle Poiroux",
|
||||
enfants: "Manon, Océane et Chloé",
|
||||
departement: "Aveyron",
|
||||
|
@ -335,7 +335,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 2.39564,
|
||||
},
|
||||
{
|
||||
id: "sibert",
|
||||
id: "isabelle-nicolas",
|
||||
noms: "Isabelle et Nicolas Sibert",
|
||||
enfants: "Pauline, Flora, Jérémie et Athina",
|
||||
departement: "Creuse",
|
||||
|
@ -351,7 +351,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 1.98893,
|
||||
},
|
||||
{
|
||||
id: "drulhe",
|
||||
id: "helene-d",
|
||||
noms: "Hélène Drulhe",
|
||||
enfants: "Kin Rosalie",
|
||||
departement: "Aveyron",
|
||||
|
@ -367,7 +367,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 2.53359,
|
||||
},
|
||||
{
|
||||
id: "muller",
|
||||
id: "deborah-florian",
|
||||
noms: "Déborah et Florian Muller",
|
||||
enfants: "Zoé, Zendé, et Zora",
|
||||
departement: "Ardèche",
|
||||
|
@ -383,7 +383,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 4.60679,
|
||||
},
|
||||
{
|
||||
id: "singeot-bouvet",
|
||||
id: "ophelie-sylvain",
|
||||
noms: "Ophélie Singeot et Sylvain Bouvet",
|
||||
enfants: "Enakiel, Aïnoura et Yoéli",
|
||||
departement: "Aveyron",
|
||||
|
@ -399,7 +399,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 2.7699,
|
||||
},
|
||||
{
|
||||
id: "cremers-blanpain",
|
||||
id: "marina-frederic",
|
||||
noms: "Marina Cremers et Frederic Blanpain",
|
||||
enfants: "Léo-Pol, Joa-Louca, Lili-Rose, Luna-Violette et Emilien",
|
||||
departement: "Creuse",
|
||||
|
@ -415,7 +415,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 2.33353,
|
||||
},
|
||||
{
|
||||
id: "herbiet",
|
||||
id: "sonia-jeanchristophe",
|
||||
noms: "Sonia et Jean-Christophe Herbiet",
|
||||
enfants: "Uwe, Keza et Aïna",
|
||||
departement: "Meurthe et Moselle",
|
||||
|
@ -431,7 +431,7 @@ export const resistants: Resistant[] = [
|
|||
longitude: 6.19711,
|
||||
},
|
||||
{
|
||||
id: "lourenco-porcel",
|
||||
id: "alexandre-julie",
|
||||
noms: "Alexandre Lourenço et Julie Porcel",
|
||||
enfants: "Ulyssandra",
|
||||
departement: "Landes",
|
||||
|
|
|
@ -16,7 +16,7 @@ export const router = createHashRouter([
|
|||
element: <ListeResistants />,
|
||||
},
|
||||
{
|
||||
path: ":nomResistant",
|
||||
path: ":idResistant",
|
||||
element: <PageResistant />,
|
||||
},
|
||||
],
|
||||
|
|
|
@ -14,7 +14,7 @@ export const ResistantRow = ({ resistant }: Props) => {
|
|||
<>
|
||||
<div
|
||||
className="row sqs-row resistant-row"
|
||||
onClick={() => navigate(resistant.noms)}
|
||||
onClick={() => navigate(resistant.id)}
|
||||
>
|
||||
<div
|
||||
className="col sqs-col-4 span-4"
|
||||
|
|
|
@ -2,14 +2,19 @@ import React from "react";
|
|||
import { useNavigate } from "react-router";
|
||||
import { Resistant } from "../../../Resistant";
|
||||
import { getResistantPhotoUrl } from "../../../getResistantPhotoUrl";
|
||||
import { HomeContext } from "../../../context/HomeContext";
|
||||
import { getResistantPageUrl } from "../../../getResistantPageUrl";
|
||||
|
||||
export const PopupContent = ({ resistant }: { resistant: Resistant }) => {
|
||||
const navigate = useNavigate();
|
||||
const { isHome } = React.useContext(HomeContext);
|
||||
|
||||
return (
|
||||
<div
|
||||
style={{ minWidth: "30em", minHeight: "15em" }}
|
||||
onClick={() => navigate(resistant.noms)}
|
||||
onClick={() =>
|
||||
navigate(isHome ? getResistantPageUrl(resistant) : resistant.id)
|
||||
}
|
||||
>
|
||||
<img
|
||||
src={getResistantPhotoUrl(resistant)}
|
||||
|
|
|
@ -2,6 +2,9 @@ import { useNavigate } from "react-router";
|
|||
import { BackgroundImage, Text } from "@mantine/core";
|
||||
import { getResistantPhotoUrl } from "../../../getResistantPhotoUrl";
|
||||
import { Resistant } from "../../../Resistant";
|
||||
import React from "react";
|
||||
import { HomeContext } from "../../../context/HomeContext";
|
||||
import { getResistantPageUrl } from "../../../getResistantPageUrl";
|
||||
|
||||
interface Props {
|
||||
resistant: Resistant;
|
||||
|
@ -9,6 +12,7 @@ interface Props {
|
|||
|
||||
export const ResistantThumb = ({ resistant }: Props) => {
|
||||
const navigate = useNavigate();
|
||||
const { isHome } = React.useContext(HomeContext);
|
||||
|
||||
return (
|
||||
<BackgroundImage
|
||||
|
@ -17,7 +21,9 @@ export const ResistantThumb = ({ resistant }: Props) => {
|
|||
>
|
||||
<div
|
||||
className="thumb resistant-thumb"
|
||||
onClick={() => navigate(resistant.noms)}
|
||||
onClick={() =>
|
||||
navigate(isHome ? getResistantPageUrl(resistant) : resistant.id)
|
||||
}
|
||||
style={{ position: "relative" }}
|
||||
>
|
||||
<div className="thumb-name">
|
||||
|
|
|
@ -16,6 +16,7 @@ import { ResistantsMap } from "./Map/ResistantsMap";
|
|||
import { ResistantsThumbs } from "./Thumbs/ResistantsThumbs";
|
||||
import { FiltreDepartement } from "./FiltreDepartement";
|
||||
import { ResistantRow } from "./List/ResistantRow";
|
||||
import { HomeContext } from "../../context/HomeContext";
|
||||
|
||||
const normalize = (text: string) =>
|
||||
(text || "")
|
||||
|
@ -25,6 +26,7 @@ const normalize = (text: string) =>
|
|||
|
||||
export const ListeResistants = () => {
|
||||
const { mode, setMode } = React.useContext(DisplayModeContext);
|
||||
const { isHome } = React.useContext(HomeContext);
|
||||
|
||||
const [departement, setDepartement] = React.useState<string | null>(null);
|
||||
const [academie, setAcademie] = React.useState<string | null>(null);
|
||||
|
@ -51,8 +53,11 @@ export const ListeResistants = () => {
|
|||
<div id="listeResistants">
|
||||
<Group position="center">
|
||||
<SegmentedControl
|
||||
data={[
|
||||
{
|
||||
data={
|
||||
[
|
||||
isHome
|
||||
? "undefined"
|
||||
: {
|
||||
value: "list",
|
||||
label: (
|
||||
<Center>
|
||||
|
@ -79,7 +84,11 @@ export const ListeResistants = () => {
|
|||
</Center>
|
||||
),
|
||||
},
|
||||
]}
|
||||
].filter(Boolean) as Array<{
|
||||
value: string;
|
||||
label: React.ReactNode;
|
||||
}>
|
||||
}
|
||||
size="xs"
|
||||
value={mode}
|
||||
onChange={(value) => setMode(value as ViewMode)}
|
||||
|
|
|
@ -3,10 +3,10 @@ import { getResistantPhotoUrl } from "../getResistantPhotoUrl";
|
|||
import { resistants } from "../resistants";
|
||||
|
||||
export const PageResistant = () => {
|
||||
const { nomResistant } = useParams();
|
||||
const { idResistant } = useParams();
|
||||
const navigate = useNavigate();
|
||||
|
||||
const resistant = resistants.find((r) => r.noms === nomResistant);
|
||||
const resistant = resistants.find((r) => r.id === idResistant);
|
||||
|
||||
if (!resistant) return <>Résistant introuvable</>;
|
||||
|
||||
|
|
Loading…
Reference in New Issue