Follow up on https://github.com/mds1/evm-diff/pull/25 to attempt to fix social previews not working: The meta tags are not present on the HTML returned by the server so no image is found. I think this is because the Head component was rendered per-page and therefore required JS to render. Here we move it to the root _app.tsx and everything is dynamically rendered in the Head component based on the route.
Fix build error on node vs. edge differences: The error was: A Node.js API is used (MessageChannel at line: 121) which is not supported in the Edge Runtime. This was tracked down to the headlessui Transition component in Copyable.tsx, so we remove that and use a manual transition instead. I think this only showed up after the prior change, presumably because now more rendering happens on the server (which is what we want)
_app.tsx
and everything is dynamically rendered in the Head component based on the route.A Node.js API is used (MessageChannel at line: 121) which is not supported in the Edge Runtime
. This was tracked down to the headlessuiTransition
component inCopyable.tsx
, so we remove that and use a manual transition instead. I think this only showed up after the prior change, presumably because now more rendering happens on the server (which is what we want)