Merge pull request #2749 from daostack/CW-firebase-config

CW-firebase-config

src/shared/utils/firebase.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable promise/always-return */
 import firebase from "firebase/compat/app";
 import "firebase/compat/auth";
 import "firebase/compat/firestore";
@@ -16,35 +17,61 @@ interface FirebaseError extends Error {
 }
 
 const app = firebase.initializeApp(config.firebase);
-let db = firebase.firestore();
 
-enableUnlimitedCachePersistence();
+let db: firebase.firestore.Firestore;
+
+// Function to enable Firestore persistence and apply settings
+function enableUnlimitedCachePersistence(): Promise<void> {
+  db = firebase.firestore(); // Initialize Firestore instance here
+
+  const settings = {
+    cacheSizeBytes: CACHE_SIZE_LIMIT,
+  };
+
+  db.settings(settings); // Apply settings before any Firestore operation
+
+  return db
+    .enablePersistence({ synchronizeTabs: true }) // Enable persistence
+    .then(() => {
+      console.log("Persistence enabled successfully.");
+    })
+    .catch(handlePersistenceError); // Handle errors
+}
+
 // Function to handle Firestore persistence errors
 function handlePersistenceError(err: any) {
+  console.error("Persistence error:", err); // Log the error
+
   if (err.code === "failed-precondition") {
     console.log("Multiple tabs open or other conflict.");
   } else if (err.code === "unimplemented") {
     console.log("Persistence is not supported in this browser.");
-  } else if (err.name === "QuotaExceededError") {
+  } else if (
+    err.name === "QuotaExceededError" ||
+    err.code === "QuotaExceededError"
+  ) {
     console.log("Storage quota exceeded. Consider clearing cache.");
-    clearFirestoreCache();
+    clearFirestoreCache(); // Clear cache and try reinitialization
   } else {
     console.error("Error enabling persistence:", err);
-    reinitializeFirestoreWithPersistence();
+    reinitializeFirestoreWithPersistence(); // Reinitialize Firestore with persistence
   }
 }
 
+// Function to reinitialize Firestore with persistence
 function reinitializeFirestoreWithPersistence() {
-  db = firebase.firestore(); // Reinitialize Firestore instance
-  const settings = { cacheSizeBytes: CACHE_SIZE_LIMIT };
-  db.settings(settings);
-
-  db.enablePersistence({ synchronizeTabs: true })
+  db.terminate() // Terminate the Firestore instance first
+    .then(() => db.clearPersistence()) // Clear persistence
+    .then(() => {
+      db = firebase.firestore(); // Reinitialize Firestore
+      const settings = { cacheSizeBytes: CACHE_SIZE_LIMIT };
+      db.settings(settings); // Apply settings again
+      return db.enablePersistence({ synchronizeTabs: true });
+    })
     .then(() => {
       console.log("Persistence re-enabled.");
-      return;
     })
-    .catch(handlePersistenceError);
+    .catch(handlePersistenceError); // Handle any errors during reinitialization
 }
 
 // Function to clear Firestore cache and re-enable persistence
@@ -56,13 +83,12 @@ export function clearFirestoreCache() {
     })
     .then(() => {
       console.log("Persistence cleared. Waiting before reinitializing...");
-      return new Promise((resolve) => setTimeout(resolve, 2000)); // Wait 2 second
+      return new Promise((resolve) => setTimeout(resolve, 2000)); // Wait 2 seconds
     })
     .then(() => {
       console.log("Cache cleared successfully.");
       reinitializeFirestoreWithPersistence(); // Reinitialize Firestore
-      window.location.reload();
-      return;
+      window.location.reload(); // Reload page to apply changes
     })
     .catch((err) => {
       if (err.code === "failed-precondition") {
@@ -73,15 +99,15 @@ export function clearFirestoreCache() {
     });
 }
 
-// Enable Firestore persistence with unlimited cache size and error handling
-function enableUnlimitedCachePersistence() {
-  const settings = {
-    cacheSizeBytes: CACHE_SIZE_LIMIT,
-  };
-  db.settings(settings);
-
-  db.enablePersistence({ synchronizeTabs: true }).catch(handlePersistenceError);
-}
+// Call this function in your entry point (before using Firestore elsewhere)
+enableUnlimitedCachePersistence()
+  .then(() => {
+    console.log("Firestore persistence setup complete.");
+    // You can now safely access Firestore (db) or perform any Firestore operations
+  })
+  .catch(() => {
+    console.log("Firestore persistence setup error.");
+  });
 
 // Enable persistence in the local environment (with Firestore and Auth emulators)
 if (REACT_APP_ENV === Environment.Local) {
@@ -107,7 +133,6 @@ if (typeof window !== "undefined" && typeof window.fetch !== "undefined") {
 }
 
 export { perf };
-// firebase.firestore.setLogLevel("debug");
 
 export const isFirebaseError = (error: any): error is FirebaseError =>
   (error && error.code && error.code.startsWith("auth/")) ||