@stokr/components-library 1.1.8-beta.6 → 1.1.8-beta.8

package/dist/components/2FA/login-with-otp-flow.js

@@ -40,7 +40,8 @@ var LoginWithOTP = function LoginWithOTP(_ref) {
     loginUser = _useContext.loginUser,
     waitingFor2fa = _useContext.waitingFor2fa,
     firebaseError = _useContext.firebaseError,
-    loginUserWithTotp = _useContext.loginUserWithTotp;
+    loginUserWithTotp = _useContext.loginUserWithTotp,
+    getUser = _useContext.getUser;
   var _useState = (0, _react.useState)({
       login: true,
       enter2fa: false,
@@ -143,10 +144,13 @@ var LoginWithOTP = function LoginWithOTP(_ref) {
               _context.next = 10;
               return loginUser(email, password);
             case 10:
-              _context.next = 17;
-              break;
+              _context.next = 12;
+              return getUser();
             case 12:
-              _context.prev = 12;
+              _context.next = 19;
+              break;
+            case 14:
+              _context.prev = 14;
               _context.t0 = _context["catch"](3);
               errorMessage = _context.t0 === null || _context.t0 === void 0 ? void 0 : _context.t0.message;
               if (errorMessage) {
@@ -155,11 +159,11 @@ var LoginWithOTP = function LoginWithOTP(_ref) {
                 handleSetPopupError('login', "Oops. Something's not right there. Try again?");
               }
               setIsActionLoading(undefined);
-            case 17:
+            case 19:
             case "end":
               return _context.stop();
           }
-        }, _callee, null, [[3, 12]]);
+        }, _callee, null, [[3, 14]]);
       }));
       return function (_x) {
         return _ref3.apply(this, arguments);
@@ -193,10 +197,13 @@ var LoginWithOTP = function LoginWithOTP(_ref) {
               _context2.next = 5;
               return loginUserWithTotp(otpInput, firebaseError);
             case 5:
-              _context2.next = 11;
-              break;
+              _context2.next = 7;
+              return getUser();
             case 7:
-              _context2.prev = 7;
+              _context2.next = 13;
+              break;
+            case 9:
+              _context2.prev = 9;
               _context2.t0 = _context2["catch"](2);
               console.log('🚀 ~ file: login-with-otp-flow.js:129 ~ error:', _context2.t0);
               if ((_context2.t0 === null || _context2.t0 === void 0 ? void 0 : _context2.t0.code) === 'auth/invalid-verification-code') {
@@ -204,13 +211,13 @@ var LoginWithOTP = function LoginWithOTP(_ref) {
               } else {
                 handleSetPopupError('enter2fa', _context2.t0 === null || _context2.t0 === void 0 ? void 0 : _context2.t0.message);
               }
-            case 11:
+            case 13:
               setIsActionLoading(undefined);
-            case 12:
+            case 14:
             case "end":
               return _context2.stop();
           }
-        }, _callee2, null, [[2, 7]]);
+        }, _callee2, null, [[2, 9]]);
       }));
       return function (_x2) {
         return _ref5.apply(this, arguments);

package/dist/components/ForgotPasswordModal/ForgotPasswordModal.js

@@ -60,10 +60,12 @@ var ForgotPasswordModal = /*#__PURE__*/function (_PureComponent) {
         onModalSwitch = _this$props.onModalSwitch,
         popupError = _this$props.popupError,
         popupSuccess = _this$props.popupSuccess,
-        isActionLoading = _this$props.isActionLoading;
+        isActionLoading = _this$props.isActionLoading,
+        background = _this$props.background;
       return /*#__PURE__*/_react.default.createElement(_Modal.Modal, {
         isOpen: isModalOpen,
-        onClose: onModalClose
+        onClose: onModalClose,
+        background: background
       }, /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
         part: 8
       }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {

package/dist/components/headerHo/HeaderHo.js

@@ -336,33 +336,35 @@ var HeaderHoClass = /*#__PURE__*/function (_Component) {
                   setIsLoginModalOpen && setIsLoginModalOpen(false);
                   _this2.clearPopupError();
                   _this2.setIsActionLoading(undefined);
-                  //await getUser()
-                  _context.next = 26;
-                  break;
+                  _context.next = 16;
+                  return getUser();
                 case 16:
-                  _context.prev = 16;
+                  _context.next = 28;
+                  break;
+                case 18:
+                  _context.prev = 18;
                   _context.t0 = _context["catch"](3);
                   errorMessage = _context.t0 === null || _context.t0 === void 0 ? void 0 : _context.t0.message; //handle switch modal correctly
                   if (!((_context.t0 === null || _context.t0 === void 0 ? void 0 : _context.t0.code) === 'auth/multi-factor-auth-required')) {
-                    _context.next = 24;
+                    _context.next = 26;
                     break;
                   }
                   _this2.switchOpenModal('login', 'enter2fa');
                   _this2.clearPopupError();
                   _this2.setIsActionLoading(undefined);
                   return _context.abrupt("return");
-                case 24:
+                case 26:
                   if (errorMessage) {
                     _this2.setPopupError('login', errorMessage);
                   } else {
                     _this2.setPopupError('login', "Oops. Something's not right there. Try again?");
                   }
                   _this2.setIsActionLoading(undefined);
-                case 26:
+                case 28:
                 case "end":
                   return _context.stop();
               }
-            }, _callee, null, [[3, 16]]);
+            }, _callee, null, [[3, 18]]);
           }));
           return function (_x) {
             return _ref3.apply(this, arguments);
@@ -395,10 +397,13 @@ var HeaderHoClass = /*#__PURE__*/function (_Component) {
                   _context2.next = 5;
                   return loginUserWithTotp(otpInput, firebaseError);
                 case 5:
-                  _context2.next = 11;
-                  break;
+                  _context2.next = 7;
+                  return getUser();
                 case 7:
-                  _context2.prev = 7;
+                  _context2.next = 13;
+                  break;
+                case 9:
+                  _context2.prev = 9;
                   _context2.t0 = _context2["catch"](2);
                   console.log('🚀 ~ file: HeaderHo.jsx:364 ~ error:', _context2.t0);
                   if ((_context2.t0 === null || _context2.t0 === void 0 ? void 0 : _context2.t0.code) === 'auth/invalid-verification-code') {
@@ -406,13 +411,13 @@ var HeaderHoClass = /*#__PURE__*/function (_Component) {
                   } else {
                     _this2.setPopupError('enter2fa', _context2.t0 === null || _context2.t0 === void 0 ? void 0 : _context2.t0.message);
                   }
-                case 11:
+                case 13:
                   _this2.setIsActionLoading(undefined);
-                case 12:
+                case 14:
                 case "end":
                   return _context2.stop();
               }
-            }, _callee2, null, [[2, 7]]);
+            }, _callee2, null, [[2, 9]]);
           }));
           return function (_x2) {
             return _ref5.apply(this, arguments);

package/dist/context/Auth.js

@@ -99,6 +99,19 @@ var Auth = /*#__PURE__*/function () {
         });
       });
     }
