From 99f4a75b5844a1af03b3dc50d0ffd9d7c901207b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?F=C3=A9lix=20Malfait?= <felix.malfait@gmail.com>
Date: Fri, 14 Jun 2024 19:05:48 +0200
Subject: [PATCH] Fix website docs (#5873)

There was a 500 on the playground and the switch between core and
metadata
---
 .../src/app/_components/playground/token-form.tsx          | 4 +++-
 .../src/app/developers/graphql/core/page.tsx               | 7 ++++++-
 .../src/app/developers/graphql/metadata/page.tsx           | 7 ++++++-
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/packages/twenty-website/src/app/_components/playground/token-form.tsx b/packages/twenty-website/src/app/_components/playground/token-form.tsx
index 398fbad7a..1a0051c62 100644
--- a/packages/twenty-website/src/app/_components/playground/token-form.tsx
+++ b/packages/twenty-website/src/app/_components/playground/token-form.tsx
@@ -195,7 +195,9 @@ const TokenForm = ({
             className="select"
             onChange={(event) =>
               router.replace(
-                '/' + pathname.split('/').at(-2) + '/' + event.target.value,
+                pathname.split('/').slice(0, -1).join('/') +
+                  '/' +
+                  event.target.value,
               )
             }
             value={pathname.split('/').at(-1)}
diff --git a/packages/twenty-website/src/app/developers/graphql/core/page.tsx b/packages/twenty-website/src/app/developers/graphql/core/page.tsx
index e6a0bc948..f2c9e18ff 100644
--- a/packages/twenty-website/src/app/developers/graphql/core/page.tsx
+++ b/packages/twenty-website/src/app/developers/graphql/core/page.tsx
@@ -1,6 +1,11 @@
+'use client';
 import React from 'react';
+import dynamic from 'next/dynamic';
 
-import GraphQlPlayground from '../../../_components/playground/graphql-playground';
+const GraphQlPlayground = dynamic(
+  () => import('../../../_components/playground/graphql-playground'),
+  { ssr: false },
+);
 
 const CoreGraphql = () => {
   return <GraphQlPlayground subDoc={'core'} />;
diff --git a/packages/twenty-website/src/app/developers/graphql/metadata/page.tsx b/packages/twenty-website/src/app/developers/graphql/metadata/page.tsx
index b215e2344..ebc4490ae 100644
--- a/packages/twenty-website/src/app/developers/graphql/metadata/page.tsx
+++ b/packages/twenty-website/src/app/developers/graphql/metadata/page.tsx
@@ -1,6 +1,11 @@
+'use client';
 import React from 'react';
+import dynamic from 'next/dynamic';
 
-import GraphQlPlayground from '../../../_components/playground/graphql-playground';
+const GraphQlPlayground = dynamic(
+  () => import('../../../_components/playground/graphql-playground'),
+  { ssr: false },
+);
 
 const CoreGraphql = () => {
   return <GraphQlPlayground subDoc={'metadata'} />;