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);
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
var __generator = (this && this.__generator) || function (thisArg, body) {
    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
    function verb(n) { return function (v) { return step([n, v]); }; }
    function step(op) {
        if (f) throw new TypeError("Generator is already executing.");
        while (_) try {
            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
            if (y = 0, t) op = [op[0] & 2, t.value];
            switch (op[0]) {
                case 0: case 1: t = op; break;
                case 4: _.label++; return { value: op[1], done: false };
                case 5: _.label++; y = op[1]; op = [0]; continue;
                case 7: op = _.ops.pop(); _.trys.pop(); continue;
                default:
                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
                    if (t[2]) _.ops.pop();
                    _.trys.pop(); continue;
            }
            op = body.call(thisArg, _);
        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
    }
};
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useEffect, useState } from 'react';
import { useSelector, useDispatch } from 'react-redux';
import { base64toFile, SwButton } from 'sw-web-shared';
import { useHistory } from 'react-router-dom';
import { Box, Button, Typography } from '@mui/material';
import { currentCommunity } from '../store/sw-auth.reducer';
import { resetUIState } from '../store/store';
import { loadingFinished, startLoading } from '../store/sw-ui-reducer';
import { currentUserState } from '../store/sw-user-data.reducer';
import { isCoreTeamMember, joinCommunity } from '../services/web3/web3Service';
import ErrorBox from '../components/ErrorBox';
import { ErrorTypes } from '../types/error-types';
import BackButton from '../components/BackButton';
import { uploadFile } from '../services/textile/textile.hub';
var PartnerUserRole = function (props) {
    var history = useHistory();
    var dispatch = useDispatch();
    var _a = useState(undefined), errorData = _a[0], setErrorData = _a[1];
    var community = useSelector(currentCommunity);
    var userState = useSelector(currentUserState);
    var _b = useState([]), memberRoles = _b[0], setMemberRoles = _b[1];
    var _c = useState(undefined), selectedRole = _c[0], setSelectedRole = _c[1];
    useEffect(function () {
        var fetchData = function () { return __awaiter(void 0, void 0, void 0, function () {
            return __generator(this, function (_a) {
                switch (_a.label) {
                    case 0:
                        dispatch(startLoading('Checking membership.'));
                        return [4 /*yield*/, isCoreTeamMember(community.communityAddress, window.ethereum.selectedAddress)
                                .then(function (result) {
                                var roles = community.properties.skills.roles;
                                var newUserRolesBaseId = 4;
                                var filteredRoles = roles
                                    .filter(function (r) { return r.isCoreTeamMember === result; })
                                    .map(function (curr, index) {
                                    var roleName = curr.roleName;
                                    var roleId;
                                    if (roleId <= 3) {
                                        roleId = curr.id;
                                    }
                                    else {
                                        roleId = newUserRolesBaseId + index;
                                    }
                                    return { roleId: roleId, roleName: roleName };
                                });
                                setMemberRoles(filteredRoles);
                                dispatch(loadingFinished());
                            })
                                .catch(function (e) {
                                console.log(e);
                                setErrorData({
                                    errorMessage: e.message,
                                    actionLabel: 'Retry',
                                    action: function () {
                                        setErrorData(undefined);
                                        fetchData();
                                    },
                                });
                                dispatch(loadingFinished());
                            })];
                    case 1:
                        _a.sent();
                        return [2 /*return*/];
                }
            });
        }); };
        fetchData();
    }, []);
    var handleJoinClicked = function () { return __awaiter(void 0, void 0, void 0, function () {
        var _a;
        return __generator(this, function (_b) {
            switch (_b.label) {
                case 0:
                    dispatch(startLoading('Uploading user image.'));
                    _a = uploadFile;
                    return [4 /*yield*/, base64toFile(userState.profileImageUrl, 'avatar')];
                case 1: return [4 /*yield*/, _a.apply(void 0, [_b.sent()])
                        .then(function (imageUrl) { return __awaiter(void 0, void 0, void 0, function () {
                        return __generator(this, function (_a) {
                            switch (_a.label) {
                                case 0: return [4 /*yield*/, joinCommunity(community.address, userState.username, imageUrl, selectedRole, 10, dispatch)
                                        .then(function (result) { return __awaiter(void 0, void 0, void 0, function () {
                                        return __generator(this, function (_a) {
                                            console.log('successful join');
                                            history.push('/qr');
                                            return [2 /*return*/];
                                        });
                                    }); })
                                        .catch(function (e) {
                                        console.log(e);
                                        if (e.message === ErrorTypes.CommunitySlotsFull ||
                                            e.message === ErrorTypes.AlreadyAMember ||
                                            e.message === ErrorTypes.SkillWalletWithThisAddressAlreadyRegistered) {
                                            setErrorData({
                                                errorMessage: e.message,
                                                actionLabel: 'Back to Home',
                                                action: function () {
                                                    dispatch(resetUIState);
                                                    history.push('/');
                                                },
                                            });
                                        }
                                        else {
                                            console.log(e);
                                            setErrorData({
                                                errorMessage: e.message,
                                                actionLabel: 'Retry',
                                                action: function () {
                                                    setErrorData(undefined);
                                                    handleJoinClicked();
                                                },
                                            });
                                        }
                                        dispatch(loadingFinished());
                                    })];
                                case 1:
                                    _a.sent();
                                    return [2 /*return*/];
                            }
                        });
                    }); })
                        .catch(function (e) {
                        console.log(e);
                        setErrorData({
                            errorMessage: e.message,
                            actionLabel: 'Retry',
                            action: function () {
                                setErrorData(undefined);
                                handleJoinClicked();
                            },
                        });
                        dispatch(loadingFinished());
                    })];
                case 2:
                    _b.sent();
                    return [2 /*return*/];
            }
        });
    }); };
    var handleRoleSelected = function (role) {
        setSelectedRole(role);
    };
    var handleBackClick = function () { return __awaiter(void 0, void 0, void 0, function () {
        return __generator(this, function (_a) {
            history.goBack();
            return [2 /*return*/];
        });
    }); };
    return (_jsx(Box, __assign({ sx: {
            width: '100%',
            minHeight: '460px',
            display: 'flex',
            justifyContent: 'space-around',
            flexDirection: 'column',
            alignItems: 'center',
            py: '16px',
        } }, { children: errorData ? (_jsx(ErrorBox, { errorData: errorData }, void 0)) : (_jsxs(_Fragment, { children: [_jsxs(Box, __assign({ sx: {
                        width: '100%',
                        display: 'flex',
                        justifyContent: 'space-between',
                        alignContent: 'center',
                        my: '17px',
                    } }, { children: [_jsx(BackButton, { handleClick: handleBackClick }, void 0), _jsx(Box, __assign({ sx: {
                                display: 'flex',
                                flexDirection: 'column',
                                justifyContent: 'center',
                                alignItems: 'center',
                            } }, { children: _jsx(Typography, __assign({ align: "center", variant: "h2", sx: { fontWeight: '400', maxWidth: '320px', mb: '15px' } }, { children: "Pick your Role in your Community - and let it be known for the generations to come!" }), void 0) }), void 0), _jsx(Box, { sx: {
                                width: '45px',
                                height: '45px',
                            } }, void 0)] }), void 0), _jsxs(Box, __assign({ sx: {
                        width: '100%',
                        display: 'flex',
                        justifyContent: 'center',
                        flexDirection: 'column',
                        alignItems: 'center',
                    } }, { children: [_jsx(Box, __assign({ sx: {
                                py: '24px',
                                mb: '40px',
                                display: 'flex',
                                flexDirection: 'column',
                                alignItems: 'center',
                                justifyContent: 'center',
                                gridGap: '20px',
                                minWidth: '383px',
                                border: 2,
                                borderColor: 'secondary',
                                backgroundColor: '#FFFFFF',
                            } }, { children: memberRoles &&
                                memberRoles.map(function (role, index) {
                                    return (_jsx(SwButton, __assign({ sx: {
                                            maxWidth: '212px',
                                            maxHeight: '44px',
                                        }, className: selectedRole && selectedRole.roleId === role.roleId ? 'active-link' : '', mode: "dark", btnType: "large", onClick: function () { return handleRoleSelected(role); } }, { children: _jsx(Typography, __assign({ variant: "h3" }, { children: role.roleName }), void 0) }), index));
                                }) }), void 0), _jsx(SwButton, { sx: {
                                whiteSpace: 'nowrap',
                                borderColor: 'primary.main',
                                height: '75px',
                                maxWidth: '383px',
                            }, mode: "dark", component: Button, onClick: handleJoinClicked, disabled: !selectedRole, label: "That's it - join this community!" }, void 0)] }), void 0)] }, void 0)) }), void 0));
};
export default PartnerUserRole;
