import "./dashboard-app.scss";
import RightArrow from "../../../SVG/RightArrow";
import {Link} from "react-router-dom";
import useTranslations from "../../../../hooks/useTranslations";
import {Microservice} from "../../../../models/EgovUser";

type DashboardAppProps = {
	link: string;
	icon: JSX.Element;
	title: string;
};
const DashboardApp = (props: DashboardAppProps) => {
	const {
		translateMicroservice,
	} = useTranslations()
	return (
		<Link to={props.link} className="style app">
			<div className={'svg-dashboard-icons'}>{props.icon}</div>
			<div className="app--title-arrow">
				<p>{translateMicroservice(props.title as Microservice)} </p>
				<span className="app-arrow-dark">
					<RightArrow />
			</span>
			</div>
		</Link>
	);
};

export default DashboardApp;