Custom hook getting undefined value then the correct object in react native?

Question

Hello so am trying to make a custom hook where i get my user object from database and using it however my console log shows the the object is undefined shortly after object appears and this effect other function relying on it they only capture the first state and gives an error how can i fix that here is my code for the hook:-

import { useState, useEffect } from 'react'
import { storage, auth, database } from '../api/auth';



export default function useUser() {
    const [user, setUser] = useState()
    const userId = auth.currentUser.uid;

    useEffect(() => {
        getCurrentUser();

    }, [])


    const getCurrentUser = () => {
        database.ref("users/" + userId).orderByChild('name').once("value").then(snapshot => {
            setUser(snapshot.val())
        })
    }

    return user
}

Answer 1

First of all you can assign default value to userObject.

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

After place where you use useUser hook you can make a check is it null or not.

const user = useUser();


if (!user) {
    return <Text>Loading...</Text>;
}

return(
    <Text>{user.name}</Text>
);