import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
import DefaultRoleDashboard from "@Front/Components/LayoutTemplates/DefaultRoleDashboard";

import BasePage from "../Base";
import classes from "./classes.module.scss";

type IProps = {};
type IState = {};
export default class Collaborators extends BasePage<IProps, IState> {
	public override render(): JSX.Element {
		return (
			<DefaultRoleDashboard mobileBackText={"Liste des rôles"}>
				<div className={classes["root"]}>
					<div className={classes["no-role-selected"]}>
						<Typography typo={ETypo.TITLE_H1}>Gestion des rôles</Typography>
						<div className={classes["choose-a-role"]}>
							<Typography typo={ETypo.TEXT_LG_REGULAR} color={ETypoColor.COLOR_NEUTRAL_500}>
								Sélectionnez un rôle
							</Typography>
						</div>
					</div>
				</div>
			</DefaultRoleDashboard>
		);
	}
}