import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { ErrorPageContainer, Row, Title, Description, DescriptionContent, } from './ErrorPageStyle';
import { Button } from '../buttonv2/Buttonv2.component';
import { Icon } from '../icon/Icon.component';
const translations = {
    en: {
        not_exist: 'Error: this page does not exist',
        error_desc: 'It might be the wrong address or the page has moved.',
        should_do: 'You might check the url, or contact your admin if the error remains.',
        return_home: 'Return Home',
    },
    fr: {
        not_exist: "Erreur: cette page n'existe pas",
        error_desc: 'Il se peut que ce soit une mauvaise adresse ou que la page ait été déplacée.',
        should_do: "Vous pouvez vérifier l'url, ou contacter votre administrateur si l'erreur persiste.",
        return_home: "Retour à l'accueil",
    },
};
function ErrorPage404({ locale = 'en', onReturnHomeClick, ...rest }) {
    if (!translations[locale])
        locale = 'en';
    // Ensure the locale formatting is consistent
    locale = locale.toLowerCase();
    return (_jsxs(ErrorPageContainer, { className: "sc-error-page404", ...rest, children: [_jsxs(Row, { children: [_jsx(Icon, { name: "Exclamation-triangle", size: "2x", color: "statusWarning" }), _jsx(Title, { children: translations[locale].not_exist })] }), _jsx(Row, { children: _jsxs(Description, { children: [_jsx(DescriptionContent, { children: translations[locale].error_desc }), _jsx(DescriptionContent, { children: translations[locale].should_do })] }) }), onReturnHomeClick && (_jsx(Button, { label: translations[locale].return_home, variant: "secondary", onClick: onReturnHomeClick }))] }));
}
export { ErrorPage404 };
