import { __assign } from '../../../node_modules/tslib/tslib.es6.js';
import React from 'react';
import { Divider, AspectRatio, chakra, Text } from '@chakra-ui/react';
import { useI18n } from '../../../utilities/i18nInit.js';
import Stack from '../../stack/index.js';
import SimpleGrid from '../../simpleGrid/index.js';
import PageLayout from '../../layout/Page.js';
import '../../icons/AdvancedSearchIcon.js';
import '../../icons/AiSearchIcon.js';
import '../../icons/ArrowCircleIcon.js';
import '../../icons/ArrowDiagonalIcon.js';
import '../../icons/ArrowDownIcon.js';
import '../../icons/ArrowLeftIcon.js';
import '../../icons/ArrowRightIcon.js';
import '../../icons/ArrowUpIcon.js';
import { AutoScout24AppLogo } from '../../icons/AutoScout24AppLogo.js';
import '../../icons/AvatarIcon.js';
import '../../icons/AvatarWithNotificationIcon.js';
import '../../icons/BatteryIcon.js';
import '../../icons/BookmarkIcon.js';
import '../../icons/CalculatorIcon.js';
import '../../icons/CalendarIcon.js';
import '../../icons/CallIcon.js';
import '../../icons/CamperIcon.js';
import '../../icons/CarConditionIcon.js';
import '../../icons/CarIcon.js';
import '../../icons/CopyIcon.js';
import '../../icons/ChartIcon.js';
import '../../icons/CheckmarkIcon.js';
import '../../icons/CheckmarkCircleIcon.js';
import '../../icons/CheckShieldIcon.js';
import '../../icons/ChevronDownLargeIcon.js';
import '../../icons/ChevronDownSmallIcon.js';
import '../../icons/ChevronLeftLargeIcon.js';
import '../../icons/ChevronLeftSmallIcon.js';
import '../../icons/ChevronRightLargeIcon.js';
import '../../icons/ChevronRightSmallIcon.js';
import '../../icons/ChevronRightTinyIcon.js';
import '../../icons/ChevronUpLargeIcon.js';
import '../../icons/ChevronUpSmallIcon.js';
import '../../icons/CloseIcon.js';
import '../../icons/CompareIcon.js';
import '../../icons/ConsumptionIcon.js';
import '../../icons/CreditIcon.js';
import '../../icons/CreditCardIcon.js';
import '../../icons/DaylightIcon.js';
import '../../icons/DeleteIcon.js';
import '../../icons/DocumentCheckIcon.js';
import '../../icons/DocumentIcon.js';
import '../../icons/DragIcon.js';
import '../../icons/DriveSystemIcon.js';
import '../../icons/DriveTypeIcon.js';
import '../../icons/EquipmentIcon.js';
import '../../icons/ErrorIcon.js';
import '../../icons/ExchangeIcon.js';
import '../../icons/EyeIcon.js';
import '../../icons/EyeCrossedIcon.js';
import '../../icons/FacebookIcon.js';
import '../../icons/FlagIcon.js';
import '../../icons/FlameIcon.js';
import '../../icons/FlashIcon.js';
import '../../icons/GasStationIcon.js';
import '../../icons/HeartIcon.js';
import '../../icons/HistoryClockIcon.js';
import '../../icons/HouseIcon.js';
import '../../icons/ImageIcon.js';
import '../../icons/InfoIcon.js';
import '../../icons/InstagramIcon.js';
import '../../icons/InteriorIcon.js';
import '../../icons/LinkedinIcon.js';
import '../../icons/LinkIcon.js';
import '../../icons/ListIcon.js';
import '../../icons/LocationPinIcon.js';
import '../../icons/MagnifierIcon.js';
import '../../icons/MessageIcon.js';
import '../../icons/MissingImageIcon.js';
import '../../icons/MotorcycleIcon.js';
import { MotoScout24AppLogo } from '../../icons/MotoScout24AppLogo.js';
import '../../icons/PdfIcon.js';
import '../../icons/PhoneIcon.js';
import '../../icons/PenIcon.js';
import '../../icons/PlusIcon.js';
import '../../icons/ChfCurrencyIcon.js';
import '../../icons/PrintIcon.js';
import '../../icons/RangeIcon.js';
import '../../icons/RoadIcon.js';
import '../../icons/RotateIcon.js';
import '../../icons/SafeNumberIcon.js';
import '../../icons/ShareIcon.js';
import '../../icons/StarIcon.js';
import '../../icons/SteeringWheelIcon.js';
import '../../icons/ThreeSixtyIcon.js';
import '../../icons/TimeIcon.js';
import '../../icons/TooltipIcon.js';
import '../../icons/InformationIcon.js';
import '../../icons/TopListingIcon.js';
import '../../icons/TrailerIcon.js';
import '../../icons/TransmissionIcon.js';
import '../../icons/TransparentLockIcon.js';
import '../../icons/Trash.js';
import '../../icons/TruckIcon.js';
import '../../icons/TwitterIcon.js';
import '../../icons/UtilityVehicleIcon.js';
import '../../icons/VehiclePowerIcon.js';
import '../../icons/VehicleTypesMotorcycleIcon.js';
import '../../icons/VideoIcon.js';
import '../../icons/VideoCameraIcon.js';
import '../../icons/ViewCarIcon.js';
import '../../icons/DriveSystemLargeIcon.js';
import '../../icons/WarningIcon.js';
import '../../icons/WhatsAppIcon.js';
import '../../icons/YoutubeIcon.js';
import '../../icons/SortIcon.js';
import '../../icons/ViewMotorcycleIcon.js';
import '../../icons/GoogleIcon.js';
import '../../icons/SaveSearchIcon.js';
import '../../icons/AutoScout24Icon.js';
import '../../icons/MotoScout24Icon.js';
import '../../icons/MagnifierLargeIcon.js';
import '../../icons/RocketIcon.js';
import '../../icons/CartIcon.js';
import '../../icons/VanIcon.js';
import '../../icons/MiniVanIcon.js';
import '../../icons/SuvIcon.js';
import '../../icons/CoupeIcon.js';
import '../../icons/CabrioletIcon.js';
import '../../icons/SmallCarIcon.js';
import '../../icons/SedanIcon.js';
import '../../icons/WagonIcon.js';
import '../../icons/PickUpIcon.js';
import '../../icons/InformationBubbleIcon.js';
import '../../icons/OverflowVerticalIcon.js';
import '../../icons/PartialClockIcon.js';
import '../../icons/LockIcon.js';
import '../../icons/TiltedRectangleIcon.js';
import '../../icons/PlusCircleIcon.js';
import '../../icons/StarCircleIcon.js';
import '../../icons/InfinityCircleIcon.js';
import '../../icons/VehicleTypesMotorcycleStarIcon.js';
import '../../icons/CategoryAOneIcon.js';
import '../../icons/CategoryAIcon.js';
import '../../icons/CategoryAMinusIcon.js';
import '../../icons/BankNotesIcon.js';
import '../../icons/ChatBubbleIcon.js';
import '../../icons/DigitalContractIcon.js';
import '../../icons/OptimizerIcon.js';
import '../../icons/CheckmarkCircleColorIcon.js';
import '../../icons/ArrowDownCircleIcon.js';
import '../../icons/ArrowUpCircleIcon.js';
import '../../icons/NotAvailableIcon.js';
import '../../icons/LabelIcon.js';
import '../../icons/BulbIcon.js';
import '../../icons/NoPhotoIcon.js';
import '../../icons/ThumbsUpIcon.js';
import '../../icons/ThumbsDownIcon.js';
import '../../icons/MinusIcon.js';
import '../../icons/DoubleChevronUpIcon.js';
import '../../icons/DoubleChevronDownIcon.js';
import '../../icons/DoubleLineIcon.js';
import '../../icons/NotAvailableSquareIcon.js';
import '../../icons/WarrantyIcon.js';
import '../../icons/DownloadIcon.js';
import '../../icons/TriangleIcon.js';
import '../../icons/SwissFlagIcon.js';
import '../../icons/GlobeIcon.js';
import '../../icons/GarageIcon.js';
import '../../icons/HamburgerMenuIcon.js';
import '../../icons/LogoutIcon.js';
import '../../icons/AndroidIcon.js';
import '../../icons/AppleIcon.js';
import '../../icons/WindowsIcon.js';
import '../../icons/SpeakerIcon.js';
import '../../icons/AddPhotoIcon.js';
import '../../icons/ScreenIcon.js';
import '../../icons/QualitySealIcon.js';
import '../../icons/ExpandIcon.js';
import '../../icons/CollapseIcon.js';
import '../../icons/ForwardIcon.js';
import '../../icons/BalanceIcon.js';
import '../../icons/ParagraphIcon.js';
import '../../icons/UploadIcon.js';
import { H1 } from '../../heading/index.js';
import Flex from '../../flex/index.js';
import img$1 from '../../../assets/images/errorIllustrationVerifyEmail.png.js';
import img$2 from '../../../assets/images/errorIllustrationSomethingWentWrong.png.js';
import img from '../../../assets/images/errorIllustrationNotFound.png.js';
import ContactSupport from '../actions/secondary/ContactSupport.js';
import BackToHomepageSecondary from '../actions/secondary/BackToHomepage.js';
import Reload from '../actions/primary/Reload.js';
import BackToLogin from '../actions/primary/BackToLogin.js';
import BackToHomepagePrimary from '../actions/primary/BackToHomepage.js';
import EmailChangeVerificationErrorContent from './EmailChangeVerification.js';

