Hello, I'm having trouble rendering an image
I'm fetching the image url from a strapi backend, and passing it into a component as the src of the Inage (next/image)
The image isn't rendered on the page, and when I console.log the src to see if it's a string or undefined, I get the following in my terminals (+check images - teal bcg is terminal, other is firefox devtools)

Here's my component's code

"use client";

// ? React Imports
import * as React from "react";

// ? Next Imports
import Image from "next/image";

// ? Component Imports
import {
  NavigationMenu,
  NavigationMenuList,
} from "@/app/[lang]/components/ui/navigation-menu";
import NavLarge from "@/app/[lang]/components/NavMenu/Large";
import NavMedium from "@/app/[lang]/components/NavMenu/Medium";

export default function NavMenu({
  logoUrl,
}: {
  logoUrl: string | null
}) {
  console.log(logoUrl);

  return (
    <NavigationMenu className="w-screen fixed top-0 h-[70px] bg-s-bg-primary z-40 shadow-[0px_-40px_40px_5px_#81e6d9]">
      <NavigationMenuList className="w-screen justify-start" id="nav-menu">
        <Image
          src={logoUrl ? logoUrl : "/logo.png"}
          className="ml-5"
          alt="logo"
          width="70"
          height="70"
        />
        <NavLarge />
        <NavMedium />
      </NavigationMenuList>
    </NavigationMenu>
  );
}

I have set react strict mode to false
Here's how I'm passing the url to the component

<NavMenu logoUrl={navbarLogoUrl} />