add Object to useState() and show data in react native

I have the following function:

const [dataLoc, setDataLoc] = useState({date: "No data received yet from sensor", coords: {}});

I set the location here:

Geolocation.getCurrentPosition(      location => {        const date = dateToString(location.timestamp);        const coords = location.coords        setDataLoc({date, coords})      })

With coords:

const coords: {latitude: number;longitude: number;altitude: number | null;accuracy: number;altitudeAccuracy: number | null;heading: number | null;speed: number | null;}

I want to render the data like this:

<Text style={styles.data}>{dataLoc.coords.latitude}</Text>

But I receive:

error: SyntaxError: .../App.tsx: Unexpected token

I can't receive any properties of the object because the object is empty {} like I stated in useState().

When I try to define the object in useState() I get an error because altitude for example can be a number or null.

My question is how can I add coords to dataLoc without defining it and still retrieving the object elements or defining it that some values can be a number or null?

I also tried to define it in useState() as:

const [dataLoc, setDataLoc] = useState({date: "No data received yet from sensor", coords: {   latitude: 0,  longitude: 0,  altitude: 0,  accuracy: 0,  altitudeAccuracy: 0,  heading: 0,  speed: 0}});

But then I receive:

Type '{ latitude: number; longitude: number; altitude: number | null; accuracy: number; altitudeAccuracy: number | null; heading: number | null; speed: number | null; }' is not assignable to type '{ latitude: number; longitude: number; altitude: number; accuracy: number; altitudeAccuracy: number; heading: number; speed: number; }'.Types of property 'altitude' are incompatible.Type 'number | null' is not assignable to type 'number'.Type 'null' is not assignable to type 'number'.