onSnapshot.example.tsx

const userSnapshot = useRef<Unsubscribe|null>(null);
const [isFirstUser, setIsFirstUser] = useState(false);
const [firstUserFinded, setFirstUserFinded] = useState(false);

useEffect(function () {

    if (userSnapshot.current && firstUserFinded) {

        userSnapshot.current();

        userSnapshot.current = null;

    }

}, [firstUserFinded]);

useEffect(function () {

    if (firstUserFinded) {
        return;
    }

    if (!isFirstUser || !userId) {
        return;
    }

    const documentReference = doc(Firestore, "users", userId);

    userSnapshot.current = onSnapshot(documentReference, async function (snapshot) {
        if (!snapshot.exists()) {
            return;
        }

        try {

            const user = snapshot.data() as TypeUser;
            const serializedUser = { ...user, userId: user.userId || userId };
            const userPrivate = await FirestoreUsersPrivateFind({ docId: userId });
            await setSessionLogIn(serializedUser, userPrivate);

            await getPermissions();

            setFirstUserFinded(true);

            createToast("Sucesso!", "Autenticado com sucesso", "SUCCESS");

            return;

        }

        catch (error) {

            createToast("Oops!", Translation.toast.text.something_went_wrong_try_again, "WARNING");

        }

    } as (snapshot: DocumentSnapshot<DocumentData, DocumentData>) => void);

}, [firstUserFinded, isFirstUser, Translation, userId, setSessionLogIn, createToast, getPermissions]);