+  }, {
+    key: "getFirebaseUser",
+    value: function getFirebaseUser() {
+      return new Promise(function (resolve, reject) {
+        (0, _auth.onAuthStateChanged)(_firebaseConfig.auth, function (user) {
+          if (user) {
+            resolve(user);
+          } else {
+            reject('User is signed out');
+          }
+        });
+      });
+    }
   }, {
     key: "requestUpdateEmail",
     value: function requestUpdateEmail(data) {

package/dist/context/AuthContext.js

@@ -45,6 +45,7 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
       args[_key] = arguments[_key];
     }
     _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "userRef", /*#__PURE__*/_react.default.createRef(null));
     _defineProperty(_assertThisInitialized(_this), "state", {
       user: undefined,
       firebaseUser: undefined,
@@ -54,7 +55,6 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
       waitingFor2fa: false,
       firebaseError: null
     });
-    _defineProperty(_assertThisInitialized(_this), "userRef", /*#__PURE__*/_react.default.createRef(null));
     _defineProperty(_assertThisInitialized(_this), "checkTokenIsValid", function () {
       var redirect = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
       var accessToken = _Auth.default.getAccessToken();
@@ -74,46 +74,44 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
               return _Auth.default.login(email, password);
             case 3:
               user = _context.sent;
-              console.log('🚀 ~ file: AuthContext.js:33 ~ user:', user);
               _Auth.default.setAccessToken(user.accessToken);
-              _axios.default.defaults.headers.common.Authorization = "Bearer ".concat(user.accessToken);
-              _this.setUser(user);
               _this.setState({
+                firebaseUser: user,
                 isFetchingUser: false
               });
               //if you need user immediatly
               return _context.abrupt("return", user);
-            case 12:
-              _context.prev = 12;
+            case 9:
+              _context.prev = 9;
               _context.t0 = _context["catch"](0);
               console.log('🚀 ~ file: AuthContext.js:56 ~ error:', _context.t0);
               _context.t1 = _context.t0.code;
-              _context.next = _context.t1 === 'auth/multi-factor-auth-required' ? 18 : _context.t1 === 'auth/requires-recent-login' ? 20 : _context.t1 === 'auth/invalid-login-credentials' ? 22 : 24;
+              _context.next = _context.t1 === 'auth/multi-factor-auth-required' ? 15 : _context.t1 === 'auth/requires-recent-login' ? 17 : _context.t1 === 'auth/invalid-login-credentials' ? 19 : 21;
               break;
-            case 18:
+            case 15:
               // Initiate your second factor sign-in flow. (See next step.)
               _this.setState({
                 waitingFor2fa: true,
                 firebaseError: _context.t0
               });
               throw _context.t0;
-            case 20:
+            case 17:
               // The user's last sign-in time does not meet the security threshold.
               _this.logoutUser();
-              return _context.abrupt("break", 27);
-            case 22:
+              return _context.abrupt("break", 24);
+            case 19:
               _context.t0.message = 'The credentials are not correct. Try again?';
               throw _context.t0;
-            case 24:
+            case 21:
               console.log({
                 error: _context.t0
               }); // Handle other errors, such as wrong passwords.
               throw _context.t0;
-            case 27:
+            case 24:
             case "end":
               return _context.stop();
           }
-        }, _callee, null, [[0, 12]]);
+        }, _callee, null, [[0, 9]]);
       }));
       return function (_x, _x2) {
         return _ref.apply(this, arguments);
@@ -129,7 +127,7 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
               //console.log(enrolledFactors);
               selectedIndex = 0;
               _context2.t0 = mfaResolver.hints[selectedIndex].factorId;
-              _context2.next = _context2.t0 === _auth.TotpMultiFactorGenerator.FACTOR_ID ? 5 : _context2.t0 === _auth.PhoneMultiFactorGenerator.FACTOR_ID ? 23 : 24;
+              _context2.next = _context2.t0 === _auth.TotpMultiFactorGenerator.FACTOR_ID ? 5 : _context2.t0 === _auth.PhoneMultiFactorGenerator.FACTOR_ID ? 21 : 22;
               break;
             case 5:
               otpFromAuthenticator = verificationCode; // OTP typed by the user.
@@ -141,31 +139,30 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
               userCredential = _context2.sent;
               user = userCredential.user;
               _Auth.default.setAccessToken(user.accessToken);
-              _axios.default.defaults.headers.common.Authorization = "Bearer ".concat(user.accessToken);
-              _this.setUser(user);
-              console.log('🚀 ~sucess login 2FA:');
-              // Successfully signed in!
-              _context2.next = 22;
+              _this.setState({
+                firebaseUser: user
+              });
+              _context2.next = 20;
               break;
-            case 18:
-              _context2.prev = 18;
+            case 16:
+              _context2.prev = 16;
               _context2.t1 = _context2["catch"](7);
               // Invalid or expired OTP.
               console.log({
                 error: _context2.t1
               });
               throw _context2.t1;
+            case 20:
+              return _context2.abrupt("break", 23);
+            case 21:
+              return _context2.abrupt("break", 23);
             case 22:
-              return _context2.abrupt("break", 25);
+              return _context2.abrupt("break", 23);
             case 23:
-              return _context2.abrupt("break", 25);
-            case 24:
-              return _context2.abrupt("break", 25);
-            case 25:
             case "end":
               return _context2.stop();
           }
