YouTube API Returns Undefined In React JS Console

I am trying to get the latest uploaded video from a youtube channel playlist, and React JS returns undefined in the console when I console log the response. This is my first time attempting to use YouTube API, and any advice will be much appreciated.

import React from 'react';import './Home.css'//Componentsimport Header from '../../Components/Header/Header';import Footer from '../../Components/Footer/Footer';const YouTube_Playlist_Items_API = process.env.REACT_APP_YouTube_PlayList_Item_API_URL;const YouTube_Key = process.env.REACT_APP_YouTube_API_Key;const YouTube_Playlist_ID = process.env.REACT_APP_YouTube_PlayList_Item_ID;const YouTube_MaxResults = process.env.REACT_APP_YouTube_PlayList_Max_Results;export async function getLatestYouTubePost(){    const res = await fetch(`${YouTube_Playlist_Items_API}?part=snippet&maxResults=${YouTube_MaxResults}&playlistId=${YouTube_Playlist_ID}&key=${YouTube_Key}`);    const data = await res.json();    return {        props:{            data        }    }}const Home = ({data}) => {    console.log('data', data);    return (<><Header/><div className='homeBody'><p>Hello</p></div><Footer /></>    );}export default Home;