4nk/lecoffre-front
4
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

✨ Link modifications

Browse Source
This commit is contained in:
Maxime Lalo 2023-04-20 11:02:03 +02:00
parent 0538f71ae6
commit eaa68f515a
5 changed files with 30 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/front/Components/DesignSystem/Header/BurgerMenu/BurgerModal/index.tsx
View File

@ -20,7 +20,6 @@ export default class BurgerModal extends React.Component<IProps, IState> {
<div className={classes["root"]}> <div className={classes["root"]}>
<NavigationLink path={"/folder"} text="Dossiers en cours" /> <NavigationLink path={"/folder"} text="Dossiers en cours" />
<NavigationLink text="Dossiers archivés" /> <NavigationLink text="Dossiers archivés" />
<NavigationLink path={"/"} text="Home" />
<div className={classes["separator"]} /> <div className={classes["separator"]} />
<LogOutButton /> <LogOutButton />
</div> </div>

4
src/front/Components/DesignSystem/Header/HeaderLink/classes.module.scss
View File

@ -19,4 +19,8 @@
bottom: 0; bottom: 0;
left: 0; left: 0;
} }
&.desactivated{
cursor: not-allowed;
}
} }

35
src/front/Components/DesignSystem/Header/HeaderLink/index.tsx
View File

@ -1,11 +1,12 @@
import React from "react";
import classes from "./classes.module.scss";
import Link from "next/link";
import Typography, { ITypo } from "../../Typography";
import classNames from "classnames"; import classNames from "classnames";
import Link from "next/link";
import router from "next/router"; import router from "next/router";
import React from "react";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import Typography, { ITypo } from "../../Typography";
import classes from "./classes.module.scss";
type IPropsClass = { type IPropsClass = {
text: string | JSX.Element; text: string | JSX.Element;
path?: string; path?: string;
@ -16,20 +17,30 @@ type IStateClass = {};
class HeaderLinkClass extends React.Component<IPropsClass, IStateClass> { class HeaderLinkClass extends React.Component<IPropsClass, IStateClass> {
public override render(): JSX.Element { public override render(): JSX.Element {
return ( if (this.props.path !== "" && this.props.path !== undefined) {
<Link href={this.props.path ?? ""} className={classNames(classes["root"], this.props.isActive && [classes["active"]])}> return (
<div className={classes["content"]}> <Link href={this.props.path} className={classNames(classes["root"], this.props.isActive && classes["active"])}>
<Typography typo={this.props.isActive ? ITypo.P_SB_18 : ITypo.NAV_HEADER_18}>{this.props.text}</Typography> <div className={classes["content"]}>
<Typography typo={this.props.isActive ? ITypo.P_SB_18 : ITypo.NAV_HEADER_18}>{this.props.text}</Typography>
</div>
{this.props.isActive && <div className={classes["underline"]} />}
</Link>
);
} else {
return (
<div className={classNames(classes["root"], classes["desactivated"])}>
<div className={classes["content"]}>
<Typography typo={ITypo.NAV_HEADER_18}>{this.props.text}</Typography>
</div>
</div> </div>
{this.props.isActive && <div className={classes["underline"]} />} );
</Link> }
);
} }
} }
export default function HeaderLink(props: IPropsClass) { export default function HeaderLink(props: IPropsClass) {
const [url, setUrl] = useState(""); const [url, setUrl] = useState("");
useEffect(() => setUrl(router?.asPath), []); useEffect(() => setUrl(router?.asPath), []);
const isActive = url === props.path; const isActive = url.includes(props.path!);
return <HeaderLinkClass {...props} isActive={isActive} />; return <HeaderLinkClass {...props} isActive={isActive} />;
} }

1
src/front/Components/DesignSystem/Header/Navigation/index.tsx
View File

@ -10,7 +10,6 @@ export default class Navigation extends React.Component<IProps, IState> {
public override render(): JSX.Element { public override render(): JSX.Element {
return ( return (
<div className={classes["root"]}> <div className={classes["root"]}>
<HeaderLink text={"Home"} path={"/"} />
<HeaderLink text={"Dossiers en cours"} path={"/folder"} /> <HeaderLink text={"Dossiers en cours"} path={"/folder"} />
<HeaderLink text={"Dossiers archivés"} path={""} isActive={false} /> <HeaderLink text={"Dossiers archivés"} path={""} isActive={false} />
</div> </div>

6
src/front/Components/Layouts/Folder/FolderInformation/index.tsx
View File

@ -1,4 +1,5 @@
import "reflect-metadata"; import "reflect-metadata";
import ChevronIcon from "@Assets/Icons/chevron.svg"; import ChevronIcon from "@Assets/Icons/chevron.svg";
import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button"; import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
import FolderBoxInformation from "@Front/Components/DesignSystem/FolderBoxInformation"; import FolderBoxInformation from "@Front/Components/DesignSystem/FolderBoxInformation";
@ -14,7 +15,6 @@ import BasePage from "../../Base";
import classes from "./classes.module.scss"; import classes from "./classes.module.scss";
import ClientSection from "./ClientSection"; import ClientSection from "./ClientSection";
type IPropsClass = { type IPropsClass = {
selectedFolderUid: string; selectedFolderUid: string;
}; };
@ -105,8 +105,8 @@ class FolderInformationClass extends BasePage<IPropsClass, IState> {
// const selectedFolder = await Fodler.getInstance().getByUid(this.props.selectedFolderUid); // const selectedFolder = await Fodler.getInstance().getByUid(this.props.selectedFolderUid);
// this.setState({ selectedFolder }); // this.setState({ selectedFolder });
// console.log(folders); // console.log(folders);
for(const folder of folders) { for (const folder of folders) {
if(folder.uid === this.props.selectedFolderUid) { if (folder.uid === this.props.selectedFolderUid) {
this.setState({ selectedFolder: folder }); this.setState({ selectedFolder: folder });
break; break;
} }