@stokr/components-library 2.0.0-beta.3 → 2.0.0-beta.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/dist/api/fetchData.js +6 -5
  2. package/dist/components/2FA/Connect2FA.js +30 -19
  3. package/dist/components/2FA/EnterCode.js +4 -9
  4. package/dist/components/2FA/InstallAuthApp.js +3 -3
  5. package/dist/components/2FA/ResetCode.js +11 -4
  6. package/dist/components/2FA/Sucess2FA.js +15 -8
  7. package/dist/components/2FA/disable-2fa-flow.js +12 -136
  8. package/dist/components/2FA/enable-2fa-flow.js +27 -18
  9. package/dist/components/2FA/main-flow.js +22 -9
  10. package/dist/components/2FA/main-flow.stories.js +1 -1
  11. package/dist/components/ComponentScroll/ComponentScroll.js +4 -2
  12. package/dist/components/ComponentScroll/ComponentScroll.styles.js +7 -5
  13. package/dist/components/ComponentWrapper/ComponentWrapper.styles.js +9 -7
  14. package/dist/components/CryptoAddress/CryptoAddress.js +7 -4
  15. package/dist/components/ForgotPasswordModal/ForgotPasswordModal.stories.js +4 -1
  16. package/dist/components/Grid/Grid.styles.js +9 -2
  17. package/dist/components/Header/Header.js +9 -3
  18. package/dist/components/Header/Header.styles.js +1 -1
  19. package/dist/components/InfoIcon/InfoIcon.js +7 -2
  20. package/dist/components/LoginModal/LoginModal.js +9 -8
  21. package/dist/components/LoginModal/LoginModal.stories.js +8 -0
  22. package/dist/components/MainMenu/MainMenu.js +6 -16
  23. package/dist/components/MainMenu/MainMenu.styles.js +1 -1
  24. package/dist/components/Modal/Modal.styles.js +5 -2
  25. package/dist/components/RegisterConfirmModal/RegisterConfirmModal.js +10 -3
  26. package/dist/components/RegisterConfirmModal/RegisterConfirmModal.stories.js +6 -2
  27. package/dist/components/RegisterModal/RegisterModal.js +1 -22
  28. package/dist/components/ResetConfirmModal/ResetConfirmModal.styles.js +2 -3
  29. package/dist/components/Switch/Switch.js +16 -6
  30. package/dist/components/Switch/Switch.styles.js +3 -3
  31. package/dist/components/TermsModal/TermsModal.js +1 -1
  32. package/dist/components/TextLink/TextLink.styles.js +4 -2
  33. package/dist/components/VerifyEmailModal/VerifyEmailModal.js +163 -0
  34. package/dist/components/VerifyEmailModal/VerifyEmailModal.stories.js +64 -0
  35. package/dist/components/headerHo/HeaderHo.js +157 -93
  36. package/dist/components/headerHo/HeaderHo.stories.js +5 -1
  37. package/dist/constants/globalVariables.js +23 -2
  38. package/dist/context/Auth.js +54 -23
  39. package/dist/context/AuthContext.js +460 -339
  40. package/dist/firebase-config.js +1 -0
  41. package/dist/index.js +11 -0
  42. package/dist/static/images/avatar-placeholder.png +0 -0
  43. package/dist/utils/check-sale-time-left.js +120 -0
  44. package/dist/utils/customHooks.js +60 -2
  45. package/package.json +1 -1
package/dist/api/fetchData.js CHANGED
@@ -42,21 +42,22 @@ var fetchData = /*#__PURE__*/function () {
42
42
  });
43
43
  case 8:
44
44
  result = _context.sent;
45
+ console.log('🚀 ~ result:', result);
45
46
  // console.log(result);
46
47
 
47
48
  resolve(result.data);
48
- _context.next = 16;
49
+ _context.next = 17;
49
50
  break;
50
- case 12:
51
- _context.prev = 12;
51
+ case 13:
52
+ _context.prev = 13;
52
53
  _context.t0 = _context["catch"](5);
53
54
  console.log("Error: ".concat(_context.t0));
54
55
  reject(_context.t0);
55
- case 16:
56
+ case 17:
56
57
  case "end":
57
58
  return _context.stop();
58
59
  }
59
- }, _callee, null, [[5, 12]]);
60
+ }, _callee, null, [[5, 13]]);
60
61
  }));
