import LogOutButton from "@Front/Components/DesignSystem/LogOutButton";
import Module from "@Front/Config/Module";
import React from "react";

import classes from "./classes.module.scss";
import MenuItem from "@Front/Components/DesignSystem/Menu/MenuItem";

type IProps = {
	isOpen: boolean;
	closeModal: () => void;
	isCustomer?: boolean;
};
type IState = {};

export default class ProfileModal extends React.Component<IProps, IState> {
	// TODO isEnabled depending on role given by DB
	public override render(): JSX.Element | null {
		if (!this.props.isOpen) return null;
		return (
			<>
				<div className={classes["background"]} onClick={this.props.closeModal} />
				<div className={classes["root"]}>
					{!this.props.isCustomer && <MenuItem
						item={{
							text: "Mon compte",
							link: Module.getInstance().get().modules.pages.MyAccount.props.path,
						}}
					/>}

					{!this.props.isCustomer && <MenuItem
						item={{
							text: "Guide de Prise en Main",
							link: "https://ressources.lecoffre.io/",
							target: "_blank",
						}}
					/>}


					{!this.props.isCustomer && <MenuItem
						item={{
							text: "CGU",
							link: "/CGU_LeCoffre_io.pdf",
							hasSeparator: true,
						}}
					/>}

					<LogOutButton isCustomer={this.props.isCustomer} />
				</div>
			</>
		);
	}
}