var Nonce = function () {
    return null;
};
var config = {
    404: {
        illustration: img,
        buttonColumns: 1,
        content: Nonce,
        primaryAction: Nonce,
        secondaryAction: BackToHomepageSecondary,
    },
    500: {
        illustration: img$2,
        buttonColumns: 1,
        content: Nonce,
        primaryAction: Nonce,
        secondaryAction: BackToHomepageSecondary,
    },
    clientSide: {
        illustration: img$2,
        buttonColumns: 2,
        content: Nonce,
        primaryAction: Reload,
        secondaryAction: BackToHomepageSecondary,
    },
    UNVERIFIED_EMAIL: {
        illustration: img,
        buttonColumns: 2,
        content: Nonce,
        primaryAction: BackToLogin,
        secondaryAction: ContactSupport,
    },
    INITIAL_UNVERIFIED_EMAIL: {
        illustration: img$1,
        buttonColumns: 1,
        content: Nonce,
        primaryAction: BackToLogin,
        secondaryAction: Nonce,
    },
    USER_BLOCKED: {
        illustration: img,
        buttonColumns: 1,
        content: Nonce,
        primaryAction: Nonce,
        secondaryAction: ContactSupport,
    },
    UNKNOWN_AUTH_ERROR: {
        illustration: img,
        buttonColumns: 2,
        content: Nonce,
        primaryAction: BackToLogin,
        secondaryAction: ContactSupport,
    },
    EMAIL_CHANGE_VERIFICATION_ERROR: {
        illustration: img,
        buttonColumns: 1,
        content: EmailChangeVerificationErrorContent,
        primaryAction: BackToHomepagePrimary,
        secondaryAction: Nonce,
    },
};
var ErrorPageContent = function (_a) {
    var language = _a.language, statusCode = _a.statusCode, onButtonClick = _a.onButtonClick;
    var PrimaryAction = config[statusCode].primaryAction;
    var SecondaryAction = config[statusCode].secondaryAction;
    var Content = config[statusCode].content;
    var t = useI18n().t;
    var actionButtonProps = {
        t: t,
        language: language,
    };
    return (React.createElement(PageLayout, { maxContentWidth: "md", header: null },
        React.createElement(Flex, { justifyContent: "center", pt: { base: '3xl', md: 'xl' } },
            React.createElement(Stack, { align: "center", spacing: "4xl" },
                React.createElement(SimpleGrid, { columns: 2, spacingX: "4xl" },
                    React.createElement(AutoScout24AppLogo, { width: "80px", height: "51px" }),
                    React.createElement(MotoScout24AppLogo, { width: "80px", height: "51px" })),
                React.createElement(Divider, null),
                React.createElement(Stack, { align: "center", spacing: "2xl" },
                    React.createElement(AspectRatio, { ratio: 4 / 3, maxWidth: "400px", width: "full" },
                        React.createElement(chakra.img, { src: config[statusCode].illustration, alt: "a ".concat(statusCode, " error occurred.") })),
                    React.createElement(Stack, { align: "center", spacing: "md" },
                        React.createElement(H1, { textAlign: "center" }, t("errorPage.".concat(statusCode, ".title"))),
                        React.createElement(Text, { textAlign: "center" }, t("errorPage.".concat(statusCode, ".description"))),
                        React.createElement(Content, __assign({}, actionButtonProps))),
                    React.createElement(SimpleGrid, { columns: {
                            base: 1,
                            sm: config[statusCode].buttonColumns,
                        }, alignItems: "center", spacing: "md" },
                        React.createElement(PrimaryAction, __assign({}, actionButtonProps)),
                        React.createElement(SecondaryAction, __assign({}, actionButtonProps, { onButtonClick: onButtonClick }))))))));
};

export { ErrorPageContent as default };
//# sourceMappingURL=index.js.map
