Require cycle: ../../node_modules/@grpc/grpc-js/build/src/channel.js

### Operating System

Mac Sonoma 14.4.1

### Browser Version

Chrome/ Version 124.0.6367.119 (Official Build) (arm64)

### Firebase SDK Version

10.11.1

### Firebase SDK Product:

Auth, Firestore

### Describe your project's tooling

React Native Expo, Web with metro.config.js

### Describe the problem

Im trying to add a context provider so I can handle the status of the user. In the native app everything works fine. When I try to open the app on web it warns me like:

WARN Require cycle: ../../node_modules/@grpc/grpc-js/build/src/channel.js -> ../../node_modules/@grpc/grpc-js/build/src/internal-channel.js -> ../../node_modules/@grpc/grpc-js/build/src/subchannel-pool.js -> ../../node_modules/@grpc/grpc-js/build/src/subchannel.js -> ../../node_modules/@grpc/grpc-js/build/src/channelz.js -> ../../node_modules/@grpc/grpc-js/build/src/make-client.js -> ../../node_modules/@grpc/grpc-js/build/src/client.js -> ../../node_modules/@grpc/grpc-js/build/src/channel.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
factory (../../node_modules/@grpc/grpc-js/build/src/client.js:21:19)
factory (../../node_modules/@grpc/grpc-js/build/src/make-client.js:20:18)
factory (../../node_modules/@grpc/grpc-js/build/src/channelz.js:25:23)
factory (../../node_modules/@grpc/grpc-js/build/src/subchannel.js:26:20)

### Steps and code to reproduce issue

I have the firebase config:

import { initializeApp } from "firebase/app";
import {
initializeAuth,
connectAuthEmulator,
getReactNativePersistence,
browserSessionPersistence,
} from "firebase/auth";
import { getFirestore, connectFirestoreEmulator } from "firebase/firestore";
import { getStorage, connectStorageEmulator } from "firebase/storage";
import { connectFunctionsEmulator, getFunctions } from "firebase/functions";

import AsyncStorage from "@react-native-async-storage/async-storage";

import device from "../device";

const firebaseConfig = {
apiKey: process.env.EXPO_PUBLIC_API_KEY ?? "",
authDomain: process.env.EXPO_PUBLIC_AUTH_DOMAIN ?? "",
projectId: process.env.EXPO_PUBLIC_PROJECT_ID ?? "",
storageBucket: process.env.EXPO_PUBLIC_STORAGE_BUCKET ?? "",
messagingSenderId: process.env.EXPO_PUBLIC_MESSAGING_SENDER_ID ?? "",
appId: process.env.EXPO_PUBLIC_APP_ID ?? "",
measurementId: process.env.EXPO_PUBLIC_MEASUREMENT_ID ?? "",
};

const app = initializeApp(firebaseConfig);

const auth = initializeAuth(app, {
persistence: device.isWeb ? browserSessionPersistence : getReactNativePersistence(AsyncStorage),
});

const firestore = getFirestore(app);
const storage = getStorage(app);
const functions = getFunctions(app);

if (__DEV__) {
connectFirestoreEmulator(firestore, process.env.EXPO_PUBLIC_IP ?? "", 8080);
connectStorageEmulator(storage, process.env.EXPO_PUBLIC_IP ?? "", 9199);
connectAuthEmulator(auth, `http://${process.env.EXPO_PUBLIC_IP}:9099`, { disableWarnings: true });
connectFunctionsEmulator(functions, process.env.EXPO_PUBLIC_IP ?? "", 5001);
}

export { app, auth, firestore, storage, functions };

Then I call this in a context provider:

import React, {
createContext,
useContext,
useMemo,
PropsWithChildren,
useState,
useEffect,
} from "react";
import { auth } from "@/src/resources/config/firebase";
import { User, onAuthStateChanged } from "firebase/auth";

type tContext = {
user: User | undefined | null;
setUser: React.Dispatch>;
};

const MainContext = createContext>({
user: undefined,
setUser: () => Function,
});

export type tMainProviderProps = {};

export const MainProvider = ({ children }: PropsWithChildren) => {

const [user, setUser] = useState(undefined);

const authStateChanged = (authUser: User | null | undefined) => {
setUser(authUser);
};

useEffect(() => {
const unsubscribe = onAuthStateChanged(auth, authStateChanged);
return () => {
unsubscribe();
};
}, []);

const memoValue = useMemo(() => ({ user, setUser }), [user]);

return {children};
};

export default function useMainProvider() {
const context = useContext(MainContext);
if (!context) throw new Error("useMainProvider should be within MainProvider");
return context;
}

There is no other configuration or setup, this project is quite new.