Getting undefined from fetched data on 1st onChange event from an input, don't know why.

const useFetchAllUsers = () => {
 const {
  data: allUsersData,
  isLoading: allUsersIsLoading,
  isError: allUsersIsError,
 } = useQuery(
  ['allUsers'],
  async () => {
   try {
    const response = await fetch(`/api/users`);
    return response.json();
   } catch (error) {
    throw error;
   }
  },
  { refetchOnMount: 'always' }
 );

 return { allUsersData, allUsersIsLoading, allUsersIsError };
};

const [search, setSearch] = useState<string>('');
const [tempAllUsersData, setTempAllUsersData] = useState<any>();

const { allUsersData, allUsersIsLoading, allUsersIsError } = useFetchAllUsers();

const handleSearchOnChange = (e: any, allUserData: any) => {
 setTempAllUsersData(allUsersData);
 console.log(tempAllUsersData);
 setSearch(e.target.value);
};

if (allUsersIsLoading) return <LoaderSpinner />;
if (allUsersIsError) return <>Error</>;

return (
 <>
  <input
   placeholder="Search Users"
   type="text"
   value={search}
   onChange={(e) => handleSearchOnChange(e, allUsersData)}     
  />
 </>
)