Getting 404 error with react-share and next.js

Question

I have built an app with next.js. Some pages are built dynamically with getStaticProps and getStaticPaths. I'd like the user to be able to share the page on Social media. I am using react-share module for that. The module works fine with Twitter but I am getting a 404 error with facebook.

Here's the code of my Sharing Component :

import {
  FacebookShareButton,
  TwitterShareButton,
  VKShareButton,
} from "react-share"
import { FacebookIcon, TwitterIcon, VKIcon } from "react-share"

export default function ShareButtons({ data }) {
  return (
    <div className="share-buttons">
      <FacebookShareButton
        subject={`${data.title} from Online Primary Sources`}
        url={`https://onlineprimarysources.cercec.fr/sources/${data.id}`}
      >
        <FacebookIcon size={40} round />
      </FacebookShareButton>
      <TwitterShareButton
        url={`https://onlineprimarysources.cercec.fr/sources/${data.id}`}
      >
        <TwitterIcon size={40} round />
      </TwitterShareButton>
      <VKShareButton
        url={`https://onlineprimarysources.cercec.fr/sources/${data.id}`}
      >
        <VKIcon size={40} round />
      </VKShareButton>
    </div>
  )
}

the props data comes from fetching an external api (with getStaticProps in the Page component).

Sharing the page on facebook looks like that :

The same page shared on Twitter :