61
62
  return function (_x3, _x4) {
62
63
  return _ref2.apply(this, arguments);
package/dist/components/2FA/Connect2FA.js CHANGED
@@ -7,50 +7,61 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.default = void 0;
8
8
  var _react = _interopRequireWildcard(require("react"));
9
9
  var _propTypes = _interopRequireDefault(require("prop-types"));
10
- var _RegisterEthereum = require("../RegisterEthereum");
11
10
  var _Text = _interopRequireDefault(require("../Text/Text.styles"));
12
11
  var _Button = _interopRequireDefault(require("../Button/Button.styles"));
13
- var _FAQ = _interopRequireDefault(require("../FAQ/FAQ"));
14
- var _SectionTitle = _interopRequireDefault(require("../SectionTitle/SectionTitle.styles"));
15
12
  var _ComponentWrapper = _interopRequireDefault(require("../ComponentWrapper/ComponentWrapper.styles"));
16
- var _ComponentScroll = _interopRequireDefault(require("../ComponentScroll/ComponentScroll"));
17
13
  var _Modal = require("../Modal/Modal.styles");
18
- var _StyledText = _interopRequireDefault(require("../Text/StyledText"));
19
14
  var _reactQrCode = _interopRequireDefault(require("react-qr-code"));
20
15
  var _Grid = require("../Grid/Grid.styles");
16
+ var _CryptoAddress = _interopRequireDefault(require("../CryptoAddress/CryptoAddress"));
17
+ var _reactDeviceDetect = require("react-device-detect");
18
+ var _TextLink = _interopRequireDefault(require("../TextLink/TextLink.styles"));
21
19
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
22
20
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
21
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
24
22
  var Connect2FA = function Connect2FA(props) {
25
- var _totpData$totpSecret;
23
+ var _totpData$totpSecret, _totpData$totpSecret2;
26
24
  var changeStep = props.changeStep,
27
- totpData = props.totpData;
25
+ totpData = props.totpData,
26
+ user = props.user;
28
27
  return /*#__PURE__*/_react.default.createElement(_Modal.ModalWrapper, null, /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
29
28
  part: 8
30
29
  }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
31
30
  modalTop: true
32
- }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "Connect two factor with stokr"), /*#__PURE__*/_react.default.createElement("p", null, "Scan the QR code on the right or enter secret key manually on your app to connect your account"))), /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
31
+ }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "Activate sign-in 2FA"), /*#__PURE__*/_react.default.createElement("p", null, "1. Open your authenticator app"), /*#__PURE__*/_react.default.createElement("p", null, "2. Scan the QR code or copy the set up key"))), /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
33
32
  modalBot: true
34
33
  })), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
35
34
  part: 8
36
- }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, null, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
37
- noPaddingTop: true,
35
+ }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, null, totpData && /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
36
+ center: true,
38
37
  noPaddingHorizontal: true
39
- }, /*#__PURE__*/_react.default.createElement(_Text.default, {
40
- small: true
41
- }, /*#__PURE__*/_react.default.createElement("p", null, "1. Start Google Authenticator or a similar app on your phone"), /*#__PURE__*/_react.default.createElement("p", null, "2. In the app, add a new account and scan the QR code below"), /*#__PURE__*/_react.default.createElement("p", null, "3. Click Continue when you are done"))), totpData && /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
42
- center: true
43
- }, /*#__PURE__*/_react.default.createElement(_reactQrCode.default, {
38
+ }, _reactDeviceDetect.isMobile ? /*#__PURE__*/_react.default.createElement(_TextLink.default, {
39
+ to: "otpauth://totp/".concat(user.email, "?secret=").concat((_totpData$totpSecret = totpData.totpSecret) === null || _totpData$totpSecret === void 0 ? void 0 : _totpData$totpSecret.secretKey, "&issuer=STOKR")
40
+ // onClick={() => {
41
+ // console.log(
42
+ // `otpauth://totp/${user.email}?secret=${totpData.totpSecret?.secretKey}&issuer=STOKR`,
43
+ // )
44
+ // }}
45
+ }, ' ', "Open authenticator app with this secret key") : /*#__PURE__*/_react.default.createElement(_reactQrCode.default, {
44
46
  size: 180
45
47
  //style={{ height: 'auto', maxWidth: '100%', width: '100%' }}
46
48
  ,
47
49
  value: totpData === null || totpData === void 0 ? void 0 : totpData.totpUri,
48
50
  viewBox: "0 0 256 256"
49
- }), /*#__PURE__*/_react.default.createElement("p", {
50
- style: {
51
- fontSize: 11
51
+ }), /*#__PURE__*/_react.default.createElement(_CryptoAddress.default, {
52
+ data: {
53
+ value: (_totpData$totpSecret2 = totpData.totpSecret) === null || _totpData$totpSecret2 === void 0 ? void 0 : _totpData$totpSecret2.secretKey,
54
+ tooltip: true
55
+ },
56
+ fontSize: 11,
57
+ wrapperStyle: {
58
+ paddingRight: 0
59
+ },
60
+ dataBoxStyle: {
61
+ width: '100%',
62
+ whiteSpace: 'nowrap'
52
63
  }
53
- }, (_totpData$totpSecret = totpData.totpSecret) === null || _totpData$totpSecret === void 0 ? void 0 : _totpData$totpSecret.secretKey)), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
64
+ })), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
54
65
  noPaddingTop: true,
