try catch, unsub

src/components/StateContainer.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { getAuth } from "firebase/auth";
+import { Unsubscribe, getAuth } from "firebase/auth";
 import {
   getFirestore,
   collection,
@@ -31,10 +31,12 @@ const StateContainer: React.FC<{ children: React.ReactNode }> = ({
   }, []);
 
   React.useEffect(() => {
+    let unsub1: Unsubscribe | null;
+    let unsub2: Unsubscribe | null;
     const getCalendar = async () => {
       const calendarReference = doc(db, "calendars", name.toLocaleLowerCase());
 
-      onSnapshot(calendarReference, (calendarSnap) => {
+      unsub1 = onSnapshot(calendarReference, (calendarSnap) => {
         if (calendarSnap.exists()) {
           dispatch({
             type: SET_CALENDAR,
@@ -51,14 +53,18 @@ const StateContainer: React.FC<{ children: React.ReactNode }> = ({
         where("calendar", "==", calendarReference),
       );
 
-      onSnapshot(userQuery, (users) => {
+      unsub2 = onSnapshot(userQuery, (users) => {
         dispatch({
           type: SET_USERS,
           payload: users.docs.map((doc) => ({ ...doc.data() }) as UserType),
         });
       });
     };
     getCalendar();
+    return () => {
+      if (unsub1) unsub1();
+      if (unsub2) unsub2();
+    };
   }, [name]);
 
   React.useEffect(() => {

src/pages/Admin/Admin.tsx

@@ -72,7 +72,9 @@ const Admin: React.FC = () => {
         await deleteDoc(userReference);
 
         const storageRef = ref(storage, `${name.toLocaleLowerCase()}/${id}`);
-        await deleteObject(storageRef);
+        try {
+          await deleteObject(storageRef);
+        } catch {}
       } catch (e) {}
     });
     const calendarReference = doc(db, "calendars", name.toLocaleLowerCase());
@@ -313,7 +315,9 @@ const Admin: React.FC = () => {
                       onClick={async () => {
                         const userReference = doc(db, "users", user.id);
                         await deleteDoc(userReference);
-                        await deleteObject(storageRef);
+                        try {
+                          await deleteObject(storageRef);
+                        } catch {}
                       }}
                     />
                   </div>

src/pages/Welcome/Welcome.tsx

@@ -15,6 +15,7 @@ import {
   getAuth,
   GoogleAuthProvider,
   signInWithPopup,
+  Unsubscribe,
 } from "firebase/auth";
 import { useState, SET_NOTIFICATION } from "../../StateProvider";
 import { Link, useNavigate } from "react-router-dom";
@@ -55,6 +56,7 @@ const Welcome: React.FC = () => {
   }, []);
 
   React.useEffect(() => {
+    let unsub: Unsubscribe | null;
     const getCalendars = async () => {
       if (user) {
         const calendarReference = collection(db, "calendars");
@@ -63,14 +65,17 @@ const Welcome: React.FC = () => {
           where("owner", "==", user.uid),
         );
 
-        onSnapshot(calendarQuery, (calendars) => {
+        unsub = onSnapshot(calendarQuery, (calendars) => {
           setCalendars(
             calendars.docs.map((doc) => ({ ...doc.data() }) as CalendarType),
           );
         });
       }
     };
     getCalendars();
+    return () => {
+      if (unsub) unsub();
+    };
   }, [user]);
 
   const logout = async () => {
@@ -96,7 +101,7 @@ const Welcome: React.FC = () => {
           deleteBy: Timestamp.fromDate(
             new Date(new Date().getFullYear() + 1, 1, 1),
           ),
-          owner: user?.uid ?? undefined,
+          owner: user?.uid ?? null,
           name,
           public: true,
           settings: {

src/types.ts

@@ -20,6 +20,6 @@ export type CalendarType = {
     fair?: boolean;
     ignoreWeekends?: boolean;
   };
-  owner?: string;
+  owner?: string | null;
   public?: boolean;
 };