@everymatrix/cashier-session-expiration-modal 1.43.0 → 1.43.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/cashier-session-expiration-modal",
-  "version": "1.43.0",
+  "version": "1.43.1",
   "main": "index.js",
   "svelte": "src/index.ts",
   "scripts": {
@@ -35,5 +35,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "2b46cd3311230285da87ca4b133f9dd5735a0db7"
+  "gitHead": "e0be02e594f762ecb10851537d8690d5e66f4e5d"
 }

package/src/CashierSessionExpirationModal.svelte

@@ -7,6 +7,9 @@
   import { onMount, onDestroy } from 'svelte';
   import DOMPurify from 'dompurify';
   import sessionImage from  './assets/set-timeout-icon.png';
+  import dayjs from 'dayjs';
+  import utc from 'dayjs/plugin/utc';
+  dayjs.extend(utc);
 
   export let clientstyling: string = '';
   export let clientstylingurl: string = '';
@@ -37,7 +40,7 @@
       startCountdown();
     }
   }
-  
+
   const parseJwt = (token: string) => {
     try {
       return JSON.parse(atob(token.split('.')[1]));
@@ -49,17 +52,17 @@
   const startCountdown = () => {
     show = false;
     const tokenPayload = parseJwt(xPaymentSessionToken);
-    if (!tokenPayload) return; 
+    if (!tokenPayload) return;
     sessionEndTime = tokenPayload?.exp;
     timeLeft = sessionEndTime;
-    
+
     if (interval) clearInterval(interval);
     interval = setInterval(() => {
       const currentTime = Math.floor(new Date().getTime() / 1000);
       timeLeft = sessionEndTime - currentTime;
       if (timeLeft <= lastNinetySeconds) {
           show = true;
-      }       
+      }
       if (currentTime  >= sessionEndTime) {
         timeLeft = 0;
         show = false;
@@ -74,6 +77,7 @@
     const headers = new Headers();
     headers.append("accept", "application/json");
     headers.append("Content-Type", "application/json");
+    headers.append("X-Client-Request-Timestamp", dayjs.utc().format("YYYY-MM-DD HH:mm:ss.SSS"));
     const requestParams:RequestInit = {
       method: "POST",
       mode: "cors",
@@ -96,7 +100,7 @@
       renewSession();
     }
   }
-  
+
   const setTranslationUrl = ():void => {
     let url:string = translationurl;
 
@@ -145,7 +149,7 @@
   onDestroy(() => {
     clearInterval(interval);
   });
-  
+
   $: lang && setActiveLanguage();
   $: clientstyling && customStylingContainer && setClientStyling();
   $: clientstylingurl && customStylingContainer && setClientStylingURL();
@@ -159,7 +163,7 @@
             class="CashierSessionExpirationModalWindow"
             part="CashierSessionExpirationModalWindow"
             id="CashierSessionExpirationModal"
-            transition:fade="{{duration }}"            
+            transition:fade="{{duration }}"
             on:click={outOfModalClick}
             bind:clientWidth={width}
             bind:clientHeight={height}>
@@ -187,7 +191,7 @@
                     <span>{$_('sessionExpirationGeneralButton')}</span>
                   </slot>
                 </div>
-            </div>        
+            </div>
           </div>
       </div>
     </div>
@@ -205,7 +209,7 @@
 
   .CashierSessionExpirationModalWindow {
     display: flex;
-    position: fixed;
+    position: absolute;
     align-items: center;
     justify-content: center;
     width: 100%;
@@ -243,7 +247,7 @@
     overflow: hidden;
     text-overflow: ellipsis;
     line-height: calc(var(--emw--font-size-small, 14px) + 2px);
-  }    
+  }
   .CashierSessionExpirationModalContainer {
     padding: var(--emw--spacing-large, 20px);
   }