55
66
  center: true,
56
67
  noPaddingHorizontal: true
package/dist/components/2FA/EnterCode.js CHANGED
@@ -34,19 +34,14 @@ var EnterCode = function EnterCode(props) {
34
34
  part: 8
35
35
  }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
36
36
  modalTop: true
37
- }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "Enter 6-Digits code from the app"), /*#__PURE__*/_react.default.createElement("p", null, 'Please put in the two-factor authentication code from your device'))), /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
37
+ }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "Enter 2FA code"), /*#__PURE__*/_react.default.createElement("p", null, "Enter the sign-in 2FA code from your authenticator app"))), /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
38
38
  modalBot: true
39
- }, /*#__PURE__*/_react.default.createElement(_Modal.ModalLinkWrap, null, /*#__PURE__*/_react.default.createElement(_Modal.ModalLink, {
39
+ }, onModalSwitch && /*#__PURE__*/_react.default.createElement(_Modal.ModalLinkWrap, null, /*#__PURE__*/_react.default.createElement(_Modal.ModalLink, {
40
40
  as: "button",
41
41
  onClick: onModalSwitch
42
42
  }, "Lost your device")))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
43
43
  part: 8
44
- }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, null, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
45
- noPaddingTop: true,
46
- noPaddingHorizontal: true
47
- }, /*#__PURE__*/_react.default.createElement(_Text.default, {
48
- small: true
49
- }, /*#__PURE__*/_react.default.createElement("p", null, "1. Start authenticator app on your phone"), /*#__PURE__*/_react.default.createElement("p", null, "2. Select connected STOKR account"), /*#__PURE__*/_react.default.createElement("p", null, "3. Copy the code below"))), /*#__PURE__*/_react.default.createElement(_formik.Formik, {
44
+ }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, null, /*#__PURE__*/_react.default.createElement(_formik.Formik, {
50
45
  initialValues: {
51
46
  otpInput: ''
52
47
  },
@@ -72,7 +67,7 @@ var EnterCode = function EnterCode(props) {
72
67
  setFieldValue('otpInput', e);
73
68
  setFieldTouched('otpInput');
74
69
  },
75
- label: "authentication code"
70
+ label: "2FA code"
76
71
  }), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
77
72
  show: errors.otpInput && touched.otpInput
78
73
  }, errors.otpInput))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
package/dist/components/2FA/InstallAuthApp.js CHANGED
@@ -27,7 +27,7 @@ var InstallAuthApp = function InstallAuthApp(props) {
27
27
  part: 8
28
28
  }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
29
29
  modalTop: true
30
- }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "Install two factor app"), /*#__PURE__*/_react.default.createElement("p", null, ' ', "In order to set up two-factor authentication you need to install one of the authenticator apps on your phone."))), /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
30
+ }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "Install 2FA APP"), /*#__PURE__*/_react.default.createElement("p", null, "Download and install a 2FA app on your device. We recommend using Google Authenticator"))), /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
31
31
  modalBot: true
32
32
  })), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
33
33
  part: 8
@@ -36,7 +36,7 @@ var InstallAuthApp = function InstallAuthApp(props) {
36
36
  noPaddingHorizontal: true
37
37
  }, /*#__PURE__*/_react.default.createElement(_Text.default, {
38
38
  small: true
39
- }, /*#__PURE__*/_react.default.createElement("p", null, "Click below to download Google Authenticator app. If you already have Google Authenticator installed or use a different Authenticator App, click Continue.", ' '))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
39
+ }, /*#__PURE__*/_react.default.createElement("p", null, "Click 'Continue' if you already have an app installed."))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
40
40
  noPaddingHorizontal: true,
41
41
  center: true
42
42
  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
@@ -46,7 +46,7 @@ var InstallAuthApp = function InstallAuthApp(props) {
46
46
  window.open('https://onelink.to/ev63j9', '_blank');
47
47
  },
48
48
  secondary: true
