DEV Community

Discussion on: WhatsApp link preview is weird

View post
Collapse
 
vitorolivg profile image
Vitor Gomes •

Hey Luciano, thanks for sharing. In our project we couldn't fix the problem only with Helmet. What I did was:

gatsby-ssr.js

export const onPreRenderHTML = ({ getHeadComponents, replaceHeadComponents }) => {
  const headComponents = getHeadComponents();
  headComponents.sort((a, b) => {
    if (a.type === 'meta') {
      return -1;
    } else if (b.type === 'meta') {
      return 1;
    }
    return 0;
  });
  replaceHeadComponents(headComponents);
};
Enter fullscreen mode Exit fullscreen mode

Sorting the Head components with the meta data first.

Cheers

Collapse
 
lucis profile image
Lucis •

Very nice, Vitor!

I'll add it to the post as another solution, right?

;)