130 lines
4.5 KiB
TypeScript
130 lines
4.5 KiB
TypeScript
import LogoIcon from "@Assets/logo_small_blue.svg";
|
|
import Folders from "@Front/Api/LeCoffreApi/Notary/Folders/Folders";
|
|
import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
|
|
import Separator, { ESeperatorColor, ESeperatorDirection } from "@Front/Components/DesignSystem/Separator";
|
|
import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
|
|
import HelpBox from "@Front/Components/Elements/HelpBox";
|
|
import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
|
|
import Module from "@Front/Config/Module";
|
|
import useUser from "@Front/Hooks/useUser";
|
|
import { DocumentIcon } from "@heroicons/react/24/outline";
|
|
import EFolderStatus from "le-coffre-resources/dist/Customer/EFolderStatus";
|
|
import Image from "next/image";
|
|
import Link from "next/link";
|
|
import { useRouter } from "next/router";
|
|
import { useEffect, useState } from "react";
|
|
import classes from "./classes.module.scss";
|
|
|
|
import FolderService from "src/common/Api/LeCoffreApi/sdk/FolderService";
|
|
|
|
export default function Folder() {
|
|
const [_isArchivedModalOpen, _setIsArchivedModalOpen] = useState(true);
|
|
const router = useRouter();
|
|
|
|
const { user: activeUser } = useUser();
|
|
|
|
useEffect(() => {
|
|
// TODO: review
|
|
FolderService.getFolders().then((processes: any[]) => {
|
|
if (processes.length > 0) {
|
|
let folders: any[] = processes.map((process: any) => process.processData);
|
|
|
|
// FilterBy status
|
|
folders = folders.filter((folder: any) => folder.status === EFolderStatus.LIVE);
|
|
|
|
if (folders.length > 0) {
|
|
router.push(
|
|
Module.getInstance()
|
|
.get()
|
|
.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", folders[0].uid)
|
|
);
|
|
}
|
|
}
|
|
});
|
|
|
|
/*
|
|
Folders.getInstance()
|
|
.get({
|
|
q: {
|
|
where: { status: EFolderStatus.LIVE },
|
|
orderBy: { created_at: "desc" },
|
|
},
|
|
})
|
|
.then((folders) => {
|
|
if (folders.length > 0)
|
|
router.push(
|
|
Module.getInstance()
|
|
.get()
|
|
.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", folders[0]?.uid ?? ""),
|
|
);
|
|
});
|
|
*/
|
|
}, [router]);
|
|
return (
|
|
<DefaultNotaryDashboard title={"Dossier"} mobileBackText={"Liste des dossiers"}>
|
|
<div className={classes["root"]}>
|
|
<div className={classes["content"]}>
|
|
<div className={classes["title-container"]}>
|
|
<Image src={LogoIcon} alt="logo" />
|
|
|
|
{activeUser && activeUser.contact && (
|
|
<Typography typo={ETypo.TITLE_H1} color={ETypoColor.TEXT_ACCENT}>
|
|
Bonjour {activeUser.contact.first_name}, bienvenue sur LeCoffre.io
|
|
</Typography>
|
|
)}
|
|
{!activeUser ||
|
|
(!activeUser.contact && (
|
|
<Typography typo={ETypo.TITLE_H1} color={ETypoColor.TEXT_ACCENT}>
|
|
Bonjour, bienvenue sur LeCoffre.io
|
|
</Typography>
|
|
))}
|
|
<Typography typo={ETypo.TEXT_LG_REGULAR}>
|
|
Commencez par créer votre{" "}
|
|
<Typography typo={ETypo.TEXT_LG_SEMIBOLD} type="span">
|
|
premier dossier
|
|
</Typography>{" "}
|
|
pour profiter de toutes les fonctionnalités de notre plateforme sécurisée.
|
|
</Typography>
|
|
</div>
|
|
|
|
<div className={classes["no-folder"]}>
|
|
<DocumentIcon width={32} />
|
|
<div className={classes["text-container"]}>
|
|
<Typography typo={ETypo.TEXT_LG_SEMIBOLD}>Aucun dossier créé</Typography>
|
|
<Typography typo={ETypo.TEXT_MD_REGULAR}>
|
|
Vous n'avez pas encore de dossier créé. En quelques clics, commencez un nouveau dossier pour organiser et
|
|
sécuriser vos documents notariés.
|
|
</Typography>
|
|
</div>
|
|
<Link href={Module.getInstance().get().modules.pages.Folder.pages.CreateFolder.props.path}>
|
|
<Button variant={EButtonVariant.INFO}>Créer votre premier dossier</Button>
|
|
</Link>
|
|
</div>
|
|
|
|
<div className={classes["help-container"]}>
|
|
<HelpBox
|
|
title="Besoin d'aide ?"
|
|
description="Consultez nos guides pour bien démarrer."
|
|
button={{ text: "Accéder aux guides" }}
|
|
/>
|
|
|
|
<Separator
|
|
className={classes["desktop"]}
|
|
direction={ESeperatorDirection.VERTICAL}
|
|
size={128}
|
|
color={ESeperatorColor.LIGHT}
|
|
/>
|
|
<Separator className={classes["mobile"]} direction={ESeperatorDirection.HORIZONTAL} color={ESeperatorColor.LIGHT} />
|
|
|
|
<HelpBox
|
|
title="Vous avez des questions ?"
|
|
description="Notre équipe de support est là pour vous aider."
|
|
button={{ text: "Contactez le support" }}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</DefaultNotaryDashboard>
|
|
);
|
|
}
|