Added: 2 day cache in local storage

OWASP · Nov 5, 2023 · b7661f2 · b7661f2
1 parent 512e65a
commit b7661f2
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 6 deletions.
diff --git a/application/frontend/src/const.ts b/application/frontend/src/const.ts
@@ -1,3 +1,5 @@
+export const TWO_DAYS_MILLISECONDS = 1.728e8;
+
 export const TYPE_IS_PART_OF = 'Is Part Of';
 export const TYPE_LINKED_TO = 'Linked To';
 export const TYPE_LINKED_FROM = 'Linked From';

diff --git a/application/frontend/src/providers/DataProvider.tsx b/application/frontend/src/providers/DataProvider.tsx
@@ -2,8 +2,10 @@ import axios from 'axios';
 import React, { createContext, useContext, useEffect, useState } from 'react';
 import { useQuery } from 'react-query';
 
+import { TWO_DAYS_MILLISECONDS } from '../const';
 import { useEnvironment } from '../hooks/useEnvironment';
 import { Document, TreeDocument } from '../types';
+import { getLocalStorageObject, setLocalStorageObject } from '../utils';
 import { getDocumentDisplayName, getInternalUrl } from '../utils/document';
 
 const DATA_STORE_KEY = 'data-store',
@@ -22,11 +24,9 @@ export const DataProvider = ({ children }: { children: React.ReactNode }) => {
   const { apiUrl } = useEnvironment();
   const [dataLoading, setDataLoading] = useState<boolean>(false);
   const [dataStore, setDataStore] = useState<Record<string, TreeDocument>>(
-    JSON.parse(localStorage.getItem(DATA_STORE_KEY) || '{}')
-  );
-  const [dataTree, setDataTree] = useState<TreeDocument[]>(
-    JSON.parse(localStorage.getItem(DATA_TREE_KEY) || '[]')
+    getLocalStorageObject(DATA_STORE_KEY) || {}
   );
+  const [dataTree, setDataTree] = useState<TreeDocument[]>(getLocalStorageObject(DATA_TREE_KEY) || []);
 
   const getStoreKey = (doc: Document): string => {
     if (doc.doctype === 'CRE') return doc.id;
@@ -57,7 +57,7 @@ export const DataProvider = ({ children }: { children: React.ReactNode }) => {
         try {
           const result = await axios.get(`${apiUrl}/root_cres`);
           const treeData = result.data.data.map((x) => buildTree(x));
-          localStorage.setItem(DATA_TREE_KEY, JSON.stringify(treeData));
+          setLocalStorageObject(DATA_TREE_KEY, treeData, TWO_DAYS_MILLISECONDS);
           setDataTree(treeData);
         } catch (error) {
           console.error(error);
@@ -91,7 +91,7 @@ export const DataProvider = ({ children }: { children: React.ReactNode }) => {
                 ...x,
               };
             });
-            localStorage.setItem(DATA_STORE_KEY, JSON.stringify(store));
+            setLocalStorageObject(DATA_STORE_KEY, store, TWO_DAYS_MILLISECONDS);
             setDataStore(store);
           }
         } catch (error) {

diff --git a/application/frontend/src/utils/index.ts b/application/frontend/src/utils/index.ts
@@ -1 +1,27 @@
 export { groupLinksByType as groupLinksByType, LinksByType, getDocumentDisplayName } from './document';
+
+export const getLocalStorageObject = (key) => {
+  const itemStr = localStorage.getItem(key);
+  if (!itemStr) {
+    return null;
+  }
+
+  const item = JSON.parse(itemStr);
+  const now = new Date();
+
+  if (now.getTime() > item.expiry) {
+    localStorage.removeItem(key);
+    return null;
+  }
+  return item.value;
+};
+
+export const setLocalStorageObject = (key, value, ttl) => {
+  const now = new Date();
+
+  const item = {
+    value: value,
+    expiry: now.getTime() + ttl,
+  };
+  localStorage.setItem(key, JSON.stringify(item));
+};