Skip to content

Commit

Permalink
feat: Ajout d'un encart warning si la distance est > 0 (#549)
Browse files Browse the repository at this point in the history 
* Ajout d'un encart warning si la distance est > 0

* Fix tests

* Ajout seuil de tolérance
  • Loading branch information
@QuentinPetel
QuentinPetel authored Mar 2, 2022
1 parent c6cd625 commit 82bf826
Show file tree
Hide file tree
Showing 3 changed files with 156 additions and 89 deletions.
2 changes: 2 additions & 0 deletions ui/src/locales/helpText.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,11 +19,13 @@
"uai_formation": "La donnée “UAI Lieu de formation” correspond à l’UAI de l’organisme formateur ou est renseigné par un instructeur en académie si le lieu de formation est différent de celui du formateur.",
"academie": "La donnée “Académie” est déduite du Code Académie qui est déduit du Code commune.",
"lieu_formation_adresse": "La donnée “Adresse” provient des bases “Carif-Oref”. Si cette information est erronée, merci de le signaler au Carif-Oref de votre région.",
"lieu_formation_geo_coordonnees": "La donnée “Géolocalisation“ provient des bases “Carif-Oref”. Si cette information est erronée, merci de le signaler au Carif-Oref de votre région.",
"code_postal": "La donnée “Code postal” provient des bases “Carif-Oref”. Si cette information est erronée, merci de le signaler au Carif-Oref de votre région.",
"localite": "La donnée “Commune” provient des bases “Carif-Oref”. Si cette information est erronée, merci de le signaler au Carif-Oref de votre région.",
"code_commune_insee": "La donnée “Code commune” provient des bases “Carif-Oref”. Si cette information est erronée, merci de le signaler au Carif-Oref de votre région.",
"nom_departement": "La donnée “Département” est déduite du Code postal",
"lieu_formation_adresse_computed": "L'adresse est calculée à partir de la géolocalisation. Rapprochez vous de votre Carif-Oref pour préciser cette géolocalisation afin que les jeunes puissent identifier où se situe le lieu de formation.",
"lieu_formation_geo_coordonnees_computed": "Les coordonnées sont calculées à partir de l'adresse transmise. Rapprochez vous de votre Carif-Oref afin qu'elles permettent aux jeunes d'identifier où se situe le lieu de formation.",
"parcoursup_published_date": "Date à laquelle la formation est passée à l'état \"Parcoursup - publié\" dans le catalogue (envoi automatique ou rapprochement des bases Parcoursup et Carif-Oref)",
"affelnet_published_date": "Date à laquelle la formation est passée à l'état \"Affelnet - publié\" dans le catalogue (rapprochement des bases Affelnet et Carif-Oref)"
},
Expand Down
203 changes: 123 additions & 80 deletions ui/src/pages/Formation/Formation.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,10 +51,18 @@ const getLBAUrl = ({ cle_ministere_educatif = "" }) => {
)}`;
};

const getGeoPortailUrl = (coordinates) => {
const [lat, lon] = coordinates.split(",");
return `https://www.geoportail.gouv.fr/carte?c=${lon},${lat}&z=19&l0=ORTHOIMAGERY.ORTHOPHOTOS::GEOPORTAIL:OGC:WMTS(1)&permalink=yes`;
};