-        }, _callee2, null, [[7, 18]]);
+        }, _callee2, null, [[7, 16]]);
       }));
       return function (_x3, _x4) {
         return _ref2.apply(this, arguments);
@@ -338,60 +335,92 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
         window.location.href = "https://".concat(process.env.REACT_APP_WEBSITE_DOMAIN);
       }
     });
-    _defineProperty(_assertThisInitialized(_this), "getUser", /*#__PURE__*/function () {
-      var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7(accessToken) {
-        var customValidateGetUser, _yield$Auth$getUser, user, userAvatar;
-        return _regeneratorRuntime().wrap(function _callee7$(_context7) {
-          while (1) switch (_context7.prev = _context7.next) {
-            case 0:
-              if (accessToken) {
-                _context7.next = 2;
-                break;
-              }
-              return _context7.abrupt("return");
-            case 2:
-              //pass this function as a prop if you need any custom logic after user/get
-              customValidateGetUser = _this.props.customValidateGetUser;
-              _axios.default.defaults.headers.common.Authorization = "Bearer ".concat(accessToken);
-              _context7.prev = 4;
-              _context7.next = 7;
-              return _Auth.default.getUser();
-            case 7:
-              _yield$Auth$getUser = _context7.sent;
-              user = _yield$Auth$getUser.user;
-              //if user hasn't completed the signup process, redirect to welcome page on signup
-              _this.checkUserIsValid(user);
-              customValidateGetUser && customValidateGetUser(user);
-              userAvatar = "".concat(process.env.REACT_APP_PHOTO_API_URL, "/media/picture/view/").concat(user._id);
-              _this.checkUserPhoto(userAvatar);
-              _this.setUser(user);
-              _this.setState({
-                isFetchingUser: false
-              });
+    _defineProperty(_assertThisInitialized(_this), "patchUserObject", function (user, firebaseUser) {
+      if (!user || !firebaseUser) return;
 
-              //redirect to home if user is on login or signup route (affects homepage only)
-              _this.replaceLocationPathName();
+      //use emailVerified as source of truth for user.active
+      user.active = firebaseUser.emailVerified;
 
-              //if you need user info immediately after call (before setState is executed), you can use this
-              return _context7.abrupt("return", user);
-            case 19:
-              _context7.prev = 19;
-              _context7.t0 = _context7["catch"](4);
-              _this.setState({
-                isFetchingUser: false
-              });
-              console.log("Error in getUser: ".concat(_context7.t0));
-              throw _context7.t0;
-            case 24:
-            case "end":
-              return _context7.stop();
-          }
-        }, _callee7, null, [[4, 19]]);
-      }));
-      return function (_x10) {
-        return _ref7.apply(this, arguments);
-      };
-    }());
+      //use Object.assign so that we copy the prototype object from firebaseUser
+      //user object will override any properties that are the same in the firebaseUser
+      return Object.assign(firebaseUser, user);
+    });
+    _defineProperty(_assertThisInitialized(_this), "getUser", /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee7() {
+      var accessToken,
+        customValidateGetUser,
+        result,
+        firebaseUser,
+        user,
+        userAvatar,
+        _args7 = arguments;
+      return _regeneratorRuntime().wrap(function _callee7$(_context7) {
+        while (1) switch (_context7.prev = _context7.next) {
+          case 0:
+            accessToken = _args7.length > 0 && _args7[0] !== undefined ? _args7[0] : _Auth.default.getAccessToken();
+            if (accessToken) {
+              _context7.next = 4;
+              break;
+            }
+            _this.setState({
+              isFetchingUser: false
+            });
+            return _context7.abrupt("return");
+          case 4:
+            _axios.default.defaults.headers.common.Authorization = "Bearer ".concat(accessToken);
+
+            //pass this function as a prop if you need any custom logic after user/get
+            customValidateGetUser = _this.props.customValidateGetUser;
+            _context7.prev = 6;
+            _context7.next = 9;
+            return _Auth.default.getUser();
+          case 9:
+            result = _context7.sent;
+            firebaseUser = _this.state.firebaseUser;
+            if (firebaseUser) {
+              _context7.next = 15;
+              break;
+            }
+            _context7.next = 14;
+            return _Auth.default.getFirebaseUser();
+          case 14:
+            firebaseUser = _context7.sent;
+          case 15:
+            console.log('🚀 ~ file: AuthContext.js:252 ~ firebaseUser:', firebaseUser);
+
+            //merge firebaseUser and our user object
+            user = _this.patchUserObject(result.user, firebaseUser);
+            console.log('🚀 ~ file: AuthContext.js:259 ~ user:', user);
+
+            //if user is empty throw an error
+            //if user hasn't completed the signup process, redirect to welcome page on signup
+            _this.checkUserIsValid(user);
+            customValidateGetUser && customValidateGetUser(user);
+            userAvatar = "".concat(process.env.REACT_APP_PHOTO_API_URL, "/media/picture/view/").concat(user._id);
+            _this.checkUserPhoto(userAvatar);
+            _this.setUser(user);
+            _this.setState({
+              isFetchingUser: false
+            });
+
+            //redirect to home if user is on login or signup route (affects homepage only)
+            _this.replaceLocationPathName();
+
+            //if you need user info immediately after call (before setState is executed), you can use this
+            return _context7.abrupt("return", user);
+          case 28:
+            _context7.prev = 28;
+            _context7.t0 = _context7["catch"](6);
+            _this.setState({
+              isFetchingUser: false
+            });
+            console.log("Error in getUser: ".concat(_context7.t0));
+            throw _context7.t0;
+          case 33:
+          case "end":
+            return _context7.stop();
+        }
+      }, _callee7, null, [[6, 28]]);
+    })));
     _defineProperty(_assertThisInitialized(_this), "checkUserPhoto", function (avatar) {
       try {
         var http = new XMLHttpRequest();
@@ -409,13 +438,9 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
       }
     });
     _defineProperty(_assertThisInitialized(_this), "checkUserIsValid", function (user) {
-      // if (
-      //   user?.user_type !== 'investor' &&
-      //   user?.user_type !== 'investor_entity'
-      // ) {
-      //   window.location.href = `https://admin.${process.env.REACT_APP_WEBSITE_DOMAIN}`
-      //   return false
-      // }
+      if (!user) {
+        throw new Error('User is not defined');
+      }
       if (!(user !== null && user !== void 0 && user.country) && (user === null || user === void 0 ? void 0 : user.user_type) === 'investor') {
         window.location.href = "https://signup.".concat(process.env.REACT_APP_WEBSITE_DOMAIN, "/welcome");
         return false;
@@ -461,7 +486,7 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
             }
           }, _callee8, null, [[0, 14]]);
         }));
