const [bag, setBag] = useState([]);

  const bagRef = collection(db, "users", auth.currentUser.email, "bag");

  const updateBag = () => {
    onSnapshot(bagRef, (snapshot) => {
      // ...
      setBag(
        snapshot.docs.map((doc) => ({
          id: doc.id,
          data: doc.data(),
        }))
      );
      console.log("run");
    });
  };

  useEffect(() => {
    updateBag();
  }, []);

my problem is that the useEffect is always running, i can see that since 'run' is showing in my console, and my firestore usage is increasing tried passing different arguments in '[]' such as bag, bagRef, auth.currentUser.email and it didn't work. thx in advanced :)