🔨 design review

This commit is contained in:
Max S 2024-09-16 11:40:32 +02:00
parent 7774488be7
commit 7d8653ae98
5 changed files with 19 additions and 14 deletions

View File

@ -1,8 +1,7 @@
@import "@Themes/constants.scss";
.root {
padding: var(--spacing-3) var(--spacing-15);
max-width: 1156px;
padding: var(--spacing-4) 142px;
display: flex;
flex-direction: column;

View File

@ -4,7 +4,7 @@ import Dropdown from "@Front/Components/DesignSystem/Dropdown";
import { IOption } from "@Front/Components/DesignSystem/Dropdown/DropdownMenu/DropdownOption";
import Table from "@Front/Components/DesignSystem/Table";
import { IHead, IRowProps } from "@Front/Components/DesignSystem/Table/MuiTable";
import Tag, { ETagColor } from "@Front/Components/DesignSystem/Tag";
import Tag, { ETagColor, ETagVariant } from "@Front/Components/DesignSystem/Tag";
import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
import BackArrow from "@Front/Components/Elements/BackArrow";
import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate";
@ -19,6 +19,13 @@ import classes from "./classes.module.scss";
type IProps = {};
const tradDocumentStatus: Record<EDocumentStatus, string> = {
[EDocumentStatus.ASKED]: "DEMANDÉ",
[EDocumentStatus.DEPOSITED]: "À VALIDER",
[EDocumentStatus.VALIDATED]: "VALIDÉ",
[EDocumentStatus.REFUSED]: "REFUSÉ",
};
const header: readonly IHead[] = [
{
key: "remindedAt",
@ -126,6 +133,7 @@ export default function DocumentsReminderHistory(props: IProps) {
options={customersOptions}
onSelectionChange={onSelectionChange}
selectedOption={customerOption ?? customersOptions?.[0]}
label="Client"
/>
<Table className={classes["table"]} header={header} rows={buildRows(reminders)} />
</div>
@ -147,14 +155,14 @@ function buildRows(reminders: DocumentReminder[] | null): IRowProps[] {
function getTag(status: EDocumentStatus) {
switch (status) {
case EDocumentStatus.ASKED:
return <Tag label={status} color={ETagColor.INFO} />;
return <Tag label={tradDocumentStatus[status]} color={ETagColor.INFO} variant={ETagVariant.SEMI_BOLD} />;
case EDocumentStatus.DEPOSITED:
return <Tag label={status} color={ETagColor.WARNING} />;
return <Tag label={tradDocumentStatus[status]} color={ETagColor.WARNING} variant={ETagVariant.SEMI_BOLD} />;
case EDocumentStatus.VALIDATED:
return <Tag label={status} color={ETagColor.SUCCESS} />;
return <Tag label={tradDocumentStatus[status]} color={ETagColor.SUCCESS} variant={ETagVariant.SEMI_BOLD} />;
case EDocumentStatus.REFUSED:
return <Tag label={status} color={ETagColor.ERROR} />;
return <Tag label={tradDocumentStatus[status]} color={ETagColor.ERROR} variant={ETagVariant.SEMI_BOLD} />;
default:
return <Tag label={status} color={ETagColor.INFO} />;
return <Tag label={tradDocumentStatus[status]} color={ETagColor.INFO} variant={ETagVariant.SEMI_BOLD} />;
}
}

View File

@ -4,7 +4,7 @@ import { IOption } from "@Front/Components/DesignSystem/Form/SelectFieldOld";
import Modal from "@Front/Components/DesignSystem/Modal";
import Separator, { ESeperatorColor } from "@Front/Components/DesignSystem/Separator";
import { ToasterService } from "@Front/Components/DesignSystem/Toaster";
import Typography, { ETypo } from "@Front/Components/DesignSystem/Typography";
import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
import Customer from "le-coffre-resources/dist/Customer";
import { EDocumentStatus } from "le-coffre-resources/dist/Customer/Document";
import React, { useCallback, useMemo, useState } from "react";
@ -79,7 +79,7 @@ export default function ReminderModal(props: IProps) {
firstButton={{ children: "Annuler", onClick: onClose }}
secondButton={{ children: "Relancer", onClick: onRemind }}>
<div className={classes["root"]}>
<Typography typo={ETypo.TEXT_MD_LIGHT}>
<Typography typo={ETypo.TEXT_MD_LIGHT} color={ETypoColor.TEXT_SECONDARY}>
Sélectionnez le(s) document(s) pour lequel vous souhaitez relancer le client.
</Typography>
<CheckBox

View File

@ -16,6 +16,7 @@ $mobile-breakpoint: 664px;
.tabs {
width: calc(100% - 210px);
}
border-bottom: 1px solid var(--color-neutral-500);
}
.content {

View File

@ -112,10 +112,7 @@ export default function ClientView(props: IProps) {
</Button>
</Link>
)}
<EmailReminder
customer={customer}
isAnchored={anchorStatus !== AnchorStatus.NOT_ANCHORED}
/>
<EmailReminder customer={customer} isAnchored={anchorStatus !== AnchorStatus.NOT_ANCHORED} />
</div>
</div>