49
- }, "Get the app", ' ', /*#__PURE__*/_react.default.createElement("img", {
49
+ }, "DOWNLOAD THE APP", ' ', /*#__PURE__*/_react.default.createElement("img", {
50
50
  src: _google_auth.default,
51
51
  width: 20,
52
52
  style: {
package/dist/components/2FA/ResetCode.js CHANGED
@@ -33,14 +33,21 @@ var ResetCode = function ResetCode(props) {
33
33
  part: 8
34
34
  }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
35
35
  modalTop: true
36
- }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "Reset your 2FA"), /*#__PURE__*/_react.default.createElement("p", null, "Lost your device? No problem! We are here to help you"))), /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
36
+ }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "Lost your device?"), /*#__PURE__*/_react.default.createElement("p", null, "No problem! We are here to help you..."))), /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
37
37
  modalBot: true
38
- }, /*#__PURE__*/_react.default.createElement(_Modal.ModalLinkWrap, null, "Know your 2FA code?", ' ', /*#__PURE__*/_react.default.createElement(_Modal.ModalLink, {
38
+ }, /*#__PURE__*/_react.default.createElement(_Modal.ModalLinkWrap, null, /*#__PURE__*/_react.default.createElement(_Modal.ModalLink, {
39
39
  as: "button",
40
40
  onClick: onModalSwitch
41
- }, "Enter code")))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
41
+ }, "Enter 2FA code")))), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
42
42
  part: 8
43
- }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("p", null, "Please contact our support team at support@stokr.io to help you reset your 2fa"))))));
43
+ }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("p", null, "Contact us to reset your 2FA", ' ', /*#__PURE__*/_react.default.createElement("a", {
44
+ href: "https://stokr.zendesk.com/hc/en-us/requests/new",
45
+ target: "_blank",
46
+ rel: "noreferrer",
47
+ style: {
48
+ textDecoration: 'underline'
49
+ }
50
+ }, ' ', "https://stokr.zendesk.com/hc/en-us/requests/new")))))));
44
51
  };
45
52
  exports.ResetCode = ResetCode;
46
53
  var _default = ResetCode;
package/dist/components/2FA/Sucess2FA.js CHANGED
@@ -9,27 +9,34 @@ var _react = _interopRequireWildcard(require("react"));
9
9
  var _propTypes = _interopRequireDefault(require("prop-types"));
10
10
  var _Text = _interopRequireDefault(require("../Text/Text.styles"));
11
11
  var _Button = _interopRequireDefault(require("../Button/Button.styles"));
12
- var _SectionTitle = _interopRequireDefault(require("../SectionTitle/SectionTitle.styles"));
13
12
  var _ComponentWrapper = _interopRequireDefault(require("../ComponentWrapper/ComponentWrapper.styles"));
14
- var _ComponentScroll = _interopRequireDefault(require("../ComponentScroll/ComponentScroll"));
13
+ var _Grid = require("../Grid/Grid.styles");
15
14
  var _Modal = require("../Modal/Modal.styles");
16
15
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
16
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
18
17
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
19
18
  var Sucess2FA = function Sucess2FA(_ref) {
20
19
  var _onClick = _ref.onClick;
21
- return /*#__PURE__*/_react.default.createElement(_Modal.ModalWrapper, null, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, null, /*#__PURE__*/_react.default.createElement(_SectionTitle.default, null, "two factor authentication")), /*#__PURE__*/_react.default.createElement(_ComponentScroll.default, null, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
22
- noPaddingVertical: true
23
- }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "YOU successfully added 2FA"), /*#__PURE__*/_react.default.createElement("p", null, "Next time you login you will be asked to enter the code from your connected device"))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
24
- noPaddingHorizontal: true,
25
- center: true
20
+ return /*#__PURE__*/_react.default.createElement(_Modal.ModalWrapper, null, /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
21
+ part: 8
22
+ }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
23
+ modalTop: true
24
+ }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "Success! "))), /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
25
+ modalBot: true
26
+ })), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
27
+ part: 8
28
+ }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, null, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
29
+ noPaddingVertical: true,
30
+ noPaddingHorizontal: true
31
+ }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("p", null, "Your sign-in 2FA authentication is now set"))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
32
+ noPaddingHorizontal: true
26
33
  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
27
34
  minWidth: "240px",
28
35
  onClick: function onClick() {
29
36
  // deleteRedirectCookieAndNavigate()
30
37
  _onClick();
31
38
  }
32
- }, "Continue"))));
39
+ }, "Continue"))))));
33
40
  };
34
41
  exports.Sucess2FA = Sucess2FA;
