fix: use AntdInferencer only on client-side

8iq · Jun 12, 2024 · 26f7a89 · 26f7a89
1 parent 90349c5
commit 26f7a89
Show file tree

Hide file tree

Showing 5 changed files with 45 additions and 10 deletions.
diff --git a/apps/web/app/samples/[id]/clone/page.tsx b/apps/web/app/samples/[id]/clone/page.tsx
@@ -1,11 +1,18 @@
 'use server'
 
-import { AntdInferencer } from '@repo/ui/refine/antd'
+import dynamic from 'next/dynamic'
 import React from 'react'
 
 import { Layout } from 'web/components/Layout'
 
-export default async function ClonePage(): Promise<React.JSX.Element> {
+const AntdInferencer = dynamic(
+  () => import('@repo/ui/refine/antd').then((i) => i.AntdInferencer),
+  {
+    ssr: false,
+  },
+)
+
+export default async function ClonePage() {
   return (
     <Layout>
       <AntdInferencer />

diff --git a/apps/web/app/samples/[id]/edit/page.tsx b/apps/web/app/samples/[id]/edit/page.tsx
@@ -1,11 +1,18 @@
 'use server'
 
-import { AntdInferencer } from '@repo/ui/refine/antd'
+import dynamic from 'next/dynamic'
 import React from 'react'
 
 import { Layout } from 'web/components/Layout'
 
-export default async function EditPage(): Promise<React.JSX.Element> {
+const AntdInferencer = dynamic(
+  () => import('@repo/ui/refine/antd').then((i) => i.AntdInferencer),
+  {
+    ssr: false,
+  },
+)
+
+export default async function EditPage() {
   return (
     <Layout>
       <AntdInferencer />

diff --git a/apps/web/app/samples/[id]/page.tsx b/apps/web/app/samples/[id]/page.tsx
@@ -1,11 +1,18 @@
 'use server'
 
-import { AntdInferencer } from '@repo/ui/refine/antd'
+import dynamic from 'next/dynamic'
 import React from 'react'
 
 import { Layout } from 'web/components/Layout'
 
-export default async function ShowPage(): Promise<React.JSX.Element> {
+const AntdInferencer = dynamic(
+  () => import('@repo/ui/refine/antd').then((i) => i.AntdInferencer),
+  {
+    ssr: false,
+  },
+)
+
+export default async function ShowPage() {
   return (
     <Layout>
       <AntdInferencer />

diff --git a/apps/web/app/samples/create/page.tsx b/apps/web/app/samples/create/page.tsx
@@ -1,11 +1,18 @@
 'use server'
 
-import { AntdInferencer } from '@repo/ui/refine/antd'
+import dynamic from 'next/dynamic'
 import React from 'react'
 
 import { Layout } from 'web/components/Layout'
 
-export default async function CreatePage(): Promise<React.JSX.Element> {
+const AntdInferencer = dynamic(
+  () => import('@repo/ui/refine/antd').then((i) => i.AntdInferencer),
+  {
+    ssr: false,
+  },
+)
+
+export default async function CreatePage() {
   return (
     <Layout>
       <AntdInferencer />

diff --git a/apps/web/app/samples/page.tsx b/apps/web/app/samples/page.tsx
@@ -1,11 +1,18 @@
 'use server'
 
-import { AntdInferencer } from '@repo/ui/refine/antd'
+import dynamic from 'next/dynamic'
 import React from 'react'
 
 import { Layout } from 'web/components/Layout'
 
-export default async function ListPage(): Promise<React.JSX.Element> {
+const AntdInferencer = dynamic(
+  () => import('@repo/ui/refine/antd').then((i) => i.AntdInferencer),
+  {
+    ssr: false,
+  },
+)
+
+export default async function ListPage() {
   return (
     <Layout>
       <AntdInferencer />