import { __assign } from '../../node_modules/tslib/tslib.es6.js';
import React from 'react';
import { useI18n } from '@smg-automotive/i18n-pkg';
import { Image, Text } from '@chakra-ui/react';
import { H1 } from '../heading/index.js';
import Button from '../button/index.js';
import img from './tenantSelectionIllustration.png.js';
import { TenantSelectionModalLayout } from './ModalLayout.js';
import { createTenantLabel } from './createTenantLabel.js';

var TenantSelectionOverview = function (_a) {
    var tenantSelection = _a.tenantSelection, setTenantSelection = _a.setTenantSelection, user = _a.user, selectTenant = _a.selectTenant;
    var t = useI18n().t;
    var getSelectButtonLabel = function () {
        if (!tenantSelection.selectedTenant)
            return t('auth.tenantSelection.selectButton');
        var selectedManagedSeller = user.managedSellers.find(function (managedSeller) {
            return managedSeller.id === tenantSelection.selectedTenant;
        });
        return createTenantLabel(selectedManagedSeller);
    };
    return (React.createElement(TenantSelectionModalLayout, null,
        React.createElement(Image, { src: img, alt: "tenant selection illustration", width: "120px", height: "120px", loading: "lazy" }),
        React.createElement(H1, { textStyle: "heading3" }, t('auth.tenantSelection.title')),
        React.createElement(Text, { textAlign: "center" }, t('auth.tenantSelection.description')),
        React.createElement(Button, { variant: "secondary", onClick: function () {
                setTenantSelection(function (currentState) {
                    return __assign(__assign({}, currentState), { showSelection: true });
                });
            }, width: "full" }, getSelectButtonLabel()),
        React.createElement(Button, { isDisabled: !tenantSelection.selectedTenant, onClick: function () {
                if (!tenantSelection.selectedTenant)
                    return;
                selectTenant(tenantSelection.selectedTenant);
            }, width: "full" }, t('auth.tenantSelection.loginButton'))));
};

export { TenantSelectionOverview };
//# sourceMappingURL=Overview.js.map
