@stokr/components-library 2.3.41-beta.17 → 2.3.41-beta.18

package/dist/components/headerHo/HeaderHo.js

@@ -92,7 +92,8 @@ var HeaderHoClass = /*#__PURE__*/function (_Component) {
       },
       isActionLoading: undefined,
       termsData: undefined,
-      isPasswordResetLinkExpired: false
+      isPasswordResetLinkExpired: false,
+      tokenCheckComplete: false
     });
     _defineProperty(_assertThisInitialized(_this), "componentDidMount", /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
       var _this$props, isResetPassword, urlParams, oobCode, tokenStatus;
@@ -101,44 +102,69 @@ var HeaderHoClass = /*#__PURE__*/function (_Component) {
           case 0:
             _this$props = _this.props, isResetPassword = _this$props.isResetPassword, urlParams = _this$props.urlParams; // check if reset password modal and extract oobCode from URL params
             if (!isResetPassword) {
-              _context.next = 15;
+              _context.next = 22;
               break;
             }
+            console.log('ifResetPassword running');
             oobCode = urlParams === null || urlParams === void 0 ? void 0 : urlParams.getUrlParam('oobCode');
             if (!(oobCode && oobCode !== '')) {
-              _context.next = 15;
+              _context.next = 19;
               break;
             }
-            _context.prev = 4;
-            _context.next = 7;
+            console.log('ifOobCode running');
+            _context.prev = 6;
+            _context.next = 9;
             return _this.checkTokenExpiration();
-          case 7:
+          case 9:
             tokenStatus = _context.sent;
             _this.setState(function (prevState) {
               return _objectSpread(_objectSpread({}, prevState), {}, {
-                isPasswordResetLinkExpired: tokenStatus.expired
+                isPasswordResetLinkExpired: false,
+                tokenCheckComplete: true
               });
             });
-            _context.next = 15;
+            _context.next = 17;
             break;
-          case 11:
-            _context.prev = 11;
-            _context.t0 = _context["catch"](4);
+          case 13:
+            _context.prev = 13;
+            _context.t0 = _context["catch"](6);
             console.error('Error checking token expiration in componentDidMount:', _context.t0);
             // if there's an error checking the token, assume it's expired
             _this.setState(function (prevState) {
               return _objectSpread(_objectSpread({}, prevState), {}, {
-                isPasswordResetLinkExpired: true
+                isPasswordResetLinkExpired: true,
+                tokenCheckComplete: true
+              });
+            });
+          case 17:
+            _context.next = 20;
+            break;
+          case 19:
+            // No oobCode means expired/invalid
+            _this.setState(function (prevState) {
+              return _objectSpread(_objectSpread({}, prevState), {}, {
+                isPasswordResetLinkExpired: true,
+                tokenCheckComplete: true
+              });
+            });
+          case 20:
+            _context.next = 23;
+            break;
+          case 22:
+            // Not a reset password flow
+            _this.setState(function (prevState) {
+              return _objectSpread(_objectSpread({}, prevState), {}, {
+                tokenCheckComplete: true
               });
             });
-          case 15:
+          case 23:
           case "end":
             return _context.stop();
         }
-      }, _callee, null, [[4, 11]]);
+      }, _callee, null, [[6, 13]]);
     })));
     _defineProperty(_assertThisInitialized(_this), "checkTokenExpiration", /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
-      var urlParams, oobCode, result;
+      var urlParams, oobCode, result, _error$message;
       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
@@ -170,39 +196,56 @@ var HeaderHoClass = /*#__PURE__*/function (_Component) {
             _context2.prev = 13;
             _context2.t0 = _context2["catch"](3);
             console.error('Error checking token expiration:', _context2.t0);
+
+            // Check for specific error codes that indicate invalid/expired token
+            if (!(_context2.t0 !== null && _context2.t0 !== void 0 && (_error$message = _context2.t0.message) !== null && _error$message !== void 0 && _error$message.includes('INVALID_OOB_CODE') || (_context2.t0 === null || _context2.t0 === void 0 ? void 0 : _context2.t0.code) === 'auth/invalid-action-code' || (_context2.t0 === null || _context2.t0 === void 0 ? void 0 : _context2.t0.code) === 'auth/expired-action-code')) {
+              _context2.next = 18;
+              break;
+            }
             return _context2.abrupt("return", {
               expired: true
             });
-          case 17:
+          case 18:
+            return _context2.abrupt("return", {
+              expired: true
+            });
+          case 19:
           case "end":
             return _context2.stop();
         }
       }, _callee2, null, [[3, 13]]);
     })));
     _defineProperty(_assertThisInitialized(_this), "checkForModals", /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
-      var _this$props2, isLogin, isSignUp, isResetPassword, isVerifyEmail, user, _this$state, isModalOpen, isPasswordResetLinkExpired, login, signUp, resetPassword, verifyEmail, isAnyModalOpen;
+      var _this$props2, isLogin, isSignUp, isResetPassword, isVerifyEmail, user, _this$state, isModalOpen, isPasswordResetLinkExpired, tokenCheckComplete, login, signUp, resetPassword, verifyEmail, forgot, isAnyModalOpen;
       return _regeneratorRuntime().wrap(function _callee3$(_context3) {
         while (1) switch (_context3.prev = _context3.next) {
           case 0:
             _this$props2 = _this.props, isLogin = _this$props2.isLogin, isSignUp = _this$props2.isSignUp, isResetPassword = _this$props2.isResetPassword, isVerifyEmail = _this$props2.isVerifyEmail;
             user = _this.context.user;
-            _this$state = _this.state, isModalOpen = _this$state.isModalOpen, isPasswordResetLinkExpired = _this$state.isPasswordResetLinkExpired;
-            login = isModalOpen.login, signUp = isModalOpen.signUp, resetPassword = isModalOpen.resetPassword, verifyEmail = isModalOpen.verifyEmail; //checks if any modal is open
+            _this$state = _this.state, isModalOpen = _this$state.isModalOpen, isPasswordResetLinkExpired = _this$state.isPasswordResetLinkExpired, tokenCheckComplete = _this$state.tokenCheckComplete;
+            login = isModalOpen.login, signUp = isModalOpen.signUp, resetPassword = isModalOpen.resetPassword, verifyEmail = isModalOpen.verifyEmail, forgot = isModalOpen.forgot; // token check needs to complete first
+            if (tokenCheckComplete) {
+              _context3.next = 6;
+              break;
+            }
+            return _context3.abrupt("return");
+          case 6:
+            //checks if any modal is open
             //if true we won't open any modal from below
             isAnyModalOpen = Object.values(isModalOpen).some(function (value) {
               return value === true;
             });
             if (!isAnyModalOpen) {
-              _context3.next = 7;
+              _context3.next = 9;
               break;
             }
             return _context3.abrupt("return");
-          case 7:
+          case 9:
             //dont open if modal is already open or user is logged in
             if (isLogin && !user && !login) {
               _this.setState(function (prevState) {
                 return _objectSpread(_objectSpread({}, prevState), {}, {
-                  isModalOpen: _objectSpread(_objectSpread({}, isModalOpen), {}, {
+                  isModalOpen: _objectSpread(_objectSpread({}, prevState.isModalOpen), {}, {
                     login: true
                   })
                 });
@@ -211,27 +254,34 @@ var HeaderHoClass = /*#__PURE__*/function (_Component) {
             if (isSignUp && !user && !signUp) {
               _this.setState(function (prevState) {
                 return _objectSpread(_objectSpread({}, prevState), {}, {
-                  isModalOpen: _objectSpread(_objectSpread({}, isModalOpen), {}, {
+                  isModalOpen: _objectSpread(_objectSpread({}, prevState.isModalOpen), {}, {
                     signUp: true
                   })
                 });
               });
             }
-            if (isResetPassword && !user && !resetPassword) {
+            if (isResetPassword && !user && !resetPassword && !forgot) {
               if (isPasswordResetLinkExpired) {
-                // open special version of forgot password modal if token is expired
+                // open forgot password modal if token is expired/invalid
+                console.log('Opening forgot password modal - token expired/invalid');
                 _this.setState(function (prevState) {
                   return _objectSpread(_objectSpread({}, prevState), {}, {
-                    isModalOpen: _objectSpread(_objectSpread({}, isModalOpen), {}, {
+                    isModalOpen: _objectSpread(_objectSpread({}, prevState.isModalOpen), {}, {
                       forgot: true
-                    })
+                    }),
+                    popupError: {
+                      popup: 'forgot',
+                      message: 'This password reset link has expired or is invalid. Please request a new one.',
+                      field: undefined
+                    }
                   });
                 });
               } else {
                 // open usual reset password modal if token is valid
+                console.log('Opening reset password modal - token valid');
                 _this.setState(function (prevState) {
                   return _objectSpread(_objectSpread({}, prevState), {}, {
-                    isModalOpen: _objectSpread(_objectSpread({}, isModalOpen), {}, {
+                    isModalOpen: _objectSpread(_objectSpread({}, prevState.isModalOpen), {}, {
                       resetPassword: true
                     })
                   });
@@ -241,13 +291,13 @@ var HeaderHoClass = /*#__PURE__*/function (_Component) {
             if (isVerifyEmail && !verifyEmail) {
               _this.setState(function (prevState) {
                 return _objectSpread(_objectSpread({}, prevState), {}, {
-                  isModalOpen: _objectSpread(_objectSpread({}, isModalOpen), {}, {
+                  isModalOpen: _objectSpread(_objectSpread({}, prevState.isModalOpen), {}, {
                     verifyEmail: true
                   })
                 });
               });
             }
-          case 11:
+          case 13:
           case "end":
             return _context3.stop();
         }
@@ -265,7 +315,7 @@ var HeaderHoClass = /*#__PURE__*/function (_Component) {
         window.history.pushState('', '', modalId === 'login' ? '/login' : modalId === 'signUp' ? '/signup' : '/');
 
         //when we close login or signup or reset password modal, we want to remove modal url
-        if ((modalId === 'login' || modalId === 'signUp' || modalId === 'resetPassword' || modalId === 'verifyEmail') && !status) {
+        if ((modalId === 'login' || modalId === 'signUp' || modalId === 'resetPassword' || modalId === 'verifyEmail' || modalId === 'forgot') && !status) {
           navigate('/');
         }
       }
@@ -373,8 +423,8 @@ var HeaderHoClass = /*#__PURE__*/function (_Component) {
         this.props.navigate(0);
       }
 
-      // Run after page loaded
-      if (!isFetchingUser) {
+      // Run after page loaded AND token check is complete
+      if (!isFetchingUser && this.state.tokenCheckComplete) {
         this.checkForModals();
       }
     }

package/package.json

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