data property in useQuery() hook returns Cannot read properties of undefined

Question

This is an extremely perplexing issue. The code below gives this error:

TypeError: Cannot read properties of undefined (reading 'map')

When console.log() is used to look at res.data it is fine, it has data. res.data.products is undefined, therefore blowing up the .map(). It just doesn't make sense why this doesn't work. Starting to think there is a bug in the react-query library

export default function ProductList() {
  const { data: products, isLoading } = useQuery('Products', () => 
    axios('/api/products').then((res) => res.data.products)
  );

  if (isLoading) return <LoadingSpinner />

  return products.map((product) => (
    <ProductItem key={product.id} product={product} /> 
  ));
}