Incode-Technologies-Example-Repos
diff --git a/‎README.md‎
Lines changed: 35 additions & 11 deletions b/‎README.md‎
Lines changed: 35 additions & 11 deletions
diff --git a/‎index.html‎
Lines changed: 14 additions & 17 deletions b/‎index.html‎
Lines changed: 14 additions & 17 deletions
@@ -8,11 +8,18 @@ sequenceDiagram
     participant i as Incode<br>Hosted<br>Workflow
     participant m as Customer<br>Site
     participant b as Backend
+    participant a as API
 
     activate m
-    m-->>b: Get Onboarding URL
-    note over b: runs /omni/start,<br>/omni/onboarding-url
-    b-->>m: {url, token}
+    m->>b: Start Onboarding
+    b->>a: configurationId
+    note over a: /omni/start
+    a->>b: token, interviewId
+    note over b: Save Token
+    b->>a: token
+    note over a:/0/omni/onboarding-url
+    a->>b: url
+    b->>m: {url, interviewId}
     note over m: Create Iframe with URL
     m->>i: Onboarding starts in backend
     
@@ -23,17 +30,23 @@ sequenceDiagram
         deactivate i
     and
         loop
-            m-->>b: {token}
-            note over b: Fetch Onboarding Status
-            b-->>m: {onboardingStatus}
+            m->>b: Get Status<br>{interviewId}
+            note over b: Get Token
+            b->>a: token
+            note over a: /0/omni/get/onboarding/status
+            a->>b: {onboardingStatus}
+            b->>m: {onboardingStatus}
             note over m: If ONBOARDING_FINISHED then<br>continue
         end
     end
     
     note over m: Destroy Iframe
-    m-->>b: Fetch Score<br>{token}
-    note over b: Fetch Score
-    b-->>m: {overallStatus}
+    m->>b: Fetch Score<br>{interviewId}
+    note over b: Get Token
+    b->>a: token
+    note over a: /0/omni/get/score
+    a->>b: {overallStatus}
+    b->>m: {overallStatus}
     note over m: Done
     deactivate m
 ```
@@ -50,7 +63,7 @@ The APIKEY should never be exposed in the frontend.
 
 # Install
 First install all the required packages
-```
+```bash
 npm install
 ```
 
@@ -66,14 +79,25 @@ VITE_FAKE_BACKEND_FLOWID=
 
 # Development
 This repo is configured so run it in development by executing
-```
+```bash
 npm run dev
 ```
 
 You will get a hot reloading environment that exposes the page in
 localhost and in the ip of the machine in case you want to try it
 in your cellphone.
 
+## Session Storage
+
+This sample application uses localStorage to store session data (token and interviewId). In a production environment, you should:
+
+1. Store tokens securely on your backend
+2. Implement proper session management
+3. Handle token expiration and renewal
+4. Consider security implications of storing sensitive data
+
+The implementation in this demo is for demonstration purposes only.
+
 # Author
 
 © Incode Technologies Inc. All rights reserved.
@@ -1,19 +1,16 @@
-<!doctype html>
+<!DOCTYPE html>
 <html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="stylesheet" href="/styles/main.css" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Sample iframe App</title>
+  </head>
 
-<head>
-  <meta charset="UTF-8" />
-  <link rel="stylesheet" href="/styles/main.css" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Sample iframe App</title>
-</head>
-
-<body>
-  <header id="header">Sample iframe App</header>
-  <div id="app">
-  </div>
-  <header id="footer">Copyright 2024&copy;</header>
-  <script type="module" src="/src/main.js"></script>
-</body>
-
-</html>
+  <body>
+    <header id="header">Sample iframe App</header>
+    <div id="app"></div>
+    <header id="footer">Copyright 2024&copy;</header>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>