35
42
  Sucess2FA.propTypes = {
package/dist/components/2FA/disable-2fa-flow.js CHANGED
@@ -7,12 +7,11 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.default = exports.Disable2FA = void 0;
8
8
  var _react = _interopRequireWildcard(require("react"));
9
9
  var _AuthContext = require("../../context/AuthContext");
10
- var _LoginModal = _interopRequireDefault(require("../LoginModal/LoginModal"));
11
10
  var _ComponentWrapper = _interopRequireDefault(require("../ComponentWrapper/ComponentWrapper.styles"));
12
11
  var _Modal = require("../Modal/Modal");
13
12
  var _Text = _interopRequireDefault(require("../Text/Text.styles"));
14
13
  var _Button = _interopRequireDefault(require("../Button/Button.styles"));
15
- var _excluded = ["showFlow", "setShowFlow", "onSuccess"];
14
+ var _excluded = ["showFlow", "setShowFlow", "onSuccess", "onRequiresRecentLoginError"];
16
15
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
16
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
18
17
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -36,30 +35,16 @@ var Disable2FA = function Disable2FA(_ref) {
36
35
  var showFlow = _ref.showFlow,
37
36
  setShowFlow = _ref.setShowFlow,
38
37
  onSuccess = _ref.onSuccess,
38
+ onRequiresRecentLoginError = _ref.onRequiresRecentLoginError,
39
39
  props = _objectWithoutProperties(_ref, _excluded);
40
40
  var _useContext = (0, _react.useContext)(_AuthContext.AuthContext),
41
- loginUser = _useContext.loginUser,
42
- user = _useContext.user,
43
41
  unenrollUser2FA = _useContext.unenrollUser2FA;
44
42
  var _useState = (0, _react.useState)({
45
- confirmDisable: false,
46
- login: false,
47
- enter2fa: false
43
+ confirmDisable: false
48
44
  }),
49
45
  _useState2 = _slicedToArray(_useState, 2),
50
46
  isModalOpen = _useState2[0],
51
47
  setIsModalOpen = _useState2[1];
52
- var _useState3 = (0, _react.useState)(),
53
- _useState4 = _slicedToArray(_useState3, 2),
54
- isActionLoading = _useState4[0],
55
- setIsActionLoading = _useState4[1];
56
- var _useState5 = (0, _react.useState)({
57
- popup: undefined,
58
- message: undefined
59
- }),
60
- _useState6 = _slicedToArray(_useState5, 2),
61
- popupError = _useState6[0],
62
- setPopupError = _useState6[1];
63
48
  (0, _react.useEffect)(function () {
64
49
  if (showFlow) {
65
50
  setIsModalOpen(_objectSpread(_objectSpread({}, isModalOpen), {}, {
@@ -67,22 +52,6 @@ var Disable2FA = function Disable2FA(_ref) {
67
52
  }));
68
53
  }
69
54
  }, [props.showFlow]);
70
- var switchOpenModal = function switchOpenModal(prevModalId, nextModalId) {
71
- var _objectSpread2;
72
- setIsModalOpen(_objectSpread(_objectSpread({}, isModalOpen), {}, (_objectSpread2 = {}, _defineProperty(_objectSpread2, prevModalId, false), _defineProperty(_objectSpread2, nextModalId, true), _objectSpread2)));
73
- };
74
- var handleSetPopupError = function handleSetPopupError(popup, message) {
75
- setPopupError({
76
- popup: popup,
77
- message: message
78
- });
79
- };
80
- var clearPopupError = function clearPopupError() {
81
- setPopupError({
82
- popup: undefined,
83
- message: undefined
84
- });
85
- };
86
55
  var handleDisableClick = /*#__PURE__*/function () {
87
56
  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
88
57
  return _regeneratorRuntime().wrap(function _callee$(_context) {
@@ -94,13 +63,16 @@ var Disable2FA = function Disable2FA(_ref) {
94
63
  case 3:
95
64
  setShowFlow(false);
96
65
  onSuccess && onSuccess();
97
- _context.next = 10;
66
+ _context.next = 11;
98
67
  break;
99
68
  case 7:
100
69
  _context.prev = 7;
101
70
  _context.t0 = _context["catch"](0);
102
- console.log('🚀 ~ file: disable-2fa-flow.js:54 ~ error:', _context.t0);
103
- case 10:
71
+ console.log('🚀 ~ file: disable-2fa-flow.js ~ error:', _context.t0);
72
+ if (_context.t0.code === 'auth/requires-recent-login') {
73
+ onRequiresRecentLoginError && onRequiresRecentLoginError();
74
+ }
75
+ case 11:
104
76
  case "end":
105
77
  return _context.stop();
106
78
  }
@@ -116,7 +88,7 @@ var Disable2FA = function Disable2FA(_ref) {
116
88
  //setIsModalOpen({ ...isModalOpen, confirmDisable: false })
117
89
  setShowFlow(false);
118
90
  }
119
- }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h5", null, "Remove two factor authentication"), /*#__PURE__*/_react.default.createElement("p", null, "Are you sure you want to remove two factor authentication?")), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
91
+ }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h5", null, "Do you want to remove your sign-in 2FA authentication? ")), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
120
92
  alignVertically: true,
121
93
  noPaddingHorizontal: true
122
94
  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
@@ -127,105 +99,9 @@ var Disable2FA = function Disable2FA(_ref) {
127
99
  onClick: function onClick() {
128
100
  return setShowFlow(false);
129
101
  }
130
- }, "Cancel"), /*#__PURE__*/_react.default.createElement(_Button.default, {
102
+ }, "NO"), /*#__PURE__*/_react.default.createElement(_Button.default, {
131
103
  onClick: handleDisableClick
132
- }, "Yes")))), /*#__PURE__*/_react.default.createElement(_LoginModal.default, {
133
- isActionLoading: isActionLoading,
134
- popupError: popupError
135
- //background={backgroundProp}
136
- ,
137
- isModalOpen: isModalOpen.login,
138
- onModalClose: function onModalClose() {
139
- window.location.href = 'https://stokr.info/';
140
- },
141
- onModalSwitch: function onModalSwitch() {
142
- window.location.href = 'https://stokr.info/signup';
143
- },
144
- onForgotPassword: function onForgotPassword() {
145
- switchOpenModal('login', 'forgot');
146
- clearPopupError();
147
- setIsActionLoading(undefined);
148
- },
149
- onFormSend: /*#__PURE__*/function () {
150
- var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(_ref3) {
151
- var email, password;
152
- return _regeneratorRuntime().wrap(function _callee2$(_context2) {
153
- while (1) switch (_context2.prev = _context2.next) {
154
- case 0:
155
- email = _ref3.email, password = _ref3.password;
156
- clearPopupError();
157
- setIsActionLoading('login');
158
- _context2.prev = 3;
159
- if (!(password.length > 128)) {
160
- _context2.next = 8;
161
- break;
162
- }
163
- handleSetPopupError('login', 'Your password cannot exceed 128 characters');
164
- setIsActionLoading(undefined);
165
- return _context2.abrupt("return");
166
- case 8:
167
- _context2.next = 10;
168
- return loginUser(email, password);
169
- case 10:
170
- _context2.next = 22;
171
- break;
172
- case 12:
173
- _context2.prev = 12;
174
- _context2.t0 = _context2["catch"](3);
175
- _context2.t1 = _context2.t0.code;
176
- _context2.next = _context2.t1 === 'auth/multi-factor-auth-required' ? 17 : 19;
177
- break;
178
- case 17:
179
- // Initiate your second factor sign-in flow. (See next step.)
180
- // ...
181
- switchOpenModal('login', 'enter2fa');
182
- return _context2.abrupt("break", 21);
183
- case 19:
184
- console.log({
185
- error: _context2.t0
186
- }); // Handle other errors, such as wrong passwords.
187
- return _context2.abrupt("break", 21);
188
- case 21:
189
- // const errorMessage =
190
- // error &&
191
- // error.response &&
192
- // error.response.data === 'E_AUTH_OBJECTNOTFOUND::User'
193
- // ? error.response.data
194
- // : error.response.data.error_description
195
-
196
- // if (errorMessage === 'E_AUTH_USERNOTACTIVATED') {
197
- // handleSetPopupError(
198
- // 'login',
199
- // "You're not activated. We're sending you an activation email right now.",
200
- // )
201
- // } else if (errorMessage === 'E_AUTH_PASSWORDINCORRECT') {
202
- // handleSetPopupError(
203
- // 'login',
204
- // 'The password is not correct. Try again?',
205
- // )
206
- // } else if (errorMessage === 'E_AUTH_OBJECTNOTFOUND::User') {
207
- // handleSetPopupError(
208
- // 'login',
209
- // "This email is not registered. Are you sure that's the right one?",
210
- // )
211
- // } else {
212
- // handleSetPopupError(
213
- // 'login',
214
- // "Oops. Something's not right there. Try again?",
215
- // )
216
- // }
217
- setIsActionLoading(undefined);
218
- case 22:
219
- case "end":
220
- return _context2.stop();
221
- }
222
- }, _callee2, null, [[3, 12]]);
223
- }));
224
- return function (_x) {
225
- return _ref4.apply(this, arguments);
226
- };
227
- }()
228
- }));
104
+ }, "Yes")))));
229
105
  };
