refactor: move google head tags to gatsby-ssr

website/gatsby-ssr.tsx

@@ -0,0 +1,40 @@
+/**
+ * Implement Gatsby's SSR (Server Side Rendering) APIs in this file.
+ *
+ * See: https://www.gatsbyjs.org/docs/ssr-apis/
+ */
+
+import React, { Fragment } from 'react'
+
+import { GatsbySSR } from 'gatsby'
+
+const GoogleAdsTag = (
+  <script
+    key="google-ads"
+    async
+    src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5817566022458684"
+    crossOrigin="anonymous"
+  />
+)
+
+const GoogleFontTag = (
+  <Fragment key="google-fonts">
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link
+      rel="preconnect"
+      href="https://fonts.gstatic.com"
+      crossOrigin="true"
+    />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400&family=Fira+Sans:wght@300;400;700&display=swap"
+      rel="stylesheet"
+    />
+  </Fragment>
+)
+
+export const onRenderBody: GatsbySSR['onRenderBody'] = props => {
+  props.setHtmlAttributes({ lang: 'en' })
+  props.setHeadComponents([GoogleAdsTag, GoogleFontTag])
+}
+
+export { default as wrapPageElement } from './src/libs/wrapPageElement'

website/src/components/seo.tsx

@@ -51,23 +51,6 @@ const SEO: FC<SEOProps> = ({ title = '', description = '', children }) => {
       <meta property="og:url" content={seo.url} />
 
       {children}
-
-      <script
-        async
-        src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5817566022458684"
-        crossOrigin="anonymous"
-      ></script>
-
-      <link rel="preconnect" href="https://fonts.googleapis.com" />
-      <link
-        rel="preconnect"
-        href="https://fonts.gstatic.com"
-        crossOrigin="true"
-      />
-      <link
-        href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400&family=Fira+Sans:wght@300;400;700&display=swap"
-        rel="stylesheet"
-      />
     </>
   )
 }

website/tsconfig.json

@@ -18,6 +18,6 @@
     }
   },
 
-  "include": ["./src/**/*", "./gatsby-*.ts"],
+  "include": ["src/**/*", "gatsby-*.ts", "gatsby-ssr.tsx"],
   "exclude": ["node_modules", "public", ".cache", "generated"]
 }