I am not quite sure if this should be like that (see attached). If undefined is fine, then provide more info

i don't know bro x) i never use nosql so it's new for me ..

look my config :

 
import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";

const firebaseConfig = {
    apiKey: process.env.FIREBASE_APIKEY,
    authDomain: process.env.FIREBASE_AUTHDOMAIN,
    projectId: process.env.FIREBASE_PROJECTID,
    storageBucket: process.env.FIREBASE_STORAGEBUCKET,
    messagingSenderId: process.env.FIREBASE_MESSAGING,
    appId: process.env.FIREBASE_APPID,
    measurementId: process.env.FIREBASE_MEASUREMENTID
};

const app = initializeApp(firebaseConfig);
const db = getFirestore(app);

export { app, db };

and the code :

"use client"
import { createContext, useContext, useEffect, useState } from "react";
import { collection, onSnapshot } from "firebase/firestore";
import { db } from "../db/firebaseConfig";
import { DataType, DbContextType } from "../Types/useType";

const UsersContext = createContext<DbContextType | null>(null);

export const useFirebase = () => {
    const context = useContext(UsersContext);
    if (!context) {
        throw new Error("useUsers must be used within a UsersProvider")
    }
    return context;
}

export const UsersProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
    const [users, setUsers] = useState<DataType[]>([]);

    useEffect(() => {
        const unsubscribe = onSnapshot(
            collection(db, "users"), 
            (snapshot) => {
                const data: DataType[] = snapshot.docs.map(doc => ({
                    id: doc.id,
                    ...doc.data()
                } as DataType));
                setUsers(data);
            },
            (error) => {
                console.error("Firestore snapshot error:", error);
            }
        );

        return () => unsubscribe();
    }, []);

    const value = { users };

    return (
        <UsersContext.Provider value={value}>
            {children}
        </UsersContext.Provider>
    );
}

You try to connect your client to the database. That does not work, because your env variables are only available serverside.

Two options now:
1. Make the env variables public (watch out)
2. Connect your client to the nextjs server (might not be supported)

i'm on local, and i use .env.local

ok without env local it work

but why ?

did you added your .env variables to your hosting provider?

Hi @Mallow bee

@B33fb0n3 opinion is right.

yea, that's the 1. solution from here https://nextjs-forum.com/post/1308103147750817902#message-1308109441689718845 (<--- click)
Thanks for confirming this 👍

oh

thx

thx really ❤️

You are welcome.