feat: cache clean on searchs

Author: fagundesjg

src/api/cache.ts

@@ -1,22 +1,51 @@
 import { AxiosResponse, InternalAxiosRequestConfig } from 'axios';
 import qs from 'qs';
 
+const defaultTtl: number = 1000 * 60 * 5;
+
+function log(...args: any[]) {
+  if (import.meta.env.DEV) {
+    console.log(`${new Date().toISOString()}`, ...args);
+  }
+}
+
+function checkCacheHasExpired(
+  timestamp: number,
+  ttl: number = defaultTtl
+): boolean {
+  return new Date().getTime() - timestamp >= ttl;
+}
+
+function clearExpiredCache() {
+  log('cache - checando caches expirados...');
+  Object.keys(localStorage)
+    .filter((key: string) => key.startsWith('cache:'))
+    .forEach((key) => {
+      const data = localStorage.getItem(key);
+      if (data) {
+        const { timestamp } = JSON.parse(data);
+        if (checkCacheHasExpired(timestamp)) {
+          localStorage.removeItem(key);
+        }
+      }
+    });
+}
+
 function getCacheRequestData(config: InternalAxiosRequestConfig<any>) {
   if (
     config.method === 'get' &&
     config.url &&
     config.headers['x-app-cache'] === 'true'
   ) {
-    const url = config.url + '?' + qs.stringify(config.params);
+    const url = 'cache:' + config.url + '?' + qs.stringify(config.params);
     const cache = localStorage.getItem(url);
     if (cache) {
       const { data, timestamp } = JSON.parse(cache);
-      const ttl = 1000 * 60 * 5; // 5 minutes
-      if (new Date().getTime() - timestamp >= ttl) {
-        console.log(`cache - expirado - ${url}`);
+      if (checkCacheHasExpired(timestamp)) {
+        log(`cache - expirado - ${url}`);
         localStorage.removeItem(url);
       } else {
-        console.log(`cache - ok - ${url}`);
+        log(`cache - ok - ${url}`);
         return data;
       }
     }
@@ -25,7 +54,8 @@ function getCacheRequestData(config: InternalAxiosRequestConfig<any>) {
 }
 
 function handleCacheResponse(resp: AxiosResponse<any, any>) {
-  const url = resp.config.url + '?' + qs.stringify(resp.config.params);
+  const url =
+    'cache:' + resp.config.url + '?' + qs.stringify(resp.config.params);
   if (
     resp.config.method === 'get' &&
     resp.config.url &&
@@ -44,4 +74,6 @@ function handleCacheResponse(resp: AxiosResponse<any, any>) {
   }
 }
 
+clearExpiredCache();
+
 export { handleCacheResponse, getCacheRequestData };