diff --git a/src/front/Assets/images/background_refonte.svg b/src/front/Assets/images/background_refonte.svg new file mode 100644 index 00000000..6c624b5c --- /dev/null +++ b/src/front/Assets/images/background_refonte.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + diff --git a/src/front/Components/DesignSystem/Typography/classes.module.scss b/src/front/Components/DesignSystem/Typography/classes.module.scss index cfd397fb..6250add3 100644 --- a/src/front/Components/DesignSystem/Typography/classes.module.scss +++ b/src/front/Components/DesignSystem/Typography/classes.module.scss @@ -7,14 +7,13 @@ color: var(--data-color, var(--color-neutral-950)); - //Displays &.display-large { font-style: normal; font-weight: 600; font-size: 50px; line-height: 75px; - letter-spacing: -2%; + letter-spacing: -0.8px; @media (max-width: $screen-m) { font-size: 48px; @@ -26,7 +25,7 @@ font-weight: 600; font-size: 48px; line-height: 72px; - letter-spacing: -2%; + letter-spacing: -0.8px; @media (max-width: $screen-m) { font-size: 48px; @@ -38,7 +37,7 @@ font-weight: 600; font-size: 44px; line-height: 66px; - letter-spacing: -2%; + letter-spacing: -0.8px; @media (max-width: $screen-m) { font-size: 48px; @@ -52,42 +51,42 @@ font-weight: 600; font-size: 40px; line-height: 60px; - letter-spacing: -2%; + letter-spacing: -0.8px; } &.title-h2 { font-style: normal; font-weight: 400; font-size: 36px; line-height: 54px; - letter-spacing: -2%; + letter-spacing: -0.8px; } &.title-h3 { font-style: normal; font-weight: 300; font-size: 32px; line-height: 48px; - letter-spacing: -2%; + letter-spacing: -0.8px; } &.title-h4 { font-style: normal; font-weight: 600; font-size: 28px; line-height: 42px; - letter-spacing: -2%; + letter-spacing: -0.8px; } &.title-h5 { font-style: normal; font-weight: 400; font-size: 24px; line-height: 36px; - letter-spacing: -2%; + letter-spacing: -0.8px; } &.title-h6 { font-style: normal; font-weight: 400; font-size: 20px; line-height: 30px; - letter-spacing: -2%; + letter-spacing: -0.8px; } //Text large @@ -248,28 +247,28 @@ font-weight: 700; font-size: 10px; line-height: 15px; - letter-spacing: -2%; + letter-spacing: -0.8px; } &.caption-semibold { font-style: normal; font-weight: 600; font-size: 10px; line-height: 15px; - letter-spacing: -2%; + letter-spacing: -0.8px; } &.caption-regular { font-style: normal; font-weight: 400; font-size: 10px; line-height: 15px; - letter-spacing: -2%; + letter-spacing: -0.8px; } &.caption-uppercase { font-style: normal; font-weight: 400; font-size: 10px; line-height: 15px; - letter-spacing: -2%; + letter-spacing: -0.8px; text-transform: uppercase; } &.caption-light { @@ -277,6 +276,6 @@ font-weight: 300; font-size: 10px; line-height: 15px; - letter-spacing: -2%; + letter-spacing: -0.8px; } } diff --git a/src/front/Components/Elements/BackArrow/index.tsx b/src/front/Components/Elements/BackArrow/index.tsx index 5091555d..446d1177 100644 --- a/src/front/Components/Elements/BackArrow/index.tsx +++ b/src/front/Components/Elements/BackArrow/index.tsx @@ -1,5 +1,5 @@ import { ChevronLeftIcon } from "@heroicons/react/24/solid"; -import Button, { EButtonStyleType, EButtonVariant } from "@Front/Components/DesignSystem/Button"; +import Button, { EButtonSize, EButtonStyleType, EButtonVariant } from "@Front/Components/DesignSystem/Button"; import { NextRouter, useRouter } from "next/router"; import React from "react"; @@ -24,6 +24,7 @@ class BackArrowClass extends React.Component { leftIcon={} variant={EButtonVariant.PRIMARY} styleType={EButtonStyleType.TEXT} + size={EButtonSize.SM} onClick={this.handleClick}> Retour diff --git a/src/front/Components/Layouts/Folder/UpdateFolderDescription/classes.module.scss b/src/front/Components/Layouts/Folder/UpdateFolderDescription/classes.module.scss deleted file mode 100644 index cd3ceba2..00000000 --- a/src/front/Components/Layouts/Folder/UpdateFolderDescription/classes.module.scss +++ /dev/null @@ -1,56 +0,0 @@ -@import "@Themes/constants.scss"; - -.root { - display: flex; - flex-direction: column; - min-height: 100%; - align-items: flex-start; - width: fit-content; - - .back-arrow { - margin-bottom: 24px; - } - - .form { - width: 100%; - - .content { - margin-top: 32px; - - >:not(:last-child) { - margin-bottom: 24px; - } - - } - - .button-container { - width: 100%; - display: flex; - text-align: center; - margin-top: 24px; - - .cancel-button { - display: flex; - margin-right: 32px; - } - - @media (max-width: $screen-m) { - display: flex; - flex-direction: column-reverse; - - .cancel-button { - margin-left: 0; - margin-top: 12px; - - >* { - flex: 1; - } - } - - >* { - width: 100%; - } - } - } - } -} \ No newline at end of file diff --git a/src/front/Components/Layouts/Folder/UpdateFolderDescription/index.tsx b/src/front/Components/Layouts/Folder/UpdateFolderDescription/index.tsx deleted file mode 100644 index 7cde1e44..00000000 --- a/src/front/Components/Layouts/Folder/UpdateFolderDescription/index.tsx +++ /dev/null @@ -1,90 +0,0 @@ -import Folders from "@Front/Api/LeCoffreApi/Notary/Folders/Folders"; -import Button, { EButtonStyleType, EButtonVariant } from "@Front/Components/DesignSystem/Button"; -import Form from "@Front/Components/DesignSystem/Form"; -import TextAreaField from "@Front/Components/DesignSystem/Form/TextareaField"; -import Typography, { ETypo } from "@Front/Components/DesignSystem/Typography"; -import BackArrow from "@Front/Components/Elements/BackArrow"; -import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard"; -import Module from "@Front/Config/Module"; -import { OfficeFolder } from "le-coffre-resources/dist/Notary"; -import Link from "next/link"; -import { NextRouter, useRouter } from "next/router"; - -import BasePage from "../../Base"; -import classes from "./classes.module.scss"; - -type IProps = {}; - -type IPropsClass = IProps & { - folderUid: string; - router: NextRouter; -}; - -type IState = { - folder: OfficeFolder | null; -}; -class UpdateFolderDescriptionClass extends BasePage { - private backwardPath = Module.getInstance() - .get() - .modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", this.props.folderUid); - constructor(props: IPropsClass) { - super(props); - this.state = { - folder: null, - }; - this.onFormSubmit = this.onFormSubmit.bind(this); - } - public override render(): JSX.Element { - return ( - -
-
- -
- Modifier la note du dossier - -
-
- -
- -
- - - - -
-
-
- - ); - } - - public override async componentDidMount() { - const folder = await Folders.getInstance().getByUid(this.props.folderUid); - this.setState({ folder }); - } - - private async onFormSubmit(e: React.FormEvent | null, values: { [key: string]: string }) { - try { - await Folders.getInstance().put(this.props.folderUid, values); - this.props.router.push(this.backwardPath); - } catch (error) { - console.error(error); - } - } -} - -export default function UpdateFolderDescription(props: IProps) { - const router = useRouter(); - let { folderUid } = router.query; - folderUid = folderUid as string; - - return ; -} diff --git a/src/front/Components/Layouts/Folder/UpdateFolderMetadata/classes.module.scss b/src/front/Components/Layouts/Folder/UpdateFolderMetadata/classes.module.scss index 4724e9d9..57f936d6 100644 --- a/src/front/Components/Layouts/Folder/UpdateFolderMetadata/classes.module.scss +++ b/src/front/Components/Layouts/Folder/UpdateFolderMetadata/classes.module.scss @@ -3,54 +3,26 @@ .root { display: flex; flex-direction: column; - min-height: 100%; - align-items: flex-start; - width: fit-content; - - .back-arrow { - margin-bottom: 24px; - } - + gap: var(--spacing-xl, 32px); + width: 472px; + margin: auto; + margin: 24px auto; .form { - width: 100%; - .content { - margin-top: 32px; - - >:not(:last-child) { - margin-bottom: 24px; - } - + display: flex; + flex-direction: column; + gap: var(--spacing-md, 16px); } .button-container { - width: 100%; + margin-top: var(--spacing-xl, 32px); display: flex; - text-align: center; - margin-top: 24px; - - .cancel-button { - display: flex; - margin-right: 12px; - } + gap: var(--spacing-md, 16px); @media (max-width: $screen-m) { display: flex; flex-direction: column-reverse; - - .cancel-button { - margin-left: 0; - margin-top: 12px; - - >* { - flex: 1; - } - } - - >* { - width: 100%; - } } } } -} \ No newline at end of file +} diff --git a/src/front/Components/Layouts/Folder/UpdateFolderMetadata/index.tsx b/src/front/Components/Layouts/Folder/UpdateFolderMetadata/index.tsx index 0667f6a8..4d11b944 100644 --- a/src/front/Components/Layouts/Folder/UpdateFolderMetadata/index.tsx +++ b/src/front/Components/Layouts/Folder/UpdateFolderMetadata/index.tsx @@ -5,103 +5,34 @@ import Select, { IOption } from "@Front/Components/DesignSystem/Form/SelectField import TextField from "@Front/Components/DesignSystem/Form/TextField"; import Typography, { ETypo } from "@Front/Components/DesignSystem/Typography"; import BackArrow from "@Front/Components/Elements/BackArrow"; -import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard"; import Module from "@Front/Config/Module"; import { Deed, OfficeFolder } from "le-coffre-resources/dist/Notary"; import Link from "next/link"; -import { NextRouter, useRouter } from "next/router"; - -import BasePage from "../../Base"; +import { useRouter } from "next/router"; +import backgroundImage from "@Assets/images/background_refonte.svg"; import classes from "./classes.module.scss"; import DateField from "@Front/Components/DesignSystem/Form/DateField"; import { ValidationError } from "class-validator/types/validation/ValidationError"; +import { useEffect, useState } from "react"; +import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage"; +import TextAreaField from "@Front/Components/DesignSystem/Form/TextareaField"; +import { isArray } from "class-validator"; -type IProps = {}; +export default function UpdateFolderMetadata() { + const router = useRouter(); -type IPropsClass = IProps & { - folderUid: string; - router: NextRouter; -}; + const [selectedFolder, setSelectedFolder] = useState(null); + const [validationError, setValidationError] = useState([]); -type IState = { - selectedFolder: OfficeFolder | null; - validationError: ValidationError[]; -}; -class UpdateFolderMetadataClass extends BasePage { - constructor(props: IPropsClass) { - super(props); - this.state = { - selectedFolder: null, - validationError: [], - }; - this.onSelectedFolder = this.onSelectedFolder.bind(this); - this.getFolder = this.getFolder.bind(this); - this.onFormSubmit = this.onFormSubmit.bind(this); - } - public override render(): JSX.Element { - const backwardPath = Module.getInstance() - .get() - .modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", this.state.selectedFolder?.uid!); - const deedOption = { - label: this.state.selectedFolder?.deed?.deed_type?.name, - value: this.state.selectedFolder?.deed?.deed_type?.uid, - } as IOption; - const openingDate = new Date(this.state.selectedFolder?.created_at ?? ""); - if (!this.state.selectedFolder?.created_at) return <>; - const defaultValue = openingDate.toISOString().split("T")[0]; - return ( - -
-
- -
- Modifier les informations du dossier + let { folderUid } = router.query; -
-
- error.property === "name")} - /> - error.property === "folder_number")} - /> - + + error.property === "description")} + /> +
+ +
+ + + + +
+
+
+ + ); } diff --git a/src/pages/folders/[folderUid]/edit/description.tsx b/src/pages/folders/[folderUid]/edit/description.tsx deleted file mode 100644 index 2b90f293..00000000 --- a/src/pages/folders/[folderUid]/edit/description.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import UpdateFolderDescription from "@Front/Components/Layouts/Folder/UpdateFolderDescription"; -import Module from "@Front/Config/Module"; -import { useRouter } from "next/router"; - -export default function Route() { - const isEnabled: boolean = Module.getInstance().get().modules.pages.Folder.pages.EditDescription.enabled; - const router = useRouter(); - if (!isEnabled) { - router.push("/404"); - return null; - } - return ; -}