Migrate to a monorepo structure (#2909)

packages/twenty-docs/src/pages/graphql.tsx

@@ -0,0 +1,38 @@
+import { createGraphiQLFetcher } from "@graphiql/toolkit";
+import { GraphiQL } from "graphiql";
+import React from "react";
+import ReactDOM from "react-dom";
+import Layout from "@theme/Layout";
+import BrowserOnly from "@docusaurus/BrowserOnly";
+
+import "graphiql/graphiql.css";
+
+// Docusaurus does SSR for custom pages but we need to load GraphiQL in the browser
+const GraphiQLComponent = () => {
+  if (
+    !window.localStorage.getItem("graphiql:theme") &&
+    window.localStorage.getItem("theme") != "dark"
+  ) {
+    window.localStorage.setItem("graphiql:theme", "light");
+  }
+
+  const fetcher = createGraphiQLFetcher({
+    url: "https://api.twenty.com/graphql",
+  });
+  return (
+    <div className="fullHeightPlayground">
+      <GraphiQL fetcher={fetcher} />;
+    </div>
+  );
+};
+
+const graphQL = () => (
+  <Layout
+    title="GraphQL Playground"
+    description="GraphQL Playground for Twenty"
+  >
+    <BrowserOnly>{() => <GraphiQLComponent />}</BrowserOnly>
+  </Layout>
+);
+
+export default graphQL;