@stokr/components-library/dist/components/2FA/enable-2fa-flow.js

STOKR - Components Library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _Modal = require("../Modal/Modal");
var _StepController = _interopRequireDefault(require("../StepController/StepController"));
var _StepControllerContext = require("../StepController/StepControllerContext");
var _InstallAuthApp = _interopRequireDefault(require("./InstallAuthApp"));
var _Connect2FA = _interopRequireDefault(require("./Connect2FA"));
var _EnterCode = _interopRequireDefault(require("./EnterCode"));
var _AuthContext = require("../../context/AuthContext");
var _Sucess2FA = _interopRequireDefault(require("./Sucess2FA"));
var _fetchData = _interopRequireDefault(require("../../api/fetchData"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
const stepsNames = ['app', 'connect', 'enter-code'];
const Enable2FAFlow = _ref => {
  let {
    showFlow,
    setShowFlow,
    onSuccess,
    totpData,
    onRequiresRecentLoginError
  } = _ref;
  const {
    user,
    enrollUserToTotp,
    refreshIdToken
  } = (0, _react.useContext)(_AuthContext.AuthContext);
  const [showSuccess, setshowSuccess] = (0, _react.useState)(false);
  const [popupError, setpopupError] = (0, _react.useState)({
    popup: undefined,
    message: undefined
  });
  (0, _react.useEffect)(() => {
    if (user) {
      refreshToken();
    }
  }, [user]);
  const refreshToken = async () => {
    try {
      refreshIdToken();
    } catch (error) {
      console.log('🚀 ~ error in refreshToken:', error);
    }
  };
  const onSubmit = async data => {
    if (!user || !data) return console.log('not enough data');
    try {
      await enrollUserToTotp(user, totpData.totpSecret, data.otpInput, user.displayName);
      setshowSuccess(true);
      try {
        await (0, _fetchData.default)('auth/enable-2fa-email');
      } catch (error) {
        console.log('🚀 ~ error while sending email:', error);
      }
    } catch (error) {
      console.log('🚀 ~ file: enable-2fa-flow.js:60 ~ error:', error);
      if (error.code === 'auth/invalid-verification-code') {
        setpopupError({
          popup: 'enter2fa',
          message: 'That’s not the right 2FA code. Try again'
        });
        return {
          otpInput: 'Invalid code'
        };
      } else if (error.code === 'auth/requires-recent-login') {
        onRequiresRecentLoginError && onRequiresRecentLoginError();
      } else {
        setpopupError({
          popup: 'enter2fa',
          message: "".concat(error !== null && error !== void 0 && error.message ? error === null || error === void 0 ? void 0 : error.message : 'Something went wrong. Try again?')
        });
      }
    }
  };
  const onBackButtonClick = (stepController, prevStepIndex) => {
    stepController.changeStep(stepsNames[prevStepIndex], prevStepIndex);
  };
  return /*#__PURE__*/_react.default.createElement(_Modal.Modal, {
    isOpen: showFlow,
    onClose: () => setShowFlow(false)
  }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
    noPadding: true
  }, showSuccess ? /*#__PURE__*/_react.default.createElement(_Sucess2FA.default, {
    onClick: () => {
      setshowSuccess(false);
      setShowFlow(false);
      onSuccess && onSuccess();
    },
    subTitleLeft: "Your log in 2FA authentication is now set",
    textRight: "You will now be asked for your 2FA code next time you log in."
  }) : /*#__PURE__*/_react.default.createElement(_StepControllerContext.StepControllerProvider, null, /*#__PURE__*/_react.default.createElement(_StepControllerContext.StepControllerConsumer, null, stepController => {
    const prevStepIndex = stepController.activeStepIndex - 1;
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Modal.ModalBack, {
      onClick: () => onBackButtonClick(stepController, prevStepIndex),
      hide: stepController.activeStepIndex === 0
    }), /*#__PURE__*/_react.default.createElement(_StepController.default, _extends({
      stepsProgressList: [{
        id: 'app',
        handleClick: () => {
          stepController.changeStep('app', 0);
        }
      }, {
        id: 'connect',
        handleClick: () => {
          stepController.changeStep('connect', 1);
        }
      }, {
        id: 'enter-code',
        handleClick: () => stepController.changeStep('enter-code', 2)
      }]
    }, stepController), /*#__PURE__*/_react.default.createElement(_InstallAuthApp.default, {
      id: "app",
      changeStep: () => stepController.changeStep('connect', 1, 0)
    }), /*#__PURE__*/_react.default.createElement(_Connect2FA.default, {
      id: "connect",
      changeStep: () => stepController.changeStep('enter-code', 2, 1),
      totpData: totpData,
      user: user
    }), /*#__PURE__*/_react.default.createElement(_EnterCode.default, {
      id: "enter-code",
      changeStep: () => {
        // console.log('here')
      },
      popupError: popupError,
      onFormSend: onSubmit
    })));
  }))));
};
var _default = exports.default = Enable2FAFlow;