48 lines
1.5 KiB
TypeScript
48 lines
1.5 KiB
TypeScript
import React from "react";
|
|
import classes from "./classes.module.scss";
|
|
import Typography, { ITypo } from "../Typography";
|
|
import Image from "next/image";
|
|
import ChevronIcon from "@Assets/Icons/chevron.svg";
|
|
import WarningBadge from "../WarningBadge";
|
|
import { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
|
|
|
|
type IProps = {
|
|
folder: IDashBoardFolder;
|
|
onSelectedFolder?: (folder: IDashBoardFolder) => void;
|
|
};
|
|
type IState = {};
|
|
|
|
export default class FolderContainer extends React.Component<IProps, IState> {
|
|
public constructor(props: IProps) {
|
|
super(props);
|
|
this.onSelectedFolder = this.onSelectedFolder.bind(this);
|
|
}
|
|
|
|
public override render(): JSX.Element {
|
|
return (
|
|
<div className={classes["root"]} onClick={this.onSelectedFolder}>
|
|
<div className={classes["left-side"]}>
|
|
<Typography typo={ITypo.P_16}>
|
|
{this.props.folder.folder_number.concat(" - ").concat(this.props.folder.name)}
|
|
</Typography>
|
|
{this.countPendingDocuments() > 0 && (
|
|
<div className={classes["warning"]}>
|
|
<WarningBadge />
|
|
</div>
|
|
)}
|
|
</div>
|
|
<Image alt="chevron" src={ChevronIcon} />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
private countPendingDocuments(): number {
|
|
if (!this.props.folder.documents) return 0;
|
|
return this.props.folder.documents?.filter((document) => document.document_status === "PENDING").length ?? 0;
|
|
}
|
|
|
|
private onSelectedFolder(): void {
|
|
this.props.onSelectedFolder && this.props.onSelectedFolder(this.props.folder);
|
|
}
|
|
}
|