From 65626366f164d827b459f3d70128dfe94307cb4f Mon Sep 17 00:00:00 2001
From: Dan Edwards <igneosaur@gmail.com>
Date: Thu, 27 Jul 2023 11:16:50 +0100
Subject: [PATCH] Add edge function

---
 .gitignore                               |  1 +
 netlify/edge-functions/experiment.ts     | 29 ++++++++++++++++++++++++
 src/components/Hero/src/Hero.module.scss |  6 +++++
 src/templates/page.tsx                   | 10 +++++++-
 4 files changed, 45 insertions(+), 1 deletion(-)
 create mode 100644 netlify/edge-functions/experiment.ts

diff --git a/.gitignore b/.gitignore
index 0c5275e..3ca5dfc 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,3 +5,4 @@ public
 src/gatsby-types.d.ts
 .env.*
 !.env.example
+.netlify
diff --git a/netlify/edge-functions/experiment.ts b/netlify/edge-functions/experiment.ts
new file mode 100644
index 0000000..e91f575
--- /dev/null
+++ b/netlify/edge-functions/experiment.ts
@@ -0,0 +1,29 @@
+import { Context } from "https://edge.netlify.com";
+import { HTMLRewriter } from "https://raw.githubusercontent.com/worker-tools/html-rewriter/master/index.ts";
+
+export default async (request: Request, context: Context) => {
+  const next = await context.next();
+  let config: Record<string, string> = {};
+  let buffer = "";
+  return new HTMLRewriter()
+    .on("#edge-config", {
+      text(scriptText) {
+        buffer += scriptText.text;
+        if (scriptText.lastInTextNode) {
+          config = JSON.parse(buffer);
+        }
+      },
+    })
+    .on("body", {
+      element(bodyEl) {
+        bodyEl.setAttribute(
+          "class",
+          ["experiment-grey-bkg-bucket-a", config.bodyClass].join(" ")
+        );
+        console.log({ config });
+      },
+    })
+    .transform(next);
+};
+
+export const config = { path: "/" };
diff --git a/src/components/Hero/src/Hero.module.scss b/src/components/Hero/src/Hero.module.scss
index 392c5d3..2e52bbc 100644
--- a/src/components/Hero/src/Hero.module.scss
+++ b/src/components/Hero/src/Hero.module.scss
@@ -31,3 +31,9 @@
   transform: translateY(-50%);
   z-index: 1;
 }
+
+:global(.experiment-grey-bkg-bucket-a .experiment-grey-bkg-active) {
+  .hero {
+    background: grey;
+  }
+}
diff --git a/src/templates/page.tsx b/src/templates/page.tsx
index 48f1712..18d162a 100644
--- a/src/templates/page.tsx
+++ b/src/templates/page.tsx
@@ -27,7 +27,15 @@ const IndexPage = ({ data }: PageProps<Queries.PageQuery>) => {
 
 export default IndexPage;
 
-export const Head: HeadFC = () => <title>Home Page</title>;
+export const Head: HeadFC<Queries.PageQuery> = ({ data }) => (
+  <>
+    <title>Home Page</title>
+    {/* @ts-ignore */}
+    <script id="edge-config" language="json">
+      {JSON.stringify({ bodyClass: "test-from-edge", data })}
+    </script>
+  </>
+);
 
 export const query = graphql`
   query Page($slug: String!) {