230
106
  exports.Disable2FA = Disable2FA;
231
107
  var _default = Disable2FA;
package/dist/components/2FA/enable-2fa-flow.js CHANGED
@@ -47,6 +47,13 @@ var Enable2FAFlow = function Enable2FAFlow(_ref) {
47
47
  _useState4 = _slicedToArray(_useState3, 2),
48
48
  totpData = _useState4[0],
49
49
  settotpData = _useState4[1];
50
+ var _useState5 = (0, _react.useState)({
51
+ popup: undefined,
52
+ message: undefined
53
+ }),
54
+ _useState6 = _slicedToArray(_useState5, 2),
55
+ popupError = _useState6[0],
56
+ setpopupError = _useState6[1];
50
57
  (0, _react.useEffect)(function () {
51
58
  if (user) {
52
59
  generateTotpSecret(user).then(function (data) {
@@ -54,7 +61,7 @@ var Enable2FAFlow = function Enable2FAFlow(_ref) {
54
61
  return;
55
62
  }).catch(function (error) {
56
63
  console.log(error);
57
- if (error.code === 'auth/requires-recent-login') {
64
+ if (error.code === 'auth/requires-recent-login' || error.code === 'auth/unsupported-first-factor') {
58
65
  onRequiresRecentLoginError && onRequiresRecentLoginError();
59
66
  }
60
67
  });
@@ -76,20 +83,33 @@ var Enable2FAFlow = function Enable2FAFlow(_ref) {
76
83
  return enrollUserToTotp(user, totpData.totpSecret, data.otpInput, user.displayName);
77
84
  case 5:
78
85
  setshowSuccess(true);
79
- _context.next = 13;
86
+ _context.next = 17;
80
87
  break;
81
88
  case 8:
82
89
  _context.prev = 8;
83
90
  _context.t0 = _context["catch"](2);
84
91
  console.log('🚀 ~ file: enable-2fa-flow.js:60 ~ error:', _context.t0);
85
92
  if (!(_context.t0.code === 'auth/invalid-verification-code')) {
86
- _context.next = 13;
93
+ _context.next = 16;
87
94
  break;
88
95
  }
96
+ setpopupError({
97
+ popup: 'enter2fa',
98
+ message: 'That’s not the right 2FA code. Try again'
99
+ });
89
100
  return _context.abrupt("return", {
90
101
  otpInput: 'Invalid code'
91
102
  });
92
- case 13:
103
+ case 16:
104
+ if (_context.t0.code === 'auth/requires-recent-login') {
105
+ onRequiresRecentLoginError && onRequiresRecentLoginError();
106
+ } else {
107
+ setpopupError({
108
+ popup: 'enter2fa',
109
+ message: "".concat(_context.t0 !== null && _context.t0 !== void 0 && _context.t0.message ? _context.t0 === null || _context.t0 === void 0 ? void 0 : _context.t0.message : 'Something went wrong. Try again?')
110
+ });
111
+ }
112
+ case 17:
93
113
  case "end":
94
114
  return _context.stop();
95
115
  }
@@ -100,18 +120,6 @@ var Enable2FAFlow = function Enable2FAFlow(_ref) {
100
120
  };
101
121
  }();
102
122
  var onBackButtonClick = function onBackButtonClick(stepController, prevStepIndex) {
103
- if (prevStepIndex === 0) {
104
- //setselectedProject({})
105
- }
106
- // if (prevStepIndex === 0 || prevStepIndex === 1) {
107
- // setWallet(null)
108
- // setAddressToRegister(null)
109
- // setNameToRegister(null)
110
- // setRegisteredAddress(false)
111
- // setError('')
112
- // setverifiedAddress(false)
113
- // }
114
-
115
123
  stepController.changeStep(stepsNames[prevStepIndex], prevStepIndex);
116
124
  };
117
125
  return /*#__PURE__*/_react.default.createElement(_Modal.Modal, {
@@ -161,13 +169,14 @@ var Enable2FAFlow = function Enable2FAFlow(_ref) {
161
169
  changeStep: function changeStep() {
162
170
  return stepController.changeStep('enter-code', 2, 1);
163
171
  },
164
- totpData: totpData
172
+ totpData: totpData,
173
+ user: user
165
174
  }), /*#__PURE__*/_react.default.createElement(_EnterCode.default, {
166
175
  id: "enter-code",
167
176
  changeStep: function changeStep() {
168
177
  console.log('here');
169
178
  },
170
- popupError: {},
179
+ popupError: popupError,
171
180
  onFormSend: onSubmit
172
181
  })));
173
182
  }))));