-        return function (_x11, _x12) {
+        return function (_x10, _x11) {
           return _ref8.apply(this, arguments);
         };
       }());
@@ -524,7 +549,7 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
           }
         }, _callee10, null, [[0, 8]]);
       }));
-      return function (_x13) {
+      return function (_x12) {
         return _ref10.apply(this, arguments);
       };
     }());
@@ -582,7 +607,7 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
           }
         }, _callee11, null, [[4, 19]]);
       }));
-      return function (_x14) {
+      return function (_x13) {
         return _ref11.apply(this, arguments);
       };
     }());
@@ -639,7 +664,7 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
           }
         }, _callee12, null, [[4, 18]]);
       }));
-      return function (_x15) {
+      return function (_x14) {
         return _ref12.apply(this, arguments);
       };
     }());
@@ -665,7 +690,7 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
           }
         }, _callee13, null, [[0, 5]]);
       }));
-      return function (_x16) {
+      return function (_x15) {
         return _ref13.apply(this, arguments);
       };
     }());
@@ -715,7 +740,7 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
           }
         }, _callee15, null, [[0, 7]]);
       }));
-      return function (_x17, _x18) {
+      return function (_x16, _x17) {
         return _ref15.apply(this, arguments);
       };
     }());
@@ -737,7 +762,7 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
           }
         }, _callee16, null, [[0, 4]]);
       }));
