src/App.tsx

@@ -19,7 +19,7 @@ function App() {
           <Route
             path="/user-verification"
             element={<UserVerification />}
-          ></Route>
+          />
           <Route element={<SignPageLayout />}>
             <Route path="/sign-with-nitro-key/:userId" element={<SignWithNitroKey />} />
             <Route

src/pages/UserVerification.tsx

@@ -1,16 +1,23 @@
-import React, { useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import { useNavigate } from 'react-router-dom';
 
-import { Box, Typography } from '@mui/material'
+import { Box, Button, Typography } from '@mui/material'
 import SumsubWebSdk from '@sumsub/websdk-react'
 
-
 const UserVerification = () => {
 
   const [userId, setUserId] = useState<String>('');
+  const [applicationSubmitted, setApplicationSubmitted] = useState<boolean>(false);
 
   const navigate = useNavigate();
 
+  useEffect(()=>{
+    if (applicationSubmitted) {
+      console.log('application is submitted');
+      navigate(`/sign-with-nitro-key/${userId}`)
+    }
+  }, [applicationSubmitted, userId, navigate]);
+
   const config = {
     lang: "en", //language of WebSDK texts and comments (ISO 639-1 format)
     theme: "light",
@@ -29,17 +36,23 @@ const UserVerification = () => {
 
   const accessToken  = {
     "token": process.env.REACT_APP_SUMSUB_TOKEN!,
-    "userId": "deepstack1234"
+    "userId": "deepstack32"
   }
 
   const messageHandler = (event: any, payload: any ) => {
     if (event === 'idCheck.onApplicantLoaded') {
-      setUserId(payload.applicantId)
+      setUserId(payload.applicantId);
     }
 
     if (event === 'idCheck.onApplicantSubmitted'){
       console.log('Application is submitted');
-      navigate(`/sign-with-nitro-key/${userId}`);
+      setApplicationSubmitted(true);
+    }
+
+    if (event === 'idCheck.onApplicantStatusChanged') {
+      if (payload.reviewStatus === 'pending') {
+        setApplicationSubmitted(true);
+      }
     }
 
     console.log(event);