To display the data from postgraphile api into the react app

`

import React, { useEffect, useState } from 'react';
import { useQuery, gql } from '@apollo/client';
import { LOAD_USERS } from "../GraphQL/Queries"

function GetUsers() {

  const { error, loading, data } = useQuery(LOAD_USERS);
  const [users, setUsers] = useState([]);

  useEffect(() => {
    if (data) {
      console.log(data.allUsers)
      setUsers(data.allUsers)
    }
  }, [data]);
  return (
    <div>
      {users.map((val) => {
        return <h1> {val.firstname} </h1>
      })}
    </div>
  )


}

export default GetUsers;

`

the error i开发者_StackOverflows occuring in console log as

Uncaught TypeError: users.map is not a function. So please help me with this how do i display it on app. it is being print in the console log