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 398fbad7a525..1a0051c62edd 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 e6a0bc9481ed..f2c9e18ff56c 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 b215e2344458..ebc4490ae132 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'} />;