const Formation = ({ formation, edition, onEdit, handleChange, handleSubmit, values, hasRightToEdit }) => {
const { isOpen: isComputedAdressOpen, onToggle: onComputedAdressToggle } = useDisclosure();
const { isOpen: isComputedGeoCoordOpen, onToggle: onComputedGeoCoordToggle } = useDisclosure();

// Distance tolérer entre l'adresse et les coordonnées transmise par RCO
const seuilDistance = 100;

const UaiFormationContainer = formation.uai_formation_valide
? React.Fragment
: (args) => (
Expand All @@ -70,6 +78,22 @@ const Formation = ({ formation, edition, onEdit, handleChange, handleSubmit, val
/>
);

const AdresseContainer =
seuilDistance >= formation.distance
? React.Fragment
: (args) => (
<Box
data-testid={"adress-warning"}
bg={"orangesoft.200"}
p={4}
mb={4}
borderLeft={"4px solid"}
borderColor={"orangesoft.500"}
w={"full"}
{...args}
/>
);

return (
<Box borderRadius={4}>
<Grid templateColumns="repeat(12, 1fr)">
Expand All @@ -84,7 +108,7 @@ const Formation = ({ formation, edition, onEdit, handleChange, handleSubmit, val
</Heading>
<Box mt={2} mb={4} px={5}>
<Link href={getLBAUrl(formation)} textStyle="rf-text" variant="pill" isExternal>
voir sur un plan <ExternalLinkLine w={"0.75rem"} h={"0.75rem"} mb={"0.125rem"} />
voir sur labonnealternance <ExternalLinkLine w={"0.75rem"} h={"0.75rem"} mb={"0.125rem"} />
</Link>
</Box>

Expand All @@ -104,79 +128,104 @@ const Formation = ({ formation, edition, onEdit, handleChange, handleSubmit, val
/>
</UaiFormationContainer>

<Text mb={4}>
Adresse :{" "}
<Text as="span" variant="highlight">
{formation.lieu_formation_adresse}
</Text>{" "}
<InfoTooltip description={helpText.formation.lieu_formation_adresse} />
</Text>
<Text mb={4}>
Code postal :{" "}
<Text as="span" variant="highlight">
{formation.code_postal}
</Text>{" "}
<InfoTooltip description={helpText.formation.code_postal} />
</Text>
<Text mb={formation?.lieu_formation_adresse_computed ? 0 : 4}>
Commune :{" "}
<Text as="span" variant="highlight">
{formation.localite}
</Text>{" "}
<InfoTooltip description={helpText.formation.localite} />
</Text>
{formation?.lieu_formation_geo_coordonnees_computed && (
<Box mb={4}>
<Button
onClick={onComputedGeoCoordToggle}
variant={"unstyled"}
fontSize={"zeta"}
fontStyle={"italic"}
color={"grey.600"}
>
Géolocalisation calculée depuis l'adresse{" "}
<ArrowDownLine boxSize={5} transform={isComputedGeoCoordOpen ? "rotate(180deg)" : "none"} />
</Button>
<Collapse in={isComputedGeoCoordOpen} animateOpacity>
<Text mb={4}>
<Text fontSize={"zeta"} color={"grey.600"} as="span">
{formation.lieu_formation_geo_coordonnees_computed}
</Text>{" "}
<InfoTooltip description={helpText.formation.lieu_formation_geo_coordonnees_computed} />
</Text>
</Collapse>
</Box>
)}
<AdresseContainer>
<Text mb={4}>
Adresse :{" "}
<Text as="span" variant="highlight">
{formation.lieu_formation_adresse}
</Text>{" "}
<InfoTooltip description={helpText.formation.lieu_formation_adresse} />
</Text>
<Text mb={4}>
Code postal :{" "}
<Text as="span" variant="highlight">
{formation.code_postal}
</Text>{" "}
<InfoTooltip description={helpText.formation.code_postal} />
</Text>
<Text mb={4}>
Commune :{" "}
<Text as="span" variant="highlight">
{formation.localite}
</Text>{" "}
<InfoTooltip description={helpText.formation.localite} />
</Text>
<Text mb={formation?.lieu_formation_geo_coordonnees_computed ? 0 : 4}>
Département :{" "}
<Text as="span" variant="highlight">
{formation.nom_departement} ({formation.num_departement})
</Text>{" "}
<InfoTooltip description={helpText.formation.nom_departement} />
</Text>
{formation?.lieu_formation_geo_coordonnees_computed && (
<Box mb={6}>
<Button
onClick={onComputedGeoCoordToggle}
variant={"unstyled"}
fontSize={"zeta"}
fontStyle={"italic"}
color={"grey.600"}
>
Géolocalisation calculée depuis l'adresse{" "}
<ArrowDownLine boxSize={5} transform={isComputedGeoCoordOpen ? "rotate(180deg)" : "none"} />
</Button>
<Collapse in={isComputedGeoCoordOpen} animateOpacity unmountOnExit={true}>
<Text mb={2}>
<Text fontSize={"zeta"} color={"grey.600"} as="span">
<Link
href={getGeoPortailUrl(formation.lieu_formation_geo_coordonnees_computed)}
textStyle="rf-text"
variant="pill"
title="Voir sur GeoPortail"
isExternal
>
{formation.lieu_formation_geo_coordonnees_computed}
</Link>
</Text>{" "}
<InfoTooltip description={helpText.formation.lieu_formation_geo_coordonnees_computed} />
</Text>
</Collapse>
</Box>
)}

<Text mb={formation?.lieu_formation_adresse_computed ? 0 : 4}>
Géolocalisation :{" "}
<Text as="span" variant="highlight">
{formation.lieu_formation_geo_coordonnees}
</Text>{" "}
<InfoTooltip description={helpText.formation.lieu_formation_geo_coordonnees} />
</Text>
{formation?.lieu_formation_adresse_computed && (
<Box mb={4}>
<Button
onClick={onComputedAdressToggle}
variant={"unstyled"}
fontSize={"zeta"}
fontStyle={"italic"}
color={"grey.600"}
>
Adresse calculée depuis la géolocalisation{" "}
<ArrowDownLine boxSize={5} transform={isComputedAdressOpen ? "rotate(180deg)" : "none"} />
</Button>
<Collapse in={isComputedAdressOpen} animateOpacity>
<Text mb={4}>
<Text fontSize={"zeta"} color={"grey.600"} as="span">
{formation.lieu_formation_adresse_computed}
</Text>{" "}
<InfoTooltip description={helpText.formation.lieu_formation_adresse_computed} />
</Text>
</Collapse>
</Box>
)}
<Text mb={formation?.lieu_formation_adresse_computed ? 0 : 4}>
Géolocalisation :{" "}
<Text as="span" variant="highlight">
{formation.lieu_formation_geo_coordonnees}
</Text>{" "}
<InfoTooltip description={helpText.formation.lieu_formation_geo_coordonnees} />
</Text>
{formation?.lieu_formation_adresse_computed && (
<Box mb={4}>
<Button
onClick={onComputedAdressToggle}
variant={"unstyled"}
fontSize={"zeta"}
fontStyle={"italic"}
color={"grey.600"}
>
Adresse calculée depuis la géolocalisation{" "}
<ArrowDownLine boxSize={5} transform={isComputedAdressOpen ? "rotate(180deg)" : "none"} />
</Button>
<Collapse in={isComputedAdressOpen} animateOpacity unmountOnExit={true}>
<Text mb={2}>
<Text fontSize={"zeta"} color={"grey.600"} as="span">
<Link
href={getGeoPortailUrl(formation.lieu_formation_geo_coordonnees)}
textStyle="rf-text"
variant="pill"
title="Voir sur GeoPortail"
isExternal
>
{formation.lieu_formation_adresse_computed}
</Link>
</Text>{" "}
<InfoTooltip description={helpText.formation.lieu_formation_adresse_computed} />
</Text>
</Collapse>
</Box>
)}
</AdresseContainer>

<Text mb={4}>
Code commune :{" "}
Expand All @@ -185,13 +234,7 @@ const Formation = ({ formation, edition, onEdit, handleChange, handleSubmit, val
</Text>{" "}
<InfoTooltip description={helpText.formation.code_commune_insee} />
</Text>
<Text mb={8}>
Département :{" "}
<Text as="span" variant="highlight">
{formation.nom_departement} ({formation.num_departement})
</Text>{" "}
<InfoTooltip description={helpText.formation.nom_departement} />
</Text>

<Text mb={4}>
Académie de rattachement :{" "}
<Text as="span" variant="highlight">
Expand Down
40 changes: 31 additions & 9 deletions ui/src/pages/Formation/Formation.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -264,11 +264,11 @@ const formation = {
};

const server = setupMswServer(
rest.get(/\/api\/entity\/formation\/2/, (req, res, ctx) => {
return res(ctx.json({ ...formation, uai_formation_valide: false }));
}),
rest.get(/\/api\/entity\/formation\/1/, (req, res, ctx) => {
return res(ctx.json({ ...formation, uai_formation_valide: true }));
return res(ctx.json({ ...formation, uai_formation_valide: true, distance: 0 }));
}),
rest.get(/\/api\/entity\/formation\/2/, (req, res, ctx) => {
return res(ctx.json({ ...formation, uai_formation_valide: false, distance: 150 }));
}),
rest.get(/\/api\/v1\/entity\/messageScript/, (req, res, ctx) => {
return res(ctx.json([]));
Expand All @@ -288,30 +288,52 @@ test("renders a training page", async () => {
expect(title).toBeInTheDocument();
});

test("display an error when uai is invalid", async () => {
test("don't display an error when uai is valid", async () => {
grantAnonymousAccess({ acl: ["page_formation"] });

const { getByText, queryByText, queryByTestId } = renderWithRouter(<Formation match={{ params: { id: 2 } }} />);
const { getByText, queryByText, queryByTestId } = renderWithRouter(<Formation match={{ params: { id: 1 } }} />);

await waitFor(() => getByText(/UAI du lieu de formation/));

const uai = queryByText("0573690B");
expect(uai).toBeInTheDocument();

const warning = queryByTestId("uai-warning");
expect(warning).toBeInTheDocument();
expect(warning).not.toBeInTheDocument();
});

test("don't display an error when uai is valid", async () => {
test("display an error when uai is invalid", async () => {
grantAnonymousAccess({ acl: ["page_formation"] });

const { getByText, queryByText, queryByTestId } = renderWithRouter(<Formation match={{ params: { id: 1 } }} />);
const { getByText, queryByText, queryByTestId } = renderWithRouter(<Formation match={{ params: { id: 2 } }} />);

await waitFor(() => getByText(/UAI du lieu de formation/));

const uai = queryByText("0573690B");
expect(uai).toBeInTheDocument();

const warning = queryByTestId("uai-warning");
expect(warning).toBeInTheDocument();
});

test("don't display an error when adress is same as coordinates", async () => {
grantAnonymousAccess({ acl: ["page_formation"] });

const { getByText, queryByTestId } = renderWithRouter(<Formation match={{ params: { id: 1 } }} />);

await waitFor(() => getByText(/Adresse :/));

const warning = queryByTestId("adress-warning");
expect(warning).not.toBeInTheDocument();
});

test("display an error when adress is not same as coordinates", async () => {
grantAnonymousAccess({ acl: ["page_formation"] });

const { getByText, queryByTestId } = renderWithRouter(<Formation match={{ params: { id: 2 } }} />);

await waitFor(() => getByText(/Adresse :/));

const warning = queryByTestId("adress-warning");
expect(warning).toBeInTheDocument();
});

0 comments on commit 82bf826

Please sign in to comment.