fix: add custom fields

docs/src/theme/Footer.js

@@ -1,38 +1,46 @@
-import React from 'react';
+import React from "react";
-import Footer from '@theme-original/Footer';
+import Footer from "@theme-original/Footer";
-import { MendableFloatingButton } from '@mendable/search';
+import { MendableFloatingButton } from "@mendable/search";
 
 export default function FooterWrapper(props) {
-  const iconSpan1 = React.createElement('img', {
+  const iconSpan1 = React.createElement(
-    src: '/img/chain.png',
+    "img",
-    style: { width: '40px' }
-  }, null);
-
-  const icon = React.createElement('div', {
-    style: {
-      color: '#000000',
-      fontSize: '22px',
-      width: '48px',
-      height: '48px',
-      margin: '0px',
-      padding: '0px',
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'center',
-      textAlign: 'center'
-    }
-  }, [iconSpan1]);
-
-  const mendableFloatingButton = React.createElement(
-    MendableFloatingButton,
     {
-      floatingButtonStyle: { color: '#000000', backgroundColor: '#f6f6f6' },
+      src: "/img/chain.png",
-      anon_key: 'b7f52734-297c-41dc-8737-edbd13196394', // Mendable Search Public ANON key, ok to be public
+      style: { width: "40px" },
-      showSimpleSearch: true,
+    },
-      icon: icon,
+    null
-    }
   );
 
+  const icon = React.createElement(
+    "div",
+    {
+      style: {
+        color: "#000000",
+        fontSize: "22px",
+        width: "48px",
+        height: "48px",
+        margin: "0px",
+        padding: "0px",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        textAlign: "center",
+      },
+    },
+    [iconSpan1]
+  );
+  const {
+    siteConfig: { customFields },
+  } = useDocusaurusContext();
+
+  const mendableFloatingButton = React.createElement(MendableFloatingButton, {
+    floatingButtonStyle: { color: "#000000", backgroundColor: "#f6f6f6" },
+    anon_key: customFields.mendableAnonKey, // Mendable Search Public ANON key, ok to be public
+    showSimpleSearch: true,
+    icon: icon,
+  });
+
   return (
     <>
       <Footer />