add accessibility certification page

Author: merlinfuchs

src/components/AcessibilityCertificationWidget.tsx

@@ -0,0 +1,23 @@
+import { FriendlyCaptchaSDK, WidgetHandle } from "@friendlycaptcha/sdk";
+import React, { useEffect, useRef, useState } from "react";
+
+const friendlyCaptchaSDK = new FriendlyCaptchaSDK({
+  disableEvalPatching: true,
+});
+
+export default function AcessibilityCertificationWidget() {
+  const widgetRef = useRef<HTMLDivElement>(null);
+  const widgetInstanceRef = useRef<WidgetHandle>(null);
+  const cleanupFunc = useRef<() => void>(null);
+
+  useEffect(() => {
+    if (widgetRef.current) {
+      widgetInstanceRef.current = friendlyCaptchaSDK.createWidget({
+        element: widgetRef.current,
+        sitekey: "FCMGEMUD2LR7ICLH",
+      });
+    }
+  }, []);
+
+  return <div ref={widgetRef} />;
+}

src/pages/accessibility-certification.tsx

@@ -0,0 +1,19 @@
+import BrowserOnly from "@docusaurus/BrowserOnly";
+import { ColorModeProvider } from "@docusaurus/theme-common/internal";
+import React from "react";
+
+export default function PlaygroundPage() {
+  return (
+    <BrowserOnly fallback={<div>Playground Loading...</div>}>
+      {() => {
+        const AcessibilityCertificationWidget =
+          require("../components/AcessibilityCertificationWidget").default;
+        return (
+          <ColorModeProvider>
+            <AcessibilityCertificationWidget />
+          </ColorModeProvider>
+        );
+      }}
+    </BrowserOnly>
+  );
+}