From cfbe6f1288374ac9ab620081496248605b96c8ff Mon Sep 17 00:00:00 2001 From: Pavel Meyer Date: Mon, 21 Oct 2024 22:16:45 +0300 Subject: [PATCH 1/2] CW-firebase-config Fixed config --- src/shared/utils/firebase.tsx | 67 ++++++++++++++++++++++------------- 1 file changed, 43 insertions(+), 24 deletions(-) diff --git a/src/shared/utils/firebase.tsx b/src/shared/utils/firebase.tsx index 675511068..d2e7a089f 100644 --- a/src/shared/utils/firebase.tsx +++ b/src/shared/utils/firebase.tsx @@ -16,35 +16,65 @@ interface FirebaseError extends Error { } const app = firebase.initializeApp(config.firebase); -let db = firebase.firestore(); +let db: firebase.firestore.Firestore; + +// Automatically enable Firestore persistence when Firebase is initialized +enableUnlimitedCachePersistence(); // Automatically call this function + +// Function to enable Firestore persistence with unlimited cache size and error handling +function enableUnlimitedCachePersistence() { + db = firebase.firestore(); // Initialize Firestore instance + + const settings = { + cacheSizeBytes: CACHE_SIZE_LIMIT, + }; + + db.settings(settings); + + return db + .enablePersistence({ synchronizeTabs: true }) + .then(() => { + console.log("Persistence enabled successfully."); + return; + }) + .catch(handlePersistenceError); // Catch and handle any persistence errors +} -enableUnlimitedCachePersistence(); // Function to handle Firestore persistence errors function handlePersistenceError(err: any) { + console.error("Persistence error:", err); // Log the error for debugging + 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 after errors function reinitializeFirestoreWithPersistence() { - db = firebase.firestore(); // Reinitialize Firestore instance - const settings = { cacheSizeBytes: CACHE_SIZE_LIMIT }; - db.settings(settings); - - db.enablePersistence({ synchronizeTabs: true }) + db.terminate() // Ensure Firestore is fully terminated before reinitializing + .then(() => db.clearPersistence()) // Clear the persistence + .then(() => { + db = firebase.firestore(); // Reinitialize Firestore instance + const settings = { cacheSizeBytes: CACHE_SIZE_LIMIT }; + db.settings(settings); + 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,12 +86,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(); + window.location.reload(); // Reload page to apply changes return; }) .catch((err) => { @@ -73,16 +103,6 @@ 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); -} - // Enable persistence in the local environment (with Firestore and Auth emulators) if (REACT_APP_ENV === Environment.Local) { firebase.auth().useEmulator(local.firebase.authDomain); @@ -107,7 +127,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/")) || From d6c3aec4c1fed2a29138b610ed5e22b5380367b3 Mon Sep 17 00:00:00 2001 From: Pavel Meyer Date: Mon, 21 Oct 2024 22:26:22 +0300 Subject: [PATCH 2/2] CW-firebase-config Fixed config --- src/shared/utils/firebase.tsx | 42 ++++++++++++++++++++--------------- 1 file changed, 24 insertions(+), 18 deletions(-) diff --git a/src/shared/utils/firebase.tsx b/src/shared/utils/firebase.tsx index d2e7a089f..8f30f7532 100644 --- a/src/shared/utils/firebase.tsx +++ b/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,33 +17,30 @@ interface FirebaseError extends Error { } const app = firebase.initializeApp(config.firebase); -let db: firebase.firestore.Firestore; -// Automatically enable Firestore persistence when Firebase is initialized -enableUnlimitedCachePersistence(); // Automatically call this function +let db: firebase.firestore.Firestore; -// Function to enable Firestore persistence with unlimited cache size and error handling -function enableUnlimitedCachePersistence() { - db = firebase.firestore(); // Initialize Firestore instance +// Function to enable Firestore persistence and apply settings +function enableUnlimitedCachePersistence(): Promise { + db = firebase.firestore(); // Initialize Firestore instance here const settings = { cacheSizeBytes: CACHE_SIZE_LIMIT, }; - db.settings(settings); + db.settings(settings); // Apply settings before any Firestore operation return db - .enablePersistence({ synchronizeTabs: true }) + .enablePersistence({ synchronizeTabs: true }) // Enable persistence .then(() => { console.log("Persistence enabled successfully."); - return; }) - .catch(handlePersistenceError); // Catch and handle any persistence errors + .catch(handlePersistenceError); // Handle errors } // Function to handle Firestore persistence errors function handlePersistenceError(err: any) { - console.error("Persistence error:", err); // Log the error for debugging + console.error("Persistence error:", err); // Log the error if (err.code === "failed-precondition") { console.log("Multiple tabs open or other conflict."); @@ -60,19 +58,18 @@ function handlePersistenceError(err: any) { } } -// Function to reinitialize Firestore with persistence after errors +// Function to reinitialize Firestore with persistence function reinitializeFirestoreWithPersistence() { - db.terminate() // Ensure Firestore is fully terminated before reinitializing - .then(() => db.clearPersistence()) // Clear the persistence + db.terminate() // Terminate the Firestore instance first + .then(() => db.clearPersistence()) // Clear persistence .then(() => { - db = firebase.firestore(); // Reinitialize Firestore instance + db = firebase.firestore(); // Reinitialize Firestore const settings = { cacheSizeBytes: CACHE_SIZE_LIMIT }; - db.settings(settings); + db.settings(settings); // Apply settings again return db.enablePersistence({ synchronizeTabs: true }); }) .then(() => { console.log("Persistence re-enabled."); - return; }) .catch(handlePersistenceError); // Handle any errors during reinitialization } @@ -92,7 +89,6 @@ export function clearFirestoreCache() { console.log("Cache cleared successfully."); reinitializeFirestoreWithPersistence(); // Reinitialize Firestore window.location.reload(); // Reload page to apply changes - return; }) .catch((err) => { if (err.code === "failed-precondition") { @@ -103,6 +99,16 @@ export function clearFirestoreCache() { }); } +// 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) { firebase.auth().useEmulator(local.firebase.authDomain);