How to get user picture from their google account with NEXT.js Image

Hello I am trying to get user picture from Google to NEXT’s <Image>

<Image src={user?.photoURL} alt="user picture" width={50} height={50} className="rounded-full ml-5" />

which gave me this error

Error: Invalid src prop (https://lh3.googleusercontent.com/a/ALm5wu3hfqfP7bHOGlGE5RXeB-2efMFGK3IZidD5RRGe=s96-c) on `next/image`, hostname "lh3.googleusercontent.com" is not configured under images in your `next.config.js`
See more info: https://nextjs.org/docs/messages/next-image-unconfigured-host

so I add this to next config

 images: {
    remotePatterns: [
      {
        hostname: "**.googleusercontent.com/**"
      }
    ]
  }

but it still doesn’t work.