-      return function (_x19) {
+      return function (_x18) {
         return _ref16.apply(this, arguments);
       };
     }());
@@ -764,11 +789,13 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
           }
         }, _callee17, null, [[0, 7]]);
       }));
-      return function (_x20) {
+      return function (_x19) {
         return _ref17.apply(this, arguments);
       };
     }());
     _defineProperty(_assertThisInitialized(_this), "setUser", function (user) {
+      //there are a few cases where we need user object in event handlers (that don't have access to updated state)
+      //that's why we store it in a ref
       _this.userRef.current = user;
       _this.setState({
         user: user
@@ -805,7 +832,7 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
           }
         }, _callee18, null, [[0, 9]]);
       }));
-      return function (_x21, _x22, _x23) {
+      return function (_x20, _x21, _x22) {
         return _ref18.apply(this, arguments);
       };
     }());
@@ -815,17 +842,10 @@ var AuthProviderClass = /*#__PURE__*/function (_Component) {
     key: "componentDidMount",
     value: function componentDidMount() {
       var isActivatingUser = window.location.href.includes('/activateUser');
-      var accessToken = _Auth.default.getAccessToken();
       if (isActivatingUser) {
         this.activateUser();
-      } else if (accessToken) {
-        this.getUser(accessToken);
       } else {
-        this.setState({
-          isFetchingUser: false
-        });
-        console.log('No access token');
-        //window.location.href = `https://${process.env.REACT_APP_WEBSITE_DOMAIN}/login`
+        this.getUser();
       }
     }
   }, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stokr/components-library",
-  "version": "1.1.8-beta.6",
+  "version": "1.1.8-beta.8",
   "description": "STOKR - Components Library",
   "main": "dist/index.js",
   "module": "dist/index.js",