Skip to content

Commit

Permalink
feat: Fiche établissement et entreprise : ajouter le menu latéral
Browse files Browse the repository at this point in the history
  • Loading branch information
@ImenOuidou
ImenOuidou committed Sep 8, 2023
1 parent 201c7d1 commit d1c2eaf
Show file tree
Hide file tree
Showing 22 changed files with 824 additions and 248 deletions.
8 changes: 8 additions & 0 deletions src/client/src/components/App/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { Error403, Error404 } from "../../components/Errors";
import IEChecker from "../../components/IEChecker";
import Enterprise from "../../containers/Enterprise";
import LegacyEtablissement from "../../containers/Enterprise/LegacyEtablissement";
import ListEtablissements from "../../containers/Enterprise/ListEtablissements.jsx";
import Login from "../../containers/Login";
import PublicPage from "../../containers/PublicPage";
import Search from "../../containers/Search";
Expand Down Expand Up @@ -77,11 +78,18 @@ const App = () => {
exact
path="/enterprise/:siren"
component={Enterprise}
isEntrepriseDisplayed
/>
<PrivateRoute
exact
path="/establishment/:siret"
component={LegacyEtablissement}
isEstablishmentDisplayed
/>
<PrivateRoute
exact
path="/list-establishments/:siren"
component={ListEtablissements}
/>
<Route
exact
Expand Down
37 changes: 23 additions & 14 deletions src/client/src/components/App/Breadcrumbs/Breadcrumbs.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,20 @@ import { Link, useLocation } from "react-router-dom";

const Breadcrumbs = () => {
const location = useLocation();
if (
location.pathname === "" ||
location.pathname === "/" ||
location.pathname === "/search"
)
return null;
console.log(location, "location");
const invalidPaths = [
"",
"/",
"/search",
"/a-propos",
"/faq",
"/aide",
"/sources-des-donnees",
"/statistics",
"/mentions-legales",
"/politique-de-confidentialite",
];

if (invalidPaths.includes(location.pathname)) return null;
return (
<div className="breadcrumbs">
<div className="crumb">
Expand All @@ -24,13 +31,15 @@ const Breadcrumbs = () => {
<span>Liste établissements</span>
<FontAwesomeIcon icon={faAngleRight} />
</div>
<div className="crumb">
<span>
{location.pathname.includes("establishment")
? "Fiche établissement"
: "Fiche entreprise"}
</span>
</div>
{!location.pathname.includes("list-establishments") && (
<div className="crumb">
<span>
{location.pathname.includes("establishment")
? "Fiche établissement"
: location.pathname.includes("entreprise") && "Fiche entreprise"}
</span>
</div>
)}
</div>
);
};
Expand Down
77 changes: 31 additions & 46 deletions src/client/src/components/DataSheets/Sections/Enterprise/Enterprise.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,10 @@ import { useScrollToLocationHash } from "../../../../helpers/hooks/useScrollToLo
import withLoading from "../../../../services/withLoading";
import { getSiren } from "../../../../utils/entreprise/entreprise";
import Sidebar from "../../Sidebar/Sidebar";
// import ListEstablishment from "../Establishment/ListEtablishments/ListEstablishment.jsx";
import PrintSection from "../SharedComponents/PrintSection";
import QuickAccess from "../SharedComponents/QuickAccess";
// import SubHeader from "../SharedComponents/SubHeader/SubHeader.jsx";
import ListEstablishment from "../Establishment/ListEtablishments/ListEstablishment.jsx";
import { EstablishmentProvider } from "../SharedComponents/EstablishmentContext.jsx";
import ScrollToTopButton from "../SharedComponents/ScrollToTopButton/ScrollToTopButton.jsx";
import SubHeader from "../SharedComponents/SubHeader/SubHeader.jsx";
import Agrements from "./Agrements/Agrements";
import Direccte from "./Direccte";
import RelationsEntreprise from "./EnterpriseRelationship";
Expand All @@ -25,56 +25,41 @@ import Muteco from "./Muteco";
const Enterprise = ({ enterprise }) => {
const location = useLocation();
useScrollToLocationHash({ location });
// const siren = getSiren(enterprise);

const siren = getSiren(enterprise);
return (
<div>
{/* <SubHeader siren={siren} /> */}
<EstablishmentProvider siren={siren}>
<div>
<SubHeader siren={siren} />

<section className="data-sheet container is-fullhd">
<PrintSection />
<div className="columns">
<div className="column is-3 aside-box is-hidden-touch">
<Sidebar siren={getSiren(enterprise)} />
</div>
<div className="data-sheet__main-content column is-9-desktop is-12-tablet">
<Header enterprise={enterprise} />
<div className="data-sheet__main-container">
<QuickAccess
anchors={[
{ label: "Informations légales", link: "infos" },
{ label: "Visites et contrôles", link: "direccte" },
{ label: "Relation travail", link: "relationship" },
{
label: "Mutations économiques",
link: "muteco",
},
{ label: "Aides", link: "helps" },
{ label: "Agréments", link: "agrements" },
]}
/>
<Infos enterprise={enterprise} />
<Direccte entreprise={enterprise} />
<RelationsEntreprise enterprise={enterprise} />
<Muteco enterprise={enterprise} />
<Helps enterprise={enterprise} />
<Agrements enterprise={enterprise} />
{/* <ListEstablishment
siren={siren}
isEstablishmentDisplayed={true}
/> */}
<section className="data-sheet container is-fullhd">
<div className="columns">
<div className="column is-3 aside-box is-hidden-touch">
<Sidebar siren={siren} isEntrepriseDisplayed />
</div>
<div className="data-sheet__main-content column is-9-desktop is-12-tablet">
<Header enterprise={enterprise} />
<div className="data-sheet__main-container">
<Infos enterprise={enterprise} />
<Direccte entreprise={enterprise} />
<RelationsEntreprise enterprise={enterprise} />
<Muteco enterprise={enterprise} />
<Helps enterprise={enterprise} />
<Agrements enterprise={enterprise} />
<ListEstablishment isEstablishmentDisplayed={true} />
</div>
<UsersFeedback fullWidth />
<ScrollToTopButton />
</div>
<UsersFeedback fullWidth />
</div>
</div>
</section>
{/* <Unsubscribe /> */}
</div>
</section>
{/* <Unsubscribe /> */}
</div>
</EstablishmentProvider>
);
};

Enterprise.propTypes = {
enterprise: PropTypes.object.isRequired,
};

export default withLoading(Enterprise);
export default React.memo(withLoading(Enterprise));
73 changes: 35 additions & 38 deletions src/client/src/components/DataSheets/Sections/Establishment/Establishment.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,9 @@ import { renderIfSiret } from "../../../../helpers/hoc/renderIfSiret";
import { useScrollToLocationHash } from "../../../../helpers/hooks/useScrollToLocationHash";
import { getSirenFromSiret } from "../../../../utils/establishment/establishment";
import Sidebar from "../../Sidebar/Sidebar";
import PrintSection from "../SharedComponents/PrintSection";
import QuickAccess from "../SharedComponents/QuickAccess";
// import SubHeader from "../SharedComponents/SubHeader/SubHeader.jsx";
import { EstablishmentProvider } from "../SharedComponents/EstablishmentContext.jsx";
import ScrollToTopButton from "../SharedComponents/ScrollToTopButton/ScrollToTopButton.jsx";
import SubHeader from "../SharedComponents/SubHeader/SubHeader.jsx";
import Activite from "./Activity/Activite";
import Agrements from "./Agreements/Agrements";
import Controles from "./Direccte/Controles";
Expand All @@ -25,49 +25,46 @@ import Relationship from "./Relationship";
const Establishment = ({ siret }) => {
const location = useLocation();
useScrollToLocationHash({ location });

const siren = getSirenFromSiret(siret);

return (
<div>
{/* <SubHeader siren={siren} /> */}

<section className="data-sheet container is-fullhd">
<PrintSection />
<div className="columns">
<div className="column is-3 aside-box is-hidden-touch">
<Sidebar siren={siren} isEstablishmentDisplayed={true} />
</div>
<EstablishmentProvider siren={siren}>
<div>
<SubHeader siren={siren} />

<div className="data-sheet__main-content column is-9-desktop is-12-tablet">
<Header siret={siret} siren={siren} />
<div className="data-sheet__main-container">
<QuickAccess
anchors={[
{ label: "Activité", link: "activity" },
{ label: "Visites et contrôles", link: "direccte" },
{ label: "Relation travail", link: "relation" },
{ label: "Mutations économiques", link: "muteco" },
{ label: "Aides", link: "helps" },
{ label: "Agréments", link: "agrements" },
]}
/>
<Activite siret={siret} />
<Controles siret={siret} />
<Relationship siret={siret} />
<Muteco siret={siret} />
<Helps siret={siret} />
<Agrements siret={siret} />
<ListEstablishment
<section className="data-sheet container is-fullhd">
<div className="columns">
<div className="column is-3 aside-box is-hidden-touch">
<Sidebar
siren={siren}
isEstablishmentDisplayed={true}
siret={siret}
/>
</div>
<UsersFeedback fullWidth />

<div className="data-sheet__main-content column is-9-desktop is-12-tablet">
<Header siret={siret} siren={siren} />
<div className="data-sheet__main-container">
<Activite siret={siret} />
<Controles siret={siret} />
<Relationship siret={siret} />
<Muteco siret={siret} />
<Helps siret={siret} />
<Agrements siret={siret} />
<ListEstablishment
siren={siren}
isEstablishmentDisplayed={true}
/>
</div>
<UsersFeedback fullWidth />
<ScrollToTopButton />
</div>
</div>
</div>
</section>
{/* <Unsubscribe /> */}
</div>
</section>
{/* <Unsubscribe /> */}
</div>
</EstablishmentProvider>
);
};

Expand All @@ -76,4 +73,4 @@ Establishment.propTypes = {
successions: PropTypes.object.isRequired,
};

export default renderIfSiret(Establishment);
export default React.memo(renderIfSiret(Establishment));
35 changes: 15 additions & 20 deletions .../src/components/DataSheets/Sections/Establishment/ListEtablishments/ListEstablishment.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import PropTypes from "prop-types";
import React, { useState } from "react";
import { Link, useHistory } from "react-router-dom";

Expand All @@ -13,15 +12,13 @@ import { getEtablissements } from "../../../../../utils/entreprise/entreprise";
import { isActive } from "../../../../../utils/establishment/establishment";
import BadgeWithIcon from "../../../../shared/Badge/BadgeWithIcon.jsx";
import Value from "../../../../shared/Value";
import {
getEtablissementsCount,
useSidebarData,
} from "../../../Sidebar/Sidebar.gql";
import { getEtablissementsCount } from "../../../Sidebar/Sidebar.gql";
import { useEstablishmentData } from "../../SharedComponents/EstablishmentContext.jsx";
import NonBorderedTable from "../../SharedComponents/NonBorderedTable/NonBorderedTable";
import PaginationTable from "../../SharedComponents/PaginationTable/PaginationTable.jsx";

const ListEstablishment = ({ siren }) => {
const { loading, data: entreprise, error } = useSidebarData(siren);
const ListEstablishment = () => {
const { loading, data: entreprise, error } = useEstablishmentData();
const history = useHistory();

const [currentPage, setCurrentPage] = useState(1);
Expand Down Expand Up @@ -56,7 +53,7 @@ const ListEstablishment = ({ siren }) => {
};

return (
<section id="helps" className="data-sheet__bloc_section ">
<section id="autres-etablissements" className="data-sheet__bloc_section ">
<div className="section-header ">
<h2 className="dark-blue-title">
Autres Etablissements (
Expand Down Expand Up @@ -161,22 +158,20 @@ const ListEstablishment = ({ siren }) => {
})}
</tbody>
</NonBorderedTable>
<div className="table-pagination">
<PaginationTable
currentPage={currentPage}
totalPages={totalPages}
handlePageClick={handlePageClick}
/>
</div>
{etablissementsCount > 4 && (
<div className="table-pagination">
<PaginationTable
currentPage={currentPage}
totalPages={totalPages}
handlePageClick={handlePageClick}
/>
</div>
)}
</div>
)}
</div>
</section>
);
};

ListEstablishment.propTypes = {
siren: PropTypes.string.isRequired,
};

export default ListEstablishment;
export default React.memo(ListEstablishment);
Loading

0 comments on commit d1c2eaf

Please sign in to comment.