Display external cover Notion API with Next.js

I'm creating my portfolio using Notion API, Next.js and Tailwind thanks to this wonderful work : https://github.com/samuelkraft/notion-blog-nextjs

However, as you may know, images hosted on Notion has an expiration time. I tried to use <img src={blog.cover.file.url}/> but if I upload a cover on my Notion page from an external link, all my code breaks. I had a look on this documentation : https://developers.notion.com/changelog/page-icons-cover-images-new-block-types-and-improved-page-file-properties but I don't know how to mention it's an external link.

Do you have any idea how I can solve this issue?

Thanks a lot in advance

Solution

You need to use src={cover.external.url} as mention in docs https://developers.notion.com/changelog/page-icons-cover-images-new-block-types-and-improved-page-file-properties.

{
    "object": "database",
    "id": "96433ad8-3fbe-460f-a007-72311c4aa804",
    "cover": {
        "type": "external",
        "external": {
            "url": "https://website.domain/images/image.png"
        }
    },
    "icon": {
        "type": "emoji",
        "emoji": "🎉"
    },
    // ... remaining properties
}