my suspense is stuck on loading state

im using it inside a page.jsx with "use client" on top and wrapping my component taht fetches data inside suspense like

<Suspense fallback={<h1>LOADING ...</h1>}>
<NextWeek />
</Suspense>
and my component is ->

import { get } from "@/scripts/apiMethods";

const getWeekCount = async () => {
  try {
    const resp = await get({
      endpoint: "/user/profile",
      silent: true,
    });

   // SOME CALCULATION

    return Math.floor(timeDifference, 0) || 0;
  } catch (error) {
    return "Error";
  }
};

const getNextWeekDate = async () => {
  try {
    const resp = await get({
      endpoint: "/user/user-details",
      silent: true,
    });
    return resp?.user?.nextWeekDateTime || 0;
  } catch (error) {
    return "Error";
  }
};

export default async function NextWeek() {
  const nextWeekDateTime = await getNextWeekDate();

  const weekCount = await getWeekCount();

  console.log({ nextWeekDateTime, weekCount });

  return (
    <h1>COMPONENT {nextWeekDateTime} {weekCount} </h1>
  );
}