From 5186b1bd45591bc3c8f1db37a385e86fd34d036a Mon Sep 17 00:00:00 2001 From: Maxime Lalo Date: Mon, 29 Jul 2024 11:54:38 +0200 Subject: [PATCH 1/7] :sparkles: Every dashboard working --- .../SearchBlockList/classes.module.scss | 1 + .../DesignSystem/SearchBlockList/index.tsx | 4 +- .../classes.module.scss | 23 --- .../CollaboratorListContainer/index.tsx | 44 ----- .../classes.module.scss | 116 ------------- .../DefaultCollaboratorDashboard/index.tsx | 147 +++++----------- .../DefaultDashboardWithList/index.tsx | 14 +- .../DeedTypeListContainer/classes.module.scss | 32 ---- .../DeedTypeListContainer/index.tsx | 48 ------ .../classes.module.scss | 116 ------------- .../DefaultDeedTypeDashboard/index.tsx | 147 +++++----------- .../classes.module.scss | 30 ---- .../DocumentTypeListContainer/index.tsx | 48 ------ .../classes.module.scss | 116 ------------- .../DefaultDocumentTypesDashboard/index.tsx | 163 ++++++------------ .../DefaultOfficeDashboard/index.tsx | 2 +- .../RoleListContainer/classes.module.scss | 32 ---- .../RoleListContainer/index.tsx | 53 ------ .../DefaultRoleDashboard/classes.module.scss | 116 ------------- .../DefaultRoleDashboard/index.tsx | 146 +++++----------- .../DefaultUserDashboard/index.tsx | 2 +- 21 files changed, 175 insertions(+), 1225 deletions(-) delete mode 100644 src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/CollaboratorListContainer/classes.module.scss delete mode 100644 src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/CollaboratorListContainer/index.tsx delete mode 100644 src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/classes.module.scss delete mode 100644 src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/DeedTypeListContainer/classes.module.scss delete mode 100644 src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/DeedTypeListContainer/index.tsx delete mode 100644 src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/classes.module.scss delete mode 100644 src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/DocumentTypeListContainer/classes.module.scss delete mode 100644 src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/DocumentTypeListContainer/index.tsx delete mode 100644 src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/classes.module.scss delete mode 100644 src/front/Components/LayoutTemplates/DefaultRoleDashboard/RoleListContainer/classes.module.scss delete mode 100644 src/front/Components/LayoutTemplates/DefaultRoleDashboard/RoleListContainer/index.tsx delete mode 100644 src/front/Components/LayoutTemplates/DefaultRoleDashboard/classes.module.scss diff --git a/src/front/Components/DesignSystem/SearchBlockList/classes.module.scss b/src/front/Components/DesignSystem/SearchBlockList/classes.module.scss index 4354b29d..cc668f67 100644 --- a/src/front/Components/DesignSystem/SearchBlockList/classes.module.scss +++ b/src/front/Components/DesignSystem/SearchBlockList/classes.module.scss @@ -1,6 +1,7 @@ @import "@Themes/constants.scss"; .root { width: 336px; + min-width: 336px; height: 100%; max-height: 100%; diff --git a/src/front/Components/DesignSystem/SearchBlockList/index.tsx b/src/front/Components/DesignSystem/SearchBlockList/index.tsx index 0ed80f61..0ca8fd77 100644 --- a/src/front/Components/DesignSystem/SearchBlockList/index.tsx +++ b/src/front/Components/DesignSystem/SearchBlockList/index.tsx @@ -7,7 +7,7 @@ import Button from "../Button"; import { useRouter } from "next/router"; import DropdownNavigation from "./DropdownNavigation"; -type IProps = { +export type ISearchBlockListProps = { blocks: IBlock[]; onSelectedBlock: (block: IBlock) => void; bottomButton?: { @@ -15,7 +15,7 @@ type IProps = { link: string; }; }; -export default function SearchBlockList(props: IProps) { +export default function SearchBlockList(props: ISearchBlockListProps) { const { blocks, onSelectedBlock, bottomButton } = props; const [selectedBlock, setSelectedBlock] = useState(null); diff --git a/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/CollaboratorListContainer/classes.module.scss b/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/CollaboratorListContainer/classes.module.scss deleted file mode 100644 index abe261a4..00000000 --- a/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/CollaboratorListContainer/classes.module.scss +++ /dev/null @@ -1,23 +0,0 @@ -@import "@Themes/constants.scss"; - -.root { - width: calc(100vh - 83px); - display: flex; - flex-direction: column; - justify-content: space-between; - - .header { - flex: 1; - } - - .searchbar { - padding: 40px 24px 24px 24px; - } - - .folderlist-container { - max-height: calc(100vh - 215px); - height: 100%; - border-right: 1px solid var(--color-neutral-200); - overflow: auto; - } -} diff --git a/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/CollaboratorListContainer/index.tsx b/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/CollaboratorListContainer/index.tsx deleted file mode 100644 index eee22e10..00000000 --- a/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/CollaboratorListContainer/index.tsx +++ /dev/null @@ -1,44 +0,0 @@ -import React, { useCallback } from "react"; - -import classes from "./classes.module.scss"; -import User from "le-coffre-resources/dist/Notary"; -import { useRouter } from "next/router"; -import Module from "@Front/Config/Module"; -import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; -import SearchBlockList from "@Front/Components/DesignSystem/SearchBlockList"; - -type IProps = { - collaborators: User[]; - onSelectedCollaborator?: (user: User) => void; - onCloseLeftSide?: () => void; -}; - -export default function CollaboratorListContainer(props: IProps) { - const router = useRouter(); - - const { collaboratorUid } = router.query; - - const onSelectedBlock = useCallback( - (block: IBlock) => { - props.onCloseLeftSide && props.onCloseLeftSide(); - const redirectPath = Module.getInstance().get().modules.pages.Collaborators.pages.CollaboratorInformations.props.path; - router.push(redirectPath.replace("[uid]", block.id)); - }, - [props, router], - ); - - return ( -
- { - return { - primaryText: user.contact?.first_name + " " + user.contact?.last_name, - id: user.uid!, - isActive: user.uid === collaboratorUid, - }; - })} - onSelectedBlock={onSelectedBlock} - /> -
- ); -} diff --git a/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/classes.module.scss b/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/classes.module.scss deleted file mode 100644 index f54563dd..00000000 --- a/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/classes.module.scss +++ /dev/null @@ -1,116 +0,0 @@ -@import "@Themes/constants.scss"; - -@keyframes growWidth { - 0% { - width: 100%; - } - - 100% { - width: 200%; - } -} - -.root { - .content { - display: flex; - overflow: hidden; - height: calc(100vh - var(--header-height)); - - .overlay { - position: absolute; - width: 100%; - height: 100%; - background-color: var(--color-generic-white); - opacity: 0.5; - z-index: 2; - transition: all 0.3s $custom-easing; - } - - .left-side { - background-color: var(--color-generic-white); - z-index: 3; - display: flex; - width: 336px; - min-width: 336px; - transition: all 0.3s $custom-easing; - overflow: hidden; - - @media (max-width: ($screen-m - 1px)) { - width: 56px; - min-width: 56px; - transform: translateX(-389px); - - &.opened { - transform: translateX(0px); - width: 336px; - min-width: 336px; - } - } - - @media (max-width: $screen-s) { - width: 0px; - min-width: 0px; - - &.opened { - width: 100vw; - min-width: 100vw; - } - } - } - - .closable-left-side { - position: absolute; - background-color: var(--color-generic-white); - z-index: 0; - display: flex; - justify-content: center; - min-width: 56px; - max-width: 56px; - height: calc(100vh - var(--header-height)); - border-right: 1px var(--color-neutral-200) solid; - - @media (min-width: $screen-m) { - display: none; - } - - .chevron-icon { - margin-top: 21px; - transform: rotate(180deg); - cursor: pointer; - } - - @media (max-width: $screen-s) { - display: none; - } - } - - .right-side { - min-width: calc(100vw - 389px); - padding: 24px; - overflow-y: auto; - - @media (max-width: ($screen-m - 1px)) { - min-width: calc(100vw - 56px); - } - - @media (max-width: $screen-s) { - flex: 1; - min-width: unset; - } - - .back-arrow-mobile { - display: none; - @media (max-width: $screen-s) { - display: block; - margin-bottom: 24px; - } - } - - .back-arrow-desktop { - @media (max-width: $screen-s) { - display: none; - } - } - } - } -} diff --git a/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/index.tsx index afa164f5..f4c86d3c 100644 --- a/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/index.tsx @@ -1,93 +1,20 @@ -import ChevronIcon from "@Assets/Icons/chevron.svg"; -import Users, { IGetUsersparams } from "@Front/Api/LeCoffreApi/Admin/Users/Users"; -import Button, { EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button"; -import Header from "@Front/Components/DesignSystem/Header"; -import Version from "@Front/Components/DesignSystem/Version"; -import BackArrow from "@Front/Components/Elements/BackArrow"; +import React, { useEffect } from "react"; + +import { useRouter } from "next/router"; +import Module from "@Front/Config/Module"; +import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; +import DefaultDashboardWithList, { IPropsDashboardWithList } from "../DefaultDashboardWithList"; +import User from "le-coffre-resources/dist/Notary"; import JwtService from "@Front/Services/JwtService/JwtService"; -import WindowStore from "@Front/Stores/WindowStore"; -import classNames from "classnames"; -import User from "le-coffre-resources/dist/Admin"; -import Image from "next/image"; -import React, { ReactNode } from "react"; +import Users, { IGetUsersparams } from "@Front/Api/LeCoffreApi/Admin/Users/Users"; -import classes from "./classes.module.scss"; -import CollaboratorListContainer from "./CollaboratorListContainer"; -import { ChevronLeftIcon } from "@heroicons/react/24/solid"; +type IProps = IPropsDashboardWithList; -type IProps = { - title: string; - children?: ReactNode; - onSelectedUser: (user: User) => void; - hasBackArrow: boolean; - backArrowUrl?: string; - mobileBackText?: string; -}; -type IState = { - collaborators: User[] | null; - isLeftSideOpen: boolean; - leftSideCanBeClosed: boolean; -}; - -export default class DefaultCollaboratorDashboard extends React.Component { - private onWindowResize = () => {}; - public static defaultProps: Partial = { - hasBackArrow: false, - }; - - public constructor(props: IProps) { - super(props); - this.state = { - collaborators: null, - isLeftSideOpen: false, - leftSideCanBeClosed: typeof window !== "undefined" ? window.innerWidth < 1024 : false, - }; - this.onOpenLeftSide = this.onOpenLeftSide.bind(this); - this.onCloseLeftSide = this.onCloseLeftSide.bind(this); - } - - public override render(): JSX.Element { - return ( -
-
-
- {this.state.isLeftSideOpen &&
} -
- {this.state.collaborators && ( - - )} -
-
- open side menu -
- -
- {this.props.hasBackArrow && ( -
- -
- )} - {this.props.mobileBackText && ( -
- -
- )} - {this.props.children} -
-
- -
- ); - } - - public override async componentDidMount() { - this.onWindowResize = WindowStore.getInstance().onResize((window) => this.onResize(window)); +export default function DefaultCollaboratorDashboard(props: IProps) { + const [collaborators, setCollaborators] = React.useState(null); + const router = useRouter(); + const { collaboratorUid } = router.query; + useEffect(() => { const jwt = JwtService.getInstance().decodeJwt(); if (!jwt) return; const query: IGetUsersparams = { @@ -102,27 +29,31 @@ export default class DefaultCollaboratorDashboard extends React.Component setCollaborators(users)); + }, []); - private onOpenLeftSide() { - this.setState({ isLeftSideOpen: true }); - } + const onSelectedBlock = (block: IBlock) => { + router.push( + Module.getInstance().get().modules.pages.Collaborators.pages.CollaboratorInformations.props.path.replace("[uid]", block.id), + ); + }; - private onCloseLeftSide() { - if (!this.state.leftSideCanBeClosed) return; - this.setState({ isLeftSideOpen: false }); - } - - private onResize(window: Window) { - if (window.innerWidth > 1023) { - if (!this.state.leftSideCanBeClosed) return; - this.setState({ leftSideCanBeClosed: false }); - } - this.setState({ leftSideCanBeClosed: true }); - } + return ( + ({ + id: collaborator.uid!, + primaryText: collaborator.contact?.first_name + " " + collaborator.contact?.last_name, + isActive: collaborator.uid === collaboratorUid, + secondaryText: collaborator.contact?.email, + })) + : [] + } + /> + ); } diff --git a/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx b/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx index 67fce823..3f3bd44a 100644 --- a/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx @@ -4,8 +4,7 @@ import BackArrow from "@Front/Components/Elements/BackArrow"; import React, { ReactNode } from "react"; import classes from "./classes.module.scss"; -import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; -import SearchBlockList from "@Front/Components/DesignSystem/SearchBlockList"; +import SearchBlockList, { ISearchBlockListProps } from "@Front/Components/DesignSystem/SearchBlockList"; export type IPropsDashboardWithList = { title?: string; @@ -14,22 +13,19 @@ export type IPropsDashboardWithList = { hasBackArrow?: boolean; backArrowUrl?: string; mobileBackText?: string; -}; - -type IProps = IPropsDashboardWithList & { - blocksList: IBlock[]; - onSelectedBlock: (block: IBlock) => void; headerConnected?: boolean; }; +type IProps = IPropsDashboardWithList & ISearchBlockListProps; + export default function DefaultDashboardWithList(props: IProps) { - const { hasBackArrow, backArrowUrl, children, blocksList, onSelectedBlock, headerConnected = true } = props; + const { hasBackArrow, backArrowUrl, children, blocks, onSelectedBlock, headerConnected = true, bottomButton } = props; return (
- +
{hasBackArrow && (
diff --git a/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/DeedTypeListContainer/classes.module.scss b/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/DeedTypeListContainer/classes.module.scss deleted file mode 100644 index a1a8a9b9..00000000 --- a/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/DeedTypeListContainer/classes.module.scss +++ /dev/null @@ -1,32 +0,0 @@ -@import "@Themes/constants.scss"; - -.root { - width: calc(100vh - 83px); - display: flex; - flex-direction: column; - justify-content: space-between; - - position: relative; - - .header { - flex: 1; - } - - .searchbar { - padding: 40px 24px 24px 24px; - } - - .folderlist-container { - max-height: calc(100vh - 290px); - height: calc(100vh - 290px); - overflow: auto; - border-right: 1px solid var(--color-neutral-200); - } - - .create-container { - position: absolute; - bottom: 0; - left: 0; - right: 0; - } -} diff --git a/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/DeedTypeListContainer/index.tsx b/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/DeedTypeListContainer/index.tsx deleted file mode 100644 index fd94a36d..00000000 --- a/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/DeedTypeListContainer/index.tsx +++ /dev/null @@ -1,48 +0,0 @@ -import DeedTypes from "@Front/Api/LeCoffreApi/Admin/DeedTypes/DeedTypes"; -import Module from "@Front/Config/Module"; -import { DeedType } from "le-coffre-resources/dist/Admin"; -import { useRouter } from "next/router"; -import React, { useCallback } from "react"; - -import classes from "./classes.module.scss"; -import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; -import SearchBlockList from "@Front/Components/DesignSystem/SearchBlockList"; - -type IProps = { - deedTypes: DeedType[]; - onSelectedDeed?: (deed: DeedTypes) => void; - onCloseLeftSide?: () => void; -}; - -export default function DeedListContainer(props: IProps) { - const router = useRouter(); - const { deedTypeUid } = router.query; - - const onSelectedBlock = useCallback( - (block: IBlock) => { - props.onCloseLeftSide && props.onCloseLeftSide(); - const redirectPath = Module.getInstance().get().modules.pages.DeedTypes.pages.DeedTypesInformations.props.path; - router.push(redirectPath.replace("[uid]", block.id)); - }, - [props, router], - ); - - return ( -
- { - return { - primaryText: deed.name, - id: deed.uid!, - isActive: deedTypeUid === deed.uid, - }; - })} - onSelectedBlock={onSelectedBlock} - bottomButton={{ - link: Module.getInstance().get().modules.pages.DeedTypes.pages.Create.props.path, - text: "Créer un type d'acte", - }} - /> -
- ); -} diff --git a/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/classes.module.scss b/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/classes.module.scss deleted file mode 100644 index f54563dd..00000000 --- a/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/classes.module.scss +++ /dev/null @@ -1,116 +0,0 @@ -@import "@Themes/constants.scss"; - -@keyframes growWidth { - 0% { - width: 100%; - } - - 100% { - width: 200%; - } -} - -.root { - .content { - display: flex; - overflow: hidden; - height: calc(100vh - var(--header-height)); - - .overlay { - position: absolute; - width: 100%; - height: 100%; - background-color: var(--color-generic-white); - opacity: 0.5; - z-index: 2; - transition: all 0.3s $custom-easing; - } - - .left-side { - background-color: var(--color-generic-white); - z-index: 3; - display: flex; - width: 336px; - min-width: 336px; - transition: all 0.3s $custom-easing; - overflow: hidden; - - @media (max-width: ($screen-m - 1px)) { - width: 56px; - min-width: 56px; - transform: translateX(-389px); - - &.opened { - transform: translateX(0px); - width: 336px; - min-width: 336px; - } - } - - @media (max-width: $screen-s) { - width: 0px; - min-width: 0px; - - &.opened { - width: 100vw; - min-width: 100vw; - } - } - } - - .closable-left-side { - position: absolute; - background-color: var(--color-generic-white); - z-index: 0; - display: flex; - justify-content: center; - min-width: 56px; - max-width: 56px; - height: calc(100vh - var(--header-height)); - border-right: 1px var(--color-neutral-200) solid; - - @media (min-width: $screen-m) { - display: none; - } - - .chevron-icon { - margin-top: 21px; - transform: rotate(180deg); - cursor: pointer; - } - - @media (max-width: $screen-s) { - display: none; - } - } - - .right-side { - min-width: calc(100vw - 389px); - padding: 24px; - overflow-y: auto; - - @media (max-width: ($screen-m - 1px)) { - min-width: calc(100vw - 56px); - } - - @media (max-width: $screen-s) { - flex: 1; - min-width: unset; - } - - .back-arrow-mobile { - display: none; - @media (max-width: $screen-s) { - display: block; - margin-bottom: 24px; - } - } - - .back-arrow-desktop { - @media (max-width: $screen-s) { - display: none; - } - } - } - } -} diff --git a/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/index.tsx index 6db68829..f62d1e5d 100644 --- a/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultDeedTypeDashboard/index.tsx @@ -1,92 +1,19 @@ -import ChevronIcon from "@Assets/Icons/chevron.svg"; +import React, { useEffect } from "react"; + +import { useRouter } from "next/router"; +import Module from "@Front/Config/Module"; +import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; +import DefaultDashboardWithList, { IPropsDashboardWithList } from "../DefaultDashboardWithList"; +import { DeedType } from "le-coffre-resources/dist/Notary"; import DeedTypes, { IGetDeedTypesParams } from "@Front/Api/LeCoffreApi/Notary/DeedTypes/DeedTypes"; -import Button, { EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button"; -import Header from "@Front/Components/DesignSystem/Header"; -import Version from "@Front/Components/DesignSystem/Version"; -import BackArrow from "@Front/Components/Elements/BackArrow"; -import WindowStore from "@Front/Stores/WindowStore"; -import classNames from "classnames"; -import { Deed, DeedType } from "le-coffre-resources/dist/Notary"; -import Image from "next/image"; -import React, { ReactNode } from "react"; -import classes from "./classes.module.scss"; -import DeedListContainer from "./DeedTypeListContainer"; -import { ChevronLeftIcon } from "@heroicons/react/24/solid"; +type IProps = IPropsDashboardWithList; -type IProps = { - title: string; - children?: ReactNode; - onSelectedDeed: (deed: Deed) => void; - hasBackArrow: boolean; - backArrowUrl?: string; - mobileBackText?: string; -}; -type IState = { - deedTypes: DeedType[] | null; - isLeftSideOpen: boolean; - leftSideCanBeClosed: boolean; -}; - -export default class DefaultDeedTypesDashboard extends React.Component { - private onWindowResize = () => {}; - public static defaultProps: Partial = { - hasBackArrow: false, - }; - - public constructor(props: IProps) { - super(props); - this.state = { - deedTypes: null, - isLeftSideOpen: false, - leftSideCanBeClosed: typeof window !== "undefined" ? window.innerWidth < 1024 : false, - }; - this.onOpenLeftSide = this.onOpenLeftSide.bind(this); - this.onCloseLeftSide = this.onCloseLeftSide.bind(this); - } - - public override render(): JSX.Element { - return ( -
-
-
- {this.state.isLeftSideOpen &&
} -
- {this.state.deedTypes && ( - - )} -
-
- open side menu -
- -
- {this.props.hasBackArrow && ( -
- -
- )} - {this.props.mobileBackText && ( -
- -
- )} - {this.props.children} -
-
- -
- ); - } - - public override async componentDidMount() { - this.onWindowResize = WindowStore.getInstance().onResize((window) => this.onResize(window)); +export default function DefaultDeedTypeDashboard(props: IProps) { + const [deedTypes, setDeedTypes] = React.useState(null); + const router = useRouter(); + const { deedTypeUid } = router.query; + useEffect(() => { const query: IGetDeedTypesParams = { where: { archived_at: null, @@ -96,28 +23,32 @@ export default class DefaultDeedTypesDashboard extends React.Component setDeedTypes(deedTypes)); + }, []); - public override componentWillUnmount() { - this.onWindowResize(); - } + const onSelectedBlock = (block: IBlock) => { + router.push(Module.getInstance().get().modules.pages.DeedTypes.pages.DeedTypesInformations.props.path.replace("[uid]", block.id)); + }; - private onOpenLeftSide() { - this.setState({ isLeftSideOpen: true }); - } - - private onCloseLeftSide() { - if (!this.state.leftSideCanBeClosed) return; - this.setState({ isLeftSideOpen: false }); - } - - private onResize(window: Window) { - if (window.innerWidth > 1023) { - if (!this.state.leftSideCanBeClosed) return; - this.setState({ leftSideCanBeClosed: false }); - } - this.setState({ leftSideCanBeClosed: true }); - } + return ( + ({ + id: deedTypes.uid!, + primaryText: deedTypes.name, + isActive: deedTypes.uid === deedTypeUid, + })) + : [] + } + bottomButton={{ + link: Module.getInstance().get().modules.pages.DeedTypes.pages.Create.props.path, + text: "Créer une liste de pièces", + }} + /> + ); } diff --git a/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/DocumentTypeListContainer/classes.module.scss b/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/DocumentTypeListContainer/classes.module.scss deleted file mode 100644 index f6b183e8..00000000 --- a/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/DocumentTypeListContainer/classes.module.scss +++ /dev/null @@ -1,30 +0,0 @@ -@import "@Themes/constants.scss"; - -.root { - display: flex; - flex-direction: column; - justify-content: space-between; - - position: relative; - .header { - flex: 1; - } - - .searchbar { - padding: 40px 24px 24px 24px; - } - - .folderlist-container { - max-height: calc(100vh - 290px); - height: calc(100vh - 290px); - overflow: auto; - border-right: 1px solid var(--color-neutral-200); - } - - .create-container { - position: absolute; - bottom: 0; - left: 0; - right: 0; - } -} diff --git a/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/DocumentTypeListContainer/index.tsx b/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/DocumentTypeListContainer/index.tsx deleted file mode 100644 index da7fb26f..00000000 --- a/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/DocumentTypeListContainer/index.tsx +++ /dev/null @@ -1,48 +0,0 @@ -import Module from "@Front/Config/Module"; -import { DocumentType } from "le-coffre-resources/dist/SuperAdmin"; -import { useRouter } from "next/router"; -import React, { useCallback } from "react"; - -import classes from "./classes.module.scss"; -import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; -import SearchBlockList from "@Front/Components/DesignSystem/SearchBlockList"; - -type IProps = { - documentTypes: DocumentType[]; - onSelectedDocumentType?: (documentType: DocumentType) => void; - onCloseLeftSide?: () => void; -}; - -export default function DocumentTypeListContainer(props: IProps) { - const router = useRouter(); - - const { documentTypeUid } = router.query; - - const onSelectedBlock = useCallback( - (block: IBlock) => { - props.onCloseLeftSide && props.onCloseLeftSide(); - const redirectPath = Module.getInstance().get().modules.pages.DocumentTypes.pages.DocumentTypesInformations.props.path; - router.push(redirectPath.replace("[uid]", block.id)); - }, - [props, router], - ); - - return ( -
- { - return { - primaryText: documentType.name, - id: documentType.uid!, - isActive: documentType.uid === documentTypeUid, - }; - })} - onSelectedBlock={onSelectedBlock} - bottomButton={{ - link: Module.getInstance().get().modules.pages.DocumentTypes.pages.Create.props.path, - text: "Créer un type de document", - }} - /> -
- ); -} diff --git a/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/classes.module.scss b/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/classes.module.scss deleted file mode 100644 index f54563dd..00000000 --- a/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/classes.module.scss +++ /dev/null @@ -1,116 +0,0 @@ -@import "@Themes/constants.scss"; - -@keyframes growWidth { - 0% { - width: 100%; - } - - 100% { - width: 200%; - } -} - -.root { - .content { - display: flex; - overflow: hidden; - height: calc(100vh - var(--header-height)); - - .overlay { - position: absolute; - width: 100%; - height: 100%; - background-color: var(--color-generic-white); - opacity: 0.5; - z-index: 2; - transition: all 0.3s $custom-easing; - } - - .left-side { - background-color: var(--color-generic-white); - z-index: 3; - display: flex; - width: 336px; - min-width: 336px; - transition: all 0.3s $custom-easing; - overflow: hidden; - - @media (max-width: ($screen-m - 1px)) { - width: 56px; - min-width: 56px; - transform: translateX(-389px); - - &.opened { - transform: translateX(0px); - width: 336px; - min-width: 336px; - } - } - - @media (max-width: $screen-s) { - width: 0px; - min-width: 0px; - - &.opened { - width: 100vw; - min-width: 100vw; - } - } - } - - .closable-left-side { - position: absolute; - background-color: var(--color-generic-white); - z-index: 0; - display: flex; - justify-content: center; - min-width: 56px; - max-width: 56px; - height: calc(100vh - var(--header-height)); - border-right: 1px var(--color-neutral-200) solid; - - @media (min-width: $screen-m) { - display: none; - } - - .chevron-icon { - margin-top: 21px; - transform: rotate(180deg); - cursor: pointer; - } - - @media (max-width: $screen-s) { - display: none; - } - } - - .right-side { - min-width: calc(100vw - 389px); - padding: 24px; - overflow-y: auto; - - @media (max-width: ($screen-m - 1px)) { - min-width: calc(100vw - 56px); - } - - @media (max-width: $screen-s) { - flex: 1; - min-width: unset; - } - - .back-arrow-mobile { - display: none; - @media (max-width: $screen-s) { - display: block; - margin-bottom: 24px; - } - } - - .back-arrow-desktop { - @media (max-width: $screen-s) { - display: none; - } - } - } - } -} diff --git a/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/index.tsx index 584f0b58..451c1985 100644 --- a/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultDocumentTypesDashboard/index.tsx @@ -1,124 +1,57 @@ -import ChevronIcon from "@Assets/Icons/chevron.svg"; -import DocumentTypes from "@Front/Api/LeCoffreApi/Notary/DocumentTypes/DocumentTypes"; -import Button, { EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button"; -import Header from "@Front/Components/DesignSystem/Header"; -import Version from "@Front/Components/DesignSystem/Version"; -import BackArrow from "@Front/Components/Elements/BackArrow"; +import React, { useEffect } from "react"; + +import { useRouter } from "next/router"; +import Module from "@Front/Config/Module"; +import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; +import DefaultDashboardWithList, { IPropsDashboardWithList } from "../DefaultDashboardWithList"; import JwtService from "@Front/Services/JwtService/JwtService"; -import WindowStore from "@Front/Stores/WindowStore"; -import classNames from "classnames"; +import DocumentTypes from "@Front/Api/LeCoffreApi/Notary/DocumentTypes/DocumentTypes"; import { DocumentType } from "le-coffre-resources/dist/Notary"; -import Image from "next/image"; -import React, { ReactNode } from "react"; -import classes from "./classes.module.scss"; -import DocumentTypeListContainer from "./DocumentTypeListContainer"; -import { ChevronLeftIcon } from "@heroicons/react/24/solid"; +type IProps = IPropsDashboardWithList; -type IProps = { - title: string; - children?: ReactNode; - onSelectedDocumentType: (documentType: DocumentType) => void; - hasBackArrow: boolean; - backArrowUrl?: string; - mobileBackText?: string; -}; -type IState = { - documentTypes: DocumentType[] | null; - isLeftSideOpen: boolean; - leftSideCanBeClosed: boolean; -}; - -export default class DefaultDocumentTypesDashboard extends React.Component { - private onWindowResize = () => {}; - public static defaultProps: Partial = { - hasBackArrow: false, - }; - - public constructor(props: IProps) { - super(props); - this.state = { - documentTypes: null, - isLeftSideOpen: false, - leftSideCanBeClosed: typeof window !== "undefined" ? window.innerWidth < 1024 : false, - }; - this.onOpenLeftSide = this.onOpenLeftSide.bind(this); - this.onCloseLeftSide = this.onCloseLeftSide.bind(this); - } - - public override render(): JSX.Element { - return ( -
-
-
- {this.state.isLeftSideOpen &&
} -
- {this.state.documentTypes && ( - - )} -
-
- open side menu -
- -
- {this.props.hasBackArrow && ( -
- -
- )} - {this.props.mobileBackText && ( -
- -
- )} - {this.props.children} -
-
- -
- ); - } - - public override async componentDidMount() { - this.onWindowResize = WindowStore.getInstance().onResize((window) => this.onResize(window)); +export default function DefaultDocumentTypeDashboard(props: IProps) { + const [documentTypes, setDocumentTypes] = React.useState(null); + const router = useRouter(); + const { documentTypeUid } = router.query; + useEffect(() => { const jwt = JwtService.getInstance().decodeJwt(); if (!jwt) return; - const documentTypes = await DocumentTypes.getInstance().get({ - where: { - office_uid: jwt.office_Id, - }, - orderBy: { - name: "asc", - }, - }); - this.setState({ documentTypes }); - } + DocumentTypes.getInstance() + .get({ + where: { + office_uid: jwt.office_Id, + }, + orderBy: { + name: "asc", + }, + }) + .then((documentTypes) => setDocumentTypes(documentTypes)); + }, []); - public override componentWillUnmount() { - this.onWindowResize(); - } + const onSelectedBlock = (block: IBlock) => { + router.push( + Module.getInstance().get().modules.pages.DocumentTypes.pages.DocumentTypesInformations.props.path.replace("[uid]", block.id), + ); + }; - private onOpenLeftSide() { - this.setState({ isLeftSideOpen: true }); - } - - private onCloseLeftSide() { - if (!this.state.leftSideCanBeClosed) return; - this.setState({ isLeftSideOpen: false }); - } - - private onResize(window: Window) { - if (window.innerWidth > 1023) { - if (!this.state.leftSideCanBeClosed) return; - this.setState({ leftSideCanBeClosed: false }); - } - this.setState({ leftSideCanBeClosed: true }); - } + return ( + ({ + id: documentType.uid!, + primaryText: documentType.name, + isActive: documentType.uid === documentTypeUid, + })) + : [] + } + bottomButton={{ + link: Module.getInstance().get().modules.pages.DocumentTypes.pages.Create.props.path, + text: "Créer un type de document", + }} + /> + ); } diff --git a/src/front/Components/LayoutTemplates/DefaultOfficeDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultOfficeDashboard/index.tsx index 0cdeaf38..f3a5a2f6 100644 --- a/src/front/Components/LayoutTemplates/DefaultOfficeDashboard/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultOfficeDashboard/index.tsx @@ -27,7 +27,7 @@ export default function DefaultOfficeDashboard(props: IProps) { ({ id: office.uid!, diff --git a/src/front/Components/LayoutTemplates/DefaultRoleDashboard/RoleListContainer/classes.module.scss b/src/front/Components/LayoutTemplates/DefaultRoleDashboard/RoleListContainer/classes.module.scss deleted file mode 100644 index 3cc8b688..00000000 --- a/src/front/Components/LayoutTemplates/DefaultRoleDashboard/RoleListContainer/classes.module.scss +++ /dev/null @@ -1,32 +0,0 @@ -@import "@Themes/constants.scss"; - -.root { - width: calc(100vh - 83px); - display: flex; - flex-direction: column; - justify-content: space-between; - - position: relative; - - .header { - flex: 1; - } - - .searchbar { - padding: 40px 24px 24px 24px; - } - - .folderlist-container { - max-height: calc(100vh - 215px); - height: calc(100vh - 215px); - overflow: auto; - border-right: 1px solid var(--color-neutral-200); - } - - .create-container { - position: absolute; - bottom: 0; - left: 0; - right: 0; - } -} diff --git a/src/front/Components/LayoutTemplates/DefaultRoleDashboard/RoleListContainer/index.tsx b/src/front/Components/LayoutTemplates/DefaultRoleDashboard/RoleListContainer/index.tsx deleted file mode 100644 index b02309c9..00000000 --- a/src/front/Components/LayoutTemplates/DefaultRoleDashboard/RoleListContainer/index.tsx +++ /dev/null @@ -1,53 +0,0 @@ -import Module from "@Front/Config/Module"; -import { OfficeRole } from "le-coffre-resources/dist/Admin"; -import { useRouter } from "next/router"; -import React, { useCallback } from "react"; - -import classes from "./classes.module.scss"; -import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; -import SearchBlockList from "@Front/Components/DesignSystem/SearchBlockList"; - -type IProps = { - roles: OfficeRole[]; - onSelectedRole?: (role: OfficeRole) => void; - onCloseLeftSide?: () => void; -}; - -export default function RoleListContainer(props: IProps) { - const router = useRouter(); - - const { roleUid } = router.query; - - const onSelectedBlock = useCallback( - (block: IBlock) => { - props.onCloseLeftSide && props.onCloseLeftSide(); - const redirectPath = Module.getInstance().get().modules.pages.Roles.pages.RolesInformations.props.path; - router.push(redirectPath.replace("[uid]", block.id)); - }, - [props, router], - ); - - return ( -
- { - if (role.name === "admin") return false; - return true; - }) - .map((role) => { - return { - primaryText: role.name, - id: role.uid!, - isActive: role.uid === roleUid, - }; - })} - onSelectedBlock={onSelectedBlock} - bottomButton={{ - link: Module.getInstance().get().modules.pages.Roles.pages.Create.props.path, - text: "Créer un rôle", - }} - /> -
- ); -} diff --git a/src/front/Components/LayoutTemplates/DefaultRoleDashboard/classes.module.scss b/src/front/Components/LayoutTemplates/DefaultRoleDashboard/classes.module.scss deleted file mode 100644 index f54563dd..00000000 --- a/src/front/Components/LayoutTemplates/DefaultRoleDashboard/classes.module.scss +++ /dev/null @@ -1,116 +0,0 @@ -@import "@Themes/constants.scss"; - -@keyframes growWidth { - 0% { - width: 100%; - } - - 100% { - width: 200%; - } -} - -.root { - .content { - display: flex; - overflow: hidden; - height: calc(100vh - var(--header-height)); - - .overlay { - position: absolute; - width: 100%; - height: 100%; - background-color: var(--color-generic-white); - opacity: 0.5; - z-index: 2; - transition: all 0.3s $custom-easing; - } - - .left-side { - background-color: var(--color-generic-white); - z-index: 3; - display: flex; - width: 336px; - min-width: 336px; - transition: all 0.3s $custom-easing; - overflow: hidden; - - @media (max-width: ($screen-m - 1px)) { - width: 56px; - min-width: 56px; - transform: translateX(-389px); - - &.opened { - transform: translateX(0px); - width: 336px; - min-width: 336px; - } - } - - @media (max-width: $screen-s) { - width: 0px; - min-width: 0px; - - &.opened { - width: 100vw; - min-width: 100vw; - } - } - } - - .closable-left-side { - position: absolute; - background-color: var(--color-generic-white); - z-index: 0; - display: flex; - justify-content: center; - min-width: 56px; - max-width: 56px; - height: calc(100vh - var(--header-height)); - border-right: 1px var(--color-neutral-200) solid; - - @media (min-width: $screen-m) { - display: none; - } - - .chevron-icon { - margin-top: 21px; - transform: rotate(180deg); - cursor: pointer; - } - - @media (max-width: $screen-s) { - display: none; - } - } - - .right-side { - min-width: calc(100vw - 389px); - padding: 24px; - overflow-y: auto; - - @media (max-width: ($screen-m - 1px)) { - min-width: calc(100vw - 56px); - } - - @media (max-width: $screen-s) { - flex: 1; - min-width: unset; - } - - .back-arrow-mobile { - display: none; - @media (max-width: $screen-s) { - display: block; - margin-bottom: 24px; - } - } - - .back-arrow-desktop { - @media (max-width: $screen-s) { - display: none; - } - } - } - } -} diff --git a/src/front/Components/LayoutTemplates/DefaultRoleDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultRoleDashboard/index.tsx index 86a971ce..cadc71a3 100644 --- a/src/front/Components/LayoutTemplates/DefaultRoleDashboard/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultRoleDashboard/index.tsx @@ -1,117 +1,49 @@ -import ChevronIcon from "@Assets/Icons/chevron.svg"; +import React, { useEffect } from "react"; + +import { useRouter } from "next/router"; +import Module from "@Front/Config/Module"; +import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; +import DefaultDashboardWithList, { IPropsDashboardWithList } from "../DefaultDashboardWithList"; +import { OfficeRole } from "le-coffre-resources/dist/Notary"; import OfficeRoles, { IGetRolesParams } from "@Front/Api/LeCoffreApi/Admin/OfficeRoles/OfficeRoles"; -import Button, { EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button"; -import Header from "@Front/Components/DesignSystem/Header"; -import Version from "@Front/Components/DesignSystem/Version"; -import BackArrow from "@Front/Components/Elements/BackArrow"; -import WindowStore from "@Front/Stores/WindowStore"; -import classNames from "classnames"; -import { OfficeRole } from "le-coffre-resources/dist/Admin"; -import Image from "next/image"; -import React, { ReactNode } from "react"; -import classes from "./classes.module.scss"; -import RoleListContainer from "./RoleListContainer"; -import { ChevronLeftIcon } from "@heroicons/react/24/outline"; +type IProps = IPropsDashboardWithList; -type IProps = { - title: string; - children?: ReactNode; - onSelectedRole: (role: OfficeRole) => void; - hasBackArrow: boolean; - backArrowUrl?: string; - mobileBackText?: string; -}; -type IState = { - roles: OfficeRole[] | null; - isLeftSideOpen: boolean; - leftSideCanBeClosed: boolean; -}; - -export default class DefaultRoleDashboard extends React.Component { - private onWindowResize = () => {}; - public static defaultProps: Partial = { - hasBackArrow: false, - }; - - public constructor(props: IProps) { - super(props); - this.state = { - roles: null, - isLeftSideOpen: false, - leftSideCanBeClosed: typeof window !== "undefined" ? window.innerWidth < 1024 : false, - }; - this.onOpenLeftSide = this.onOpenLeftSide.bind(this); - this.onCloseLeftSide = this.onCloseLeftSide.bind(this); - } - - public override render(): JSX.Element { - return ( -
-
-
- {this.state.isLeftSideOpen &&
} -
- {this.state.roles && } -
-
- open side menu -
- -
- {this.props.hasBackArrow && ( -
- -
- )} - {this.props.mobileBackText && ( -
- -
- )} - {this.props.children} -
-
- -
- ); - } - - public override async componentDidMount() { - this.onWindowResize = WindowStore.getInstance().onResize((window) => this.onResize(window)); +export default function DefaultRoleDashboard(props: IProps) { + const [roles, setRoles] = React.useState(null); + const router = useRouter(); + const { roleUid } = router.query; + useEffect(() => { const query: IGetRolesParams = { include: { rules: true }, }; - const roles = await OfficeRoles.getInstance().get(query); + OfficeRoles.getInstance() + .get(query) + .then((roles) => setRoles(roles)); + }, []); - this.setState({ roles }); - } + const onSelectedBlock = (block: IBlock) => { + router.push(Module.getInstance().get().modules.pages.Roles.pages.RolesInformations.props.path.replace("[uid]", block.id)); + }; - public override componentWillUnmount() { - this.onWindowResize(); - } - - private onOpenLeftSide() { - this.setState({ isLeftSideOpen: true }); - } - - private onCloseLeftSide() { - if (!this.state.leftSideCanBeClosed) return; - this.setState({ isLeftSideOpen: false }); - } - - private onResize(window: Window) { - if (window.innerWidth > 1023) { - if (!this.state.leftSideCanBeClosed) return; - this.setState({ leftSideCanBeClosed: false }); - } - this.setState({ leftSideCanBeClosed: true }); - } + return ( + ({ + id: role.uid!, + primaryText: role.name, + isActive: role.uid === roleUid, + })) + : [] + } + bottomButton={{ + link: Module.getInstance().get().modules.pages.Roles.pages.Create.props.path, + text: "Créer un rôle", + }} + /> + ); } diff --git a/src/front/Components/LayoutTemplates/DefaultUserDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultUserDashboard/index.tsx index e3b97389..d5643677 100644 --- a/src/front/Components/LayoutTemplates/DefaultUserDashboard/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultUserDashboard/index.tsx @@ -31,7 +31,7 @@ export default function DefaultUserDashboard(props: IProps) { ({ id: user.uid!, From c707910f8dc97c0f3582487e8ebad5181e74f80d Mon Sep 17 00:00:00 2001 From: Maxime Lalo Date: Mon, 29 Jul 2024 12:05:02 +0200 Subject: [PATCH 2/7] :sparkles: Notary dashboard in conformity --- .../FolderListContainer/classes.module.scss | 7 -- .../FolderListContainer/index.tsx | 87 ----------------- .../DefaultDashboardWithList/index.tsx | 1 - .../classes.module.scss | 23 ----- .../DefaultNotaryDashboard/index.tsx | 95 ++++++++++++++----- 5 files changed, 72 insertions(+), 141 deletions(-) delete mode 100644 src/front/Components/DesignSystem/FolderListContainer/classes.module.scss delete mode 100644 src/front/Components/DesignSystem/FolderListContainer/index.tsx delete mode 100644 src/front/Components/LayoutTemplates/DefaultNotaryDashboard/classes.module.scss diff --git a/src/front/Components/DesignSystem/FolderListContainer/classes.module.scss b/src/front/Components/DesignSystem/FolderListContainer/classes.module.scss deleted file mode 100644 index 560b12a5..00000000 --- a/src/front/Components/DesignSystem/FolderListContainer/classes.module.scss +++ /dev/null @@ -1,7 +0,0 @@ -@import "@Themes/constants.scss"; - -.root { - display: flex; - flex-direction: column; - justify-content: space-between; -} diff --git a/src/front/Components/DesignSystem/FolderListContainer/index.tsx b/src/front/Components/DesignSystem/FolderListContainer/index.tsx deleted file mode 100644 index 188bcfd6..00000000 --- a/src/front/Components/DesignSystem/FolderListContainer/index.tsx +++ /dev/null @@ -1,87 +0,0 @@ -import Module from "@Front/Config/Module"; -import { OfficeFolder } from "le-coffre-resources/dist/Notary"; -import { EDocumentStatus } from "le-coffre-resources/dist/Notary/Document"; -import { useRouter } from "next/router"; -import React, { useCallback, useEffect } from "react"; - -import classes from "./classes.module.scss"; -import { IBlock } from "../SearchBlockList/BlockList/Block"; -import SearchBlockList from "../SearchBlockList"; - -type IProps = { - folders: OfficeFolder[]; - isArchived: boolean; -}; - -export default function FolderListContainer(props: IProps) { - const router = useRouter(); - const { folderUid } = router.query; - const { folders, isArchived } = props; - - const redirectPath: string = isArchived - ? Module.getInstance().get().modules.pages.Folder.pages.FolderArchived.pages.FolderInformation.props.path - : Module.getInstance().get().modules.pages.Folder.pages.FolderInformation.props.path; - - const getBlocks = useCallback( - (folders: OfficeFolder[]): IBlock[] => { - const pendingFolders = folders - .filter((folder) => { - const pendingDocuments = (folder.documents ?? []).filter( - (document) => document.document_status === EDocumentStatus.DEPOSITED, - ); - return pendingDocuments.length >= 1; - }) - .sort((folder1, folder2) => { - return folder1.created_at! > folder2.created_at! ? -1 : 1; - }); - - const otherFolders = folders - .filter((folder) => { - const pendingDocuments = (folder.documents ?? []).filter( - (document) => document.document_status === EDocumentStatus.DEPOSITED, - ); - return pendingDocuments.length === 0; - }) - .sort((folder1, folder2) => { - return folder1.created_at! > folder2.created_at! ? -1 : 1; - }); - - return [...pendingFolders, ...otherFolders].map((folder) => { - return { - id: folder.uid!, - primaryText: folder.name, - secondaryText: folder.folder_number, - isActive: folderUid === folder.uid, - showAlert: folder.documents?.some((document) => document.document_status === EDocumentStatus.DEPOSITED), - }; - }); - }, - [folderUid], - ); - - const [blocks, setBlocks] = React.useState(getBlocks(folders)); - - const onSelectedFolder = (block: IBlock) => { - const folder = folders.find((folder) => folder.uid === block.id); - if (!folder) return; - const path = redirectPath.replace("[folderUid]", folder.uid ?? ""); - router.push(path); - }; - - useEffect(() => { - setBlocks(getBlocks(folders)); - }, [folders, getBlocks]); - - return ( -
- -
- ); -} diff --git a/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx b/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx index 3f3bd44a..91919c77 100644 --- a/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx @@ -9,7 +9,6 @@ import SearchBlockList, { ISearchBlockListProps } from "@Front/Components/Design export type IPropsDashboardWithList = { title?: string; children?: ReactNode; - isArchived?: boolean; hasBackArrow?: boolean; backArrowUrl?: string; mobileBackText?: string; diff --git a/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/classes.module.scss b/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/classes.module.scss deleted file mode 100644 index 882a9394..00000000 --- a/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/classes.module.scss +++ /dev/null @@ -1,23 +0,0 @@ -@import "@Themes/constants.scss"; - -.root { - position: relative; - .content { - display: flex; - justify-content: flex-start; - height: calc(100vh - var(--header-height)); - - @media (max-width: $screen-m) { - flex-direction: column; - } - .right-side { - min-width: calc(100% - 336px); - overflow-y: auto; - padding: var(--spacing-lg, 24px); - - @media (max-width: $screen-m) { - width: 100%; - } - } - } -} diff --git a/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx index 3b3a383b..a65da789 100644 --- a/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx @@ -1,13 +1,13 @@ import Folders, { IGetFoldersParams } from "@Front/Api/LeCoffreApi/Notary/Folders/Folders"; -import FolderListContainer from "@Front/Components/DesignSystem/FolderListContainer"; -import Header from "@Front/Components/DesignSystem/Header"; -import Version from "@Front/Components/DesignSystem/Version"; -import BackArrow from "@Front/Components/Elements/BackArrow"; import EFolderStatus from "le-coffre-resources/dist/Customer/EFolderStatus"; import { OfficeFolder } from "le-coffre-resources/dist/Notary"; -import React, { ReactNode, useEffect } from "react"; +import React, { ReactNode, useCallback, useEffect } from "react"; +import { EDocumentStatus } from "le-coffre-resources/dist/Notary/Document"; -import classes from "./classes.module.scss"; +import Module from "@Front/Config/Module"; +import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; +import { useRouter } from "next/router"; +import DefaultDashboardWithList from "../DefaultDashboardWithList"; type IProps = { title: string; @@ -19,9 +19,64 @@ type IProps = { }; export default function DefaultNotaryDashboard(props: IProps) { - const { hasBackArrow, backArrowUrl, children, isArchived } = props; - + const { isArchived } = props; + const router = useRouter(); const [folders, setFolders] = React.useState([]); + const { folderUid } = router.query; + + const redirectPath: string = isArchived + ? Module.getInstance().get().modules.pages.Folder.pages.FolderArchived.pages.FolderInformation.props.path + : Module.getInstance().get().modules.pages.Folder.pages.FolderInformation.props.path; + + const getBlocks = useCallback( + (folders: OfficeFolder[]): IBlock[] => { + const pendingFolders = folders + .filter((folder) => { + const pendingDocuments = (folder.documents ?? []).filter( + (document) => document.document_status === EDocumentStatus.DEPOSITED, + ); + return pendingDocuments.length >= 1; + }) + .sort((folder1, folder2) => { + return folder1.created_at! > folder2.created_at! ? -1 : 1; + }); + + const otherFolders = folders + .filter((folder) => { + const pendingDocuments = (folder.documents ?? []).filter( + (document) => document.document_status === EDocumentStatus.DEPOSITED, + ); + return pendingDocuments.length === 0; + }) + .sort((folder1, folder2) => { + return folder1.created_at! > folder2.created_at! ? -1 : 1; + }); + + return [...pendingFolders, ...otherFolders].map((folder) => { + return { + id: folder.uid!, + primaryText: folder.name, + secondaryText: folder.folder_number, + isActive: folderUid === folder.uid, + showAlert: folder.documents?.some((document) => document.document_status === EDocumentStatus.DEPOSITED), + }; + }); + }, + [folderUid], + ); + + const [blocks, setBlocks] = React.useState(getBlocks(folders)); + + const onSelectedBlock = (block: IBlock) => { + const folder = folders.find((folder) => folder.uid === block.id); + if (!folder) return; + const path = redirectPath.replace("[folderUid]", folder.uid ?? ""); + router.push(path); + }; + + useEffect(() => { + setBlocks(getBlocks(folders)); + }, [folders, getBlocks]); useEffect(() => { let targetedStatus: EFolderStatus = EFolderStatus["LIVE" as keyof typeof EFolderStatus]; @@ -63,20 +118,14 @@ export default function DefaultNotaryDashboard(props: IProps) { }, [isArchived]); return ( -
-
-
- -
- {hasBackArrow && ( -
- -
- )} - {children} -
-
- -
+ ); } From 4ec6e40fa2c1b3c7febc8cc6bc409478ee8d7616 Mon Sep 17 00:00:00 2001 From: Maxime Lalo Date: Mon, 29 Jul 2024 12:26:04 +0200 Subject: [PATCH 3/7] :sparkles: Legal pages working --- .../classes.module.scss | 4 ++ .../DefaultDashboardWithList/index.tsx | 14 +++- .../DefaultLegalDashboard/index.tsx | 64 +++++++++++++++++++ .../DefaultNotaryDashboard/index.tsx | 13 ++-- .../LegalInformations/classes.module.scss | 31 +++++++++ .../Layouts/Legal/LegalInformations/index.tsx | 23 +++++++ .../Layouts/Legal/classes.module.scss | 17 +++++ src/front/Components/Layouts/Legal/index.tsx | 26 ++++++++ src/front/Config/Module/development.json | 16 +++++ src/front/Config/Module/preprod.json | 16 +++++ src/front/Config/Module/production.json | 16 +++++ src/front/Config/Module/staging.json | 16 +++++ src/pages/legal/[legalUid]/index.tsx | 5 ++ src/pages/legal/index.tsx | 5 ++ 14 files changed, 255 insertions(+), 11 deletions(-) create mode 100644 src/front/Components/LayoutTemplates/DefaultLegalDashboard/index.tsx create mode 100644 src/front/Components/Layouts/Legal/LegalInformations/classes.module.scss create mode 100644 src/front/Components/Layouts/Legal/LegalInformations/index.tsx create mode 100644 src/front/Components/Layouts/Legal/classes.module.scss create mode 100644 src/front/Components/Layouts/Legal/index.tsx create mode 100644 src/pages/legal/[legalUid]/index.tsx create mode 100644 src/pages/legal/index.tsx diff --git a/src/front/Components/LayoutTemplates/DefaultDashboardWithList/classes.module.scss b/src/front/Components/LayoutTemplates/DefaultDashboardWithList/classes.module.scss index 882a9394..1f508b61 100644 --- a/src/front/Components/LayoutTemplates/DefaultDashboardWithList/classes.module.scss +++ b/src/front/Components/LayoutTemplates/DefaultDashboardWithList/classes.module.scss @@ -15,6 +15,10 @@ overflow-y: auto; padding: var(--spacing-lg, 24px); + &[data-no-padding] { + padding: 0; + } + @media (max-width: $screen-m) { width: 100%; } diff --git a/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx b/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx index 91919c77..84d8e187 100644 --- a/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultDashboardWithList/index.tsx @@ -13,19 +13,29 @@ export type IPropsDashboardWithList = { backArrowUrl?: string; mobileBackText?: string; headerConnected?: boolean; + noPadding?: boolean; }; type IProps = IPropsDashboardWithList & ISearchBlockListProps; export default function DefaultDashboardWithList(props: IProps) { - const { hasBackArrow, backArrowUrl, children, blocks, onSelectedBlock, headerConnected = true, bottomButton } = props; + const { + hasBackArrow, + backArrowUrl, + children, + blocks, + onSelectedBlock, + headerConnected = true, + bottomButton, + noPadding = false, + } = props; return (
-
+
{hasBackArrow && (
diff --git a/src/front/Components/LayoutTemplates/DefaultLegalDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultLegalDashboard/index.tsx new file mode 100644 index 00000000..080ea25f --- /dev/null +++ b/src/front/Components/LayoutTemplates/DefaultLegalDashboard/index.tsx @@ -0,0 +1,64 @@ +import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; +import { useRouter } from "next/router"; +import DefaultDashboardWithList, { IPropsDashboardWithList } from "../DefaultDashboardWithList"; +import { useMemo } from "react"; +import Module from "@Front/Config/Module"; + +type IProps = IPropsDashboardWithList; + +export enum ELegalOptions { + LEGAL_MENTIONS = "mentions-legales", + CGU = "cgu", + CGS = "cgs", + POLITIQUE_DE_CONFIDENTIALITE = "politique-de-confidentialite", + POLITIQUE_DE_GESTION_DES_COOKIES = "politique-de-gestion-des-cookies", +} + +export default function DefaultLegalDashboard(props: IProps) { + const router = useRouter(); + const { legalUid } = router.query; + + const onSelectedBlock = (block: IBlock) => { + router.push(Module.getInstance().get().modules.pages.Legal.pages.LegalInformations.props.path.replace("[legalUid]", block.id)); + }; + + const blocks: IBlock[] = useMemo( + () => [ + { + id: ELegalOptions.LEGAL_MENTIONS, + primaryText: "Mentions légales", + isActive: legalUid === ELegalOptions.LEGAL_MENTIONS, + }, + { + id: ELegalOptions.CGU, + primaryText: "CGU", + isActive: legalUid === ELegalOptions.CGU, + }, + { + id: ELegalOptions.CGS, + primaryText: "CGS", + isActive: legalUid === ELegalOptions.CGS, + }, + { + id: ELegalOptions.POLITIQUE_DE_CONFIDENTIALITE, + primaryText: "Politique de confidentialité", + isActive: legalUid === ELegalOptions.POLITIQUE_DE_CONFIDENTIALITE, + }, + { + id: ELegalOptions.POLITIQUE_DE_GESTION_DES_COOKIES, + primaryText: "Politique de gestion des cookies", + isActive: legalUid === ELegalOptions.POLITIQUE_DE_GESTION_DES_COOKIES, + }, + ], + [legalUid], + ); + + if (!legalUid) { + router.push( + Module.getInstance() + .get() + .modules.pages.Legal.pages.LegalInformations.props.path.replace("[legalUid]", ELegalOptions.LEGAL_MENTIONS), + ); + } + return ; +} diff --git a/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx index a65da789..190dc803 100644 --- a/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx @@ -1,21 +1,16 @@ import Folders, { IGetFoldersParams } from "@Front/Api/LeCoffreApi/Notary/Folders/Folders"; import EFolderStatus from "le-coffre-resources/dist/Customer/EFolderStatus"; import { OfficeFolder } from "le-coffre-resources/dist/Notary"; -import React, { ReactNode, useCallback, useEffect } from "react"; +import React, { useCallback, useEffect } from "react"; import { EDocumentStatus } from "le-coffre-resources/dist/Notary/Document"; import Module from "@Front/Config/Module"; import { IBlock } from "@Front/Components/DesignSystem/SearchBlockList/BlockList/Block"; import { useRouter } from "next/router"; -import DefaultDashboardWithList from "../DefaultDashboardWithList"; +import DefaultDashboardWithList, { IPropsDashboardWithList } from "../DefaultDashboardWithList"; -type IProps = { - title: string; - children?: ReactNode; - isArchived?: boolean; - hasBackArrow?: boolean; - backArrowUrl?: string; - mobileBackText?: string; +type IProps = IPropsDashboardWithList & { + isArchived: boolean; }; export default function DefaultNotaryDashboard(props: IProps) { diff --git a/src/front/Components/Layouts/Legal/LegalInformations/classes.module.scss b/src/front/Components/Layouts/Legal/LegalInformations/classes.module.scss new file mode 100644 index 00000000..2eb0753b --- /dev/null +++ b/src/front/Components/Layouts/Legal/LegalInformations/classes.module.scss @@ -0,0 +1,31 @@ +@import "@Themes/constants.scss"; + +.root { + .subtitle { + margin-top: 32px; + } + + .rights-container { + margin-top: 32px; + padding: 32px 16px; + border: 1px solid gray; + .select-all-container { + margin-top: 32px; + } + + .rights { + margin-top: 32px; + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 32px; + + @media (max-width: $screen-m) { + grid-template-columns: 1fr; + } + } + + .save-container { + margin-top: 32px; + } + } +} diff --git a/src/front/Components/Layouts/Legal/LegalInformations/index.tsx b/src/front/Components/Layouts/Legal/LegalInformations/index.tsx new file mode 100644 index 00000000..42d7f7ef --- /dev/null +++ b/src/front/Components/Layouts/Legal/LegalInformations/index.tsx @@ -0,0 +1,23 @@ +import { useRouter } from "next/router"; +import React from "react"; + +import DefaultLegalDashboard, { ELegalOptions } from "@Front/Components/LayoutTemplates/DefaultLegalDashboard"; + +const pdfLinks: Record = { + "mentions-legales": "https://s3.fr-par.scw.cloud/lecoffre.io-bucket/footer/mentions_legales.pdf", + "politique-de-confidentialite": "https://s3.fr-par.scw.cloud/lecoffre.io-bucket/footer/politique_confidentialite.pdf", + "politique-de-gestion-des-cookies": "https://s3.fr-par.scw.cloud/lecoffre.io-bucket/footer/politique_cookies.pdf", + cgs: "https://s3.fr-par.scw.cloud/lecoffre.io-bucket/footer/cgs.pdf", + cgu: "https://s3.fr-par.scw.cloud/lecoffre.io-bucket/footer/cgu.pdf", +}; + +export default function LegalInformations() { + const router = useRouter(); + let { legalUid } = router.query; + const legalUidTyped = legalUid as ELegalOptions; + return ( + + + + ); +} diff --git a/src/front/Components/Layouts/Legal/classes.module.scss b/src/front/Components/Layouts/Legal/classes.module.scss new file mode 100644 index 00000000..4eca97a6 --- /dev/null +++ b/src/front/Components/Layouts/Legal/classes.module.scss @@ -0,0 +1,17 @@ +@import "@Themes/constants.scss"; + +.root { + display: flex; + align-items: center; + flex-direction: column; + min-height: 100%; + + .no-role-selected { + width: 100%; + + .choose-a-role { + margin-top: 96px; + text-align: center; + } + } +} diff --git a/src/front/Components/Layouts/Legal/index.tsx b/src/front/Components/Layouts/Legal/index.tsx new file mode 100644 index 00000000..1eb64384 --- /dev/null +++ b/src/front/Components/Layouts/Legal/index.tsx @@ -0,0 +1,26 @@ +import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography"; + +import BasePage from "../Base"; +import classes from "./classes.module.scss"; +import DefaultLegalDashboard from "@Front/Components/LayoutTemplates/DefaultLegalDashboard"; + +type IProps = {}; +type IState = {}; +export default class Collaborators extends BasePage { + public override render(): JSX.Element { + return ( + +
+
+ Gestion des pages légales +
+ + Sélectionnez un rôle + +
+
+
+ + ); + } +} diff --git a/src/front/Config/Module/development.json b/src/front/Config/Module/development.json index 20bc04c8..253742bf 100644 --- a/src/front/Config/Module/development.json +++ b/src/front/Config/Module/development.json @@ -390,6 +390,22 @@ } } } + }, + "Legal": { + "enabled": true, + "props": { + "path": "/legal", + "labelKey": "legal" + }, + "pages": { + "LegalInformations": { + "enabled": true, + "props": { + "path": "/legal/[legalUid]", + "labelKey": "legal_informations" + } + } + } } } } diff --git a/src/front/Config/Module/preprod.json b/src/front/Config/Module/preprod.json index 20bc04c8..253742bf 100644 --- a/src/front/Config/Module/preprod.json +++ b/src/front/Config/Module/preprod.json @@ -390,6 +390,22 @@ } } } + }, + "Legal": { + "enabled": true, + "props": { + "path": "/legal", + "labelKey": "legal" + }, + "pages": { + "LegalInformations": { + "enabled": true, + "props": { + "path": "/legal/[legalUid]", + "labelKey": "legal_informations" + } + } + } } } } diff --git a/src/front/Config/Module/production.json b/src/front/Config/Module/production.json index 20bc04c8..253742bf 100644 --- a/src/front/Config/Module/production.json +++ b/src/front/Config/Module/production.json @@ -390,6 +390,22 @@ } } } + }, + "Legal": { + "enabled": true, + "props": { + "path": "/legal", + "labelKey": "legal" + }, + "pages": { + "LegalInformations": { + "enabled": true, + "props": { + "path": "/legal/[legalUid]", + "labelKey": "legal_informations" + } + } + } } } } diff --git a/src/front/Config/Module/staging.json b/src/front/Config/Module/staging.json index 20bc04c8..253742bf 100644 --- a/src/front/Config/Module/staging.json +++ b/src/front/Config/Module/staging.json @@ -390,6 +390,22 @@ } } } + }, + "Legal": { + "enabled": true, + "props": { + "path": "/legal", + "labelKey": "legal" + }, + "pages": { + "LegalInformations": { + "enabled": true, + "props": { + "path": "/legal/[legalUid]", + "labelKey": "legal_informations" + } + } + } } } } diff --git a/src/pages/legal/[legalUid]/index.tsx b/src/pages/legal/[legalUid]/index.tsx new file mode 100644 index 00000000..58da8f23 --- /dev/null +++ b/src/pages/legal/[legalUid]/index.tsx @@ -0,0 +1,5 @@ +import LegalInformations from "@Front/Components/Layouts/Legal/LegalInformations"; + +export default function Route() { + return ; +} diff --git a/src/pages/legal/index.tsx b/src/pages/legal/index.tsx new file mode 100644 index 00000000..fb7e17c9 --- /dev/null +++ b/src/pages/legal/index.tsx @@ -0,0 +1,5 @@ +import Legal from "@Front/Components/Layouts/Legal"; + +export default function Route() { + return ; +} From d01984dd4863337a5b9b50fc2bed9fdb061e204a Mon Sep 17 00:00:00 2001 From: Maxime Lalo Date: Mon, 29 Jul 2024 12:39:46 +0200 Subject: [PATCH 4/7] :sparkles: Legal pages working --- .../DefaultLegalDashboard/index.tsx | 7 --- .../LegalInformations/classes.module.scss | 36 ++++------------ .../Layouts/Legal/LegalInformations/index.tsx | 15 ++++++- .../Layouts/Legal/classes.module.scss | 17 -------- src/front/Components/Layouts/Legal/index.tsx | 43 +++++++++---------- 5 files changed, 41 insertions(+), 77 deletions(-) delete mode 100644 src/front/Components/Layouts/Legal/classes.module.scss diff --git a/src/front/Components/LayoutTemplates/DefaultLegalDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultLegalDashboard/index.tsx index 080ea25f..10a0acd0 100644 --- a/src/front/Components/LayoutTemplates/DefaultLegalDashboard/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultLegalDashboard/index.tsx @@ -53,12 +53,5 @@ export default function DefaultLegalDashboard(props: IProps) { [legalUid], ); - if (!legalUid) { - router.push( - Module.getInstance() - .get() - .modules.pages.Legal.pages.LegalInformations.props.path.replace("[legalUid]", ELegalOptions.LEGAL_MENTIONS), - ); - } return ; } diff --git a/src/front/Components/Layouts/Legal/LegalInformations/classes.module.scss b/src/front/Components/Layouts/Legal/LegalInformations/classes.module.scss index 2eb0753b..351451a0 100644 --- a/src/front/Components/Layouts/Legal/LegalInformations/classes.module.scss +++ b/src/front/Components/Layouts/Legal/LegalInformations/classes.module.scss @@ -1,31 +1,11 @@ -@import "@Themes/constants.scss"; +.pdf-viewer { + width: 100%; + height: 100%; + min-height: 100%; + min-width: 100%; -.root { - .subtitle { - margin-top: 32px; - } - - .rights-container { - margin-top: 32px; - padding: 32px 16px; - border: 1px solid gray; - .select-all-container { - margin-top: 32px; - } - - .rights { - margin-top: 32px; - display: grid; - grid-template-columns: repeat(2, 1fr); - gap: 32px; - - @media (max-width: $screen-m) { - grid-template-columns: 1fr; - } - } - - .save-container { - margin-top: 32px; - } + .no-pdf-text { + padding: 16px; + text-align: center; } } diff --git a/src/front/Components/Layouts/Legal/LegalInformations/index.tsx b/src/front/Components/Layouts/Legal/LegalInformations/index.tsx index 42d7f7ef..b7a6d200 100644 --- a/src/front/Components/Layouts/Legal/LegalInformations/index.tsx +++ b/src/front/Components/Layouts/Legal/LegalInformations/index.tsx @@ -1,7 +1,9 @@ import { useRouter } from "next/router"; import React from "react"; - +import classes from "./classes.module.scss"; import DefaultLegalDashboard, { ELegalOptions } from "@Front/Components/LayoutTemplates/DefaultLegalDashboard"; +import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography"; +import Link from "next/link"; const pdfLinks: Record = { "mentions-legales": "https://s3.fr-par.scw.cloud/lecoffre.io-bucket/footer/mentions_legales.pdf", @@ -17,7 +19,16 @@ export default function LegalInformations() { const legalUidTyped = legalUid as ELegalOptions; return ( - + + + Votre navigateur ne prend pas en charge l'affichage des pdf  + + + cliquez ici pour télécharger le pdf. + + + + ); } diff --git a/src/front/Components/Layouts/Legal/classes.module.scss b/src/front/Components/Layouts/Legal/classes.module.scss deleted file mode 100644 index 4eca97a6..00000000 --- a/src/front/Components/Layouts/Legal/classes.module.scss +++ /dev/null @@ -1,17 +0,0 @@ -@import "@Themes/constants.scss"; - -.root { - display: flex; - align-items: center; - flex-direction: column; - min-height: 100%; - - .no-role-selected { - width: 100%; - - .choose-a-role { - margin-top: 96px; - text-align: center; - } - } -} diff --git a/src/front/Components/Layouts/Legal/index.tsx b/src/front/Components/Layouts/Legal/index.tsx index 1eb64384..f2b9961b 100644 --- a/src/front/Components/Layouts/Legal/index.tsx +++ b/src/front/Components/Layouts/Legal/index.tsx @@ -1,26 +1,23 @@ -import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography"; - -import BasePage from "../Base"; -import classes from "./classes.module.scss"; -import DefaultLegalDashboard from "@Front/Components/LayoutTemplates/DefaultLegalDashboard"; +import DefaultLegalDashboard, { ELegalOptions } from "@Front/Components/LayoutTemplates/DefaultLegalDashboard"; +import { useRouter } from "next/router"; +import Module from "@Front/Config/Module"; +import { useEffect } from "react"; type IProps = {}; -type IState = {}; -export default class Collaborators extends BasePage { - public override render(): JSX.Element { - return ( - -
-
- Gestion des pages légales -
- - Sélectionnez un rôle - -
-
-
- - ); - } + +export default function Legal(props: IProps) { + const router = useRouter(); + const { legalUid } = router.query; + + useEffect(() => { + if (!legalUid && router.isReady) { + router.push( + Module.getInstance() + .get() + .modules.pages.Legal.pages.LegalInformations.props.path.replace("[legalUid]", ELegalOptions.LEGAL_MENTIONS), + ); + } + }, [legalUid, router]); + + return ; } From 6eae754bc821b2435a40910caf6ddd8980ec8180 Mon Sep 17 00:00:00 2001 From: Maxime Lalo Date: Mon, 29 Jul 2024 12:44:12 +0200 Subject: [PATCH 5/7] :sparkles: Fixing build --- .../LayoutTemplates/DefaultNotaryDashboard/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx b/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx index 190dc803..5d734e18 100644 --- a/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx +++ b/src/front/Components/LayoutTemplates/DefaultNotaryDashboard/index.tsx @@ -10,11 +10,11 @@ import { useRouter } from "next/router"; import DefaultDashboardWithList, { IPropsDashboardWithList } from "../DefaultDashboardWithList"; type IProps = IPropsDashboardWithList & { - isArchived: boolean; + isArchived?: boolean; }; export default function DefaultNotaryDashboard(props: IProps) { - const { isArchived } = props; + const { isArchived = false } = props; const router = useRouter(); const [folders, setFolders] = React.useState([]); const { folderUid } = router.query; From 447babc38658498784a39b6cdded59ae7433725a Mon Sep 17 00:00:00 2001 From: Maxime Lalo Date: Mon, 29 Jul 2024 13:02:47 +0200 Subject: [PATCH 6/7] :sparkles: Adding footer --- .../Components/DesignSystem/Footer/index.tsx | 5 +++- .../classes.module.scss | 23 +++++++++++-------- .../DefaultDashboardWithList/index.tsx | 16 ++++++++----- 3 files changed, 27 insertions(+), 17 deletions(-) diff --git a/src/front/Components/DesignSystem/Footer/index.tsx b/src/front/Components/DesignSystem/Footer/index.tsx index 8867ec7f..9a23212f 100644 --- a/src/front/Components/DesignSystem/Footer/index.tsx +++ b/src/front/Components/DesignSystem/Footer/index.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useEffect } from "react"; import classes from "./classes.module.scss"; import Mobile from "./mobile"; import Desktop from "./desktop"; @@ -9,6 +9,9 @@ type IProps = { }; export default function Footer({ className }: IProps) { + useEffect(() => { + document.documentElement.style.setProperty("--footer-height", `43px`); + }); return (