From fcb06d61e742c05f857ef0e0fa5e42a4ba06ba01 Mon Sep 17 00:00:00 2001
From: Lea Renaux <lea.renaux@insee.fr>
Date: Tue, 16 Jul 2024 08:58:39 +0200
Subject: [PATCH] add renew tokens feature and fix duplicate lines in tables

---
 package.json                                  |  2 +-
 src/Authentication/useAuth.js                 |  4 +-
 src/components/App/App.jsx                    | 37 ++++++++++++++++++-
 .../CollectionTableDisplay.jsx                |  6 +--
 .../MonitoringTable/FollowUpTable.jsx         |  4 +-
 5 files changed, 42 insertions(+), 11 deletions(-)

diff --git a/package.json b/package.json
index 17c2f30..052a87b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "sonor",
-  "version": "0.5.34",
+  "version": "0.5.35",
   "private": true,
   "dependencies": {
     "@tanstack/react-query": "4.0.5",
diff --git a/src/Authentication/useAuth.js b/src/Authentication/useAuth.js
index d1cbc66..2dd0975 100644
--- a/src/Authentication/useAuth.js
+++ b/src/Authentication/useAuth.js
@@ -36,7 +36,7 @@ export function initializeOidc (config) {
  * Retrieve authentication status based of Oidc
  */
 export function useIsAuthenticated() {
-  const { login, isUserLoggedIn, oidcTokens } = useOidc({ assertUserLoggedIn: false });
+  const { login, isUserLoggedIn, oidcTokens, renewTokens} = useOidc({ assertUserLoggedIn: false });
 
   useEffect(() => {
     if (!login) {
@@ -47,5 +47,5 @@ export function useIsAuthenticated() {
     });
   }, [login]);
 
-  return { isAuthenticated: isUserLoggedIn, tokens: oidcTokens };
+  return { isAuthenticated: isUserLoggedIn, tokens: oidcTokens, renewTokens  };
 }
diff --git a/src/components/App/App.jsx b/src/components/App/App.jsx
index db9b820..48659a2 100644
--- a/src/components/App/App.jsx
+++ b/src/components/App/App.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useRef } from "react";
 import { useIsAuthenticated } from "../../Authentication/useAuth";
 import D from "../../i18n";
 import View from "../View/View";
@@ -9,8 +9,41 @@ export const App = () => {
   const [authenticated, setAuthenticated] = useState(false);
   const [contactFailed, setContactFailed] = useState(false);
   const [data, setData] = useState(null);
+  const timeoutIdRef = useRef(null);
 
-  const { tokens } = useIsAuthenticated();
+  const { tokens, renewTokens } = useIsAuthenticated();
+
+  useEffect(() => {
+    const resetInactivityTimeout = () => {
+      if (timeoutIdRef.current) {
+        clearTimeout(timeoutIdRef.current);
+      }
+      timeoutIdRef.current = setTimeout(renewTokens, 5 * 60 * 1000);
+    };
+
+    const events = [
+      "mousemove",
+      "mousedown",
+      "keypress",
+      "touchstart",
+      "click",
+    ];
+
+    events.forEach((event) => {
+      window.addEventListener(event, resetInactivityTimeout);
+    });
+
+    resetInactivityTimeout();
+
+    return () => {
+      if (timeoutIdRef.current) {
+        clearTimeout(timeoutIdRef.current);
+      }
+      events.forEach((event) => {
+        window.removeEventListener(event, resetInactivityTimeout);
+      });
+    };
+  }, [renewTokens]);
 
   useEffect(() => {
     if (window.localStorage.getItem("AUTHENTICATION_MODE") === ANONYMOUS) {
diff --git a/src/components/CollectionTable/CollectionTableDisplay.jsx b/src/components/CollectionTable/CollectionTableDisplay.jsx
index 98906da..72dabc8 100644
--- a/src/components/CollectionTable/CollectionTableDisplay.jsx
+++ b/src/components/CollectionTable/CollectionTableDisplay.jsx
@@ -272,10 +272,8 @@ function CollectionTableDisplay({
             (pagination.page - 1) * pagination.size,
             Math.min(pagination.page * pagination.size, displayedLines.length),
           )
-          .map((line) => (
-            <CollectionTableDisplayLine
-              key={line.id || line.interviewerId || line.survey || line.site}
-              data={line}
+          .map((line, index) => (
+            <CollectionTableDisplayLine key={index} data={line}
             />
           ))}
       </tbody>
diff --git a/src/components/MonitoringTable/FollowUpTable.jsx b/src/components/MonitoringTable/FollowUpTable.jsx
index 7f7ce5c..85b221a 100644
--- a/src/components/MonitoringTable/FollowUpTable.jsx
+++ b/src/components/MonitoringTable/FollowUpTable.jsx
@@ -186,8 +186,8 @@ function FollowUpTable({
             (pagination.page - 1) * pagination.size,
             Math.min(pagination.page * pagination.size, displayedLines.length),
           )
-          .map((line) => (
-            <FollowUpTableLine key={line.interviewerId || line.survey || line.site} data={line} />
+          .map((line, index) => (
+            <FollowUpTableLine key={index} data={line} />
           ))}
       </tbody>
       {tableFooter}