package/dist/components/2FA/main-flow.js CHANGED
@@ -15,6 +15,8 @@ var _Button = _interopRequireDefault(require("../Button/Button.styles"));
15
15
  var _loginWithOtpFlow = _interopRequireDefault(require("./login-with-otp-flow"));
16
16
  var _enable2faFlow = _interopRequireDefault(require("./enable-2fa-flow"));
17
17
  var _disable2faFlow = _interopRequireDefault(require("./disable-2fa-flow"));
18
+ var _colors = _interopRequireDefault(require("../../styles/colors"));
19
+ var _InfoIcon = _interopRequireDefault(require("../InfoIcon/InfoIcon"));
18
20
  var _excluded = ["onRequiresRecentLoginError"];
19
21
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
20
22
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -78,13 +80,24 @@ var Main2FAFlow = function Main2FAFlow(_ref) {
78
80
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
79
81
  alignVertically: true,
80
82
  noPaddingHorizontal: true
81
- }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h5", null, "set up two factor authentication"))), /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("p", null, "Add additional security to your STOKR experience")), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
83
+ }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h5", null, "SET UP YOUR SIGN-IN TWO FACTOR AUTHENTICATION"))), /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("p", null, "Protect your account with an additional layer of security to sign in")), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
82
84
  noPaddingHorizontal: true
85
+ }, /*#__PURE__*/_react.default.createElement(_InfoIcon.default, {
86
+ position: 'top',
87
+ html: is2FAEnabled ? 'Enabled' : 'Disabled',
88
+ noIcon: true,
89
+ noMarginLeft: true
83
90
  }, /*#__PURE__*/_react.default.createElement(_Switch.default, {
84
- value1: "enabled",
85
- value2: "disabled",
91
+ value1: "disabled",
92
+ value2: "enabled",
93
+ value1Color: _colors.default.orangishRed,
94
+ value2Color: _colors.default.freshGreen,
86
95
  value: is2FAEnabled ? 'enabled' : 'disabled',
87
96
  revertToPrevious: true,
97
+ hideValues: true,
98
+ indicatorStyle: {
99
+ margin: 0
100
+ },
88
101
  handleChange: function handleChange(value) {
89
102
  if (value === 'enabled') {
90
103
  switchOpenFlow('disable2fa', 'enable2fa');
@@ -92,11 +105,10 @@ var Main2FAFlow = function Main2FAFlow(_ref) {
92
105
  switchOpenFlow('enable2fa', 'disable2fa');
93
106
  }
94
107
  }
95
- })), is2FAEnabled && /*#__PURE__*/_react.default.createElement(_Button.default, {
96
- minWidth: "150px"
97
- }, "change settings"), successMessage && /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
108
+ }))), successMessage && /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
98
109
  alignVertically: true,
99
- noPaddingHorizontal: true
110
+ noPaddingHorizontal: true,
111
+ noPaddingTop: true
100
112
  }, /*#__PURE__*/_react.default.createElement(_Text.default, {
101
113
  small: true,
102
114
  success: true
@@ -110,7 +122,7 @@ var Main2FAFlow = function Main2FAFlow(_ref) {
110
122
  onRequiresRecentLoginError: onRequiresRecentLoginError,
111
123
  onSuccess: function onSuccess() {
112
124
  setis2FAEnabled(true);
113
- setsuccessMessage('You successfully enabled two factor authentication');
125
+ setsuccessMessage('Your sign-in 2FA authentication is now set');
114
126
  }
115
127
  }), isFlowopen.disable2fa && /*#__PURE__*/_react.default.createElement(_disable2faFlow.default, {
116
128
  showFlow: isFlowopen.disable2fa,
@@ -119,9 +131,10 @@ var Main2FAFlow = function Main2FAFlow(_ref) {
119
131
  disable2fa: value
120
132
  }));
121
133
  },
134
+ onRequiresRecentLoginError: onRequiresRecentLoginError,
122
135
  onSuccess: function onSuccess() {
123
136
  setis2FAEnabled(false);
124
- setsuccessMessage('You successfully disabled two factor authentication');
137
+ setsuccessMessage('Your sign-in 2FA authentication is now disabled');
125
138
  }
126
139
  }), !user && /*#__PURE__*/_react.default.createElement(_loginWithOtpFlow.default, null));
127
140
  };
package/dist/components/2FA/main-flow.stories.js CHANGED
@@ -28,7 +28,7 @@ var _default = {
28
28
  };
29
29
  exports.default = _default;
30
30
  var Template = function Template(args) {
31
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react.default.createElement(_AuthContext.AuthProvider, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_mainFlow.default, args))));
31
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react.default.createElement(_AuthContext.AuthProvider, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_mainFlow.default, args), /*#__PURE__*/_react.default.createElement("p", null, "some text"))));
32
32
  };
33
33
  var MainFlow = Template.bind({});
34
34
  exports.MainFlow = MainFlow;