var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { SwButton } from 'sw-web-shared';
import { Link } from 'react-router-dom';
import { Box, Typography } from '@mui/material';
import { useSelector } from 'react-redux';
import { ReactComponent as PlusIcon } from '../assets/create-unsel.svg';
import { ReactComponent as SwIcon } from '../assets/sw-logo-icon.svg';
import { swData } from '../store/sw-auth.reducer';
var LoginWith = function (props) {
    var swState = useSelector(swData);
    return (_jsxs(Box, __assign({ sx: {
            width: '100%',
            minHeight: '460px',
            display: 'flex',
            justifyContent: 'space-around',
            flexDirection: 'column',
            alignItems: 'center',
        } }, { children: [_jsxs(Box, __assign({ sx: {
                    display: 'flex',
                    justifyContent: 'center',
                    gap: '30px',
                } }, { children: [_jsx(Box, { sx: { width: '60px', height: '53px' }, component: "img", src: "https://dito-assets.s3.eu-west-1.amazonaws.com/wallet-white.svg" }, void 0), _jsx(Typography, __assign({ variant: "h1", sx: { textDecorationLine: 'underline', my: 'auto', fontWeight: '400' } }, { children: "Login With" }), void 0)] }), void 0), _jsxs(Box, __assign({ sx: {
                    width: '100%',
                    display: 'flex',
                    justifyContent: 'center',
                    flexDirection: 'column',
                    alignItems: 'center',
                    gap: '30px',
                } }, { children: [_jsx(SwButton, { sx: {
                            borderColor: 'primary.main',
                        }, btnType: "large", startIcon: _jsx(SwIcon, {}, void 0), mode: "dark", component: Link, disabled: swState.partnerMode, to: "/skillwallet", label: swState.partnerMode ? 'Existing Partner' : 'SkillWallet' }, void 0), _jsx(SwButton, { sx: {
                            borderColor: 'primary.main',
                        }, btnType: "large", startIcon: _jsx(PlusIcon, {}, void 0), mode: "dark", disabled: swState.disableCreateNewUser, component: Link, to: "/newuser", label: swState.isPartner ? 'New Partner' : 'New User' }, void 0)] }), void 0)] }), void 0));
};
export default LoginWith;
