Getting is not a function when it should be a function - Nextjs/Javascript

I am using nextjs and I am trying to map my array to my getstaticpaths so that I can generate the getstaticprops. However, every time I am trying to map the result, I am getting 'mycatagoriesis not a function' error.

Below is my static site generated page. It is dynamic so I need to use getStaticpaths.

export async function getStaticPaths() {
  const mycatagories = await useFetchNavBarCatagoriesSSR();

  return {
    paths: mycatagories.map((catagory) => ({
      params: {
        genre: catagory.name,
      },
    })),
    fallback: false,
  };
}

export async function getStaticProps(context) {
  // Fetch data from external API
    
  if (context.params.genre == "Trending") {
    const mydata = useFetchTrendingCatagorySSR();

    return {
      props: {
        mydataz: await mydata,
      },
    };
  } else if (context.params.genre == "Top Rated") {
    const mydata = useFetchTopRatedCatagorySSR();

    return {
      props: {
        mydataz: await mydata,
      },
    };
  } else if (context.params.genre !== null) {
    const mygenrechosen = context.params.genre;

    const mycatagories = await useFetchNavBarCatagoriesSSR();
    const myparseddata = await useFetchParserforGenreResults(
      mycatagories,
      mygenrechosen
    );
    const myresultdataafterparsing = await useFetchMovieGenreResultsSSR(
      myparseddata
    );
  
    return {
      props: {
        mydataz: await myresultdataafterparsing,
      },
    };
  }
}

function genre({ mydataz }) {
  return (
    <div>
      {/* {console.log(props)} */}
      {/* <Navbar /> */}
      <div>Hello</div>
      <Moviegenreresults movies={mydataz} />
    </div>
  );
}

export default genre;

Below is the useFetchNavBarCatagoriesSSR() function.

export default async function useFetchNavBarCatagoriesSSG() {
  const response = await fetch(
    `https://api.themoviedb.org/3/genre/movie/list?api_key=f70b3ca617a5d8978429e375c55a4fa2&language=en-US`
  );
  const fetchedgenres = await response.json();
  await fetchedgenres.genres.push({ name: "Trending" });
  await fetchedgenres.genres.push({ name: "Top Rated" });
  console.log(

  return fetchedgenres;
}

Below is what the useFetchNavBarCatagoriesSSG() returns.

{
  genres: [
    { id: 28, name: 'Action' },
    { id: 12, name: 'Adventure' },
    { id: 16, name: 'Animation' },
    { id: 35, name: 'Comedy' },
    { id: 80, name: 'Crime' },
    { id: 99, name: 'Documentary' },
    { id: 18, name: 'Drama' },
    { id: 10751, name: 'Family' },
    { id: 14, name: 'Fantasy' },
    { id: 36, name: 'History' },
    { id: 27, name: 'Horror' },
    { id: 10402, name: 'Music' },
    { id: 9648, name: 'Mystery' },
    { id: 10749, name: 'Romance' },
    { id: 878, name: 'Science Fiction' },
    { id: 10770, name: 'TV Movie' },
    { id: 53, name: 'Thriller' },
    { id: 10752, name: 'War' },
    { id: 37, name: 'Western' },
    { name: 'Trending' },
    { name: 'Top Rated' }
  ]
}

I am thinking my problem is that my useFetchNavBarCatagoriesSSG() is returning an array inside an object instead of just an array. If that is the case, does anyone know a quick way to extract the array from the object. I tried mapping useFetchNavBarCatagoriesSSG().genre but it did not work. It gives me the error cannot read property map of undefined.

Any thoughts?