diff --git a/apps/sample/src/app/device-actions/page.tsx b/apps/sample/src/app/device-actions/page.tsx
index 4c101f153..5474345f8 100644
--- a/apps/sample/src/app/device-actions/page.tsx
+++ b/apps/sample/src/app/device-actions/page.tsx
@@ -1,8 +1,15 @@
"use client";
import React from "react";
+import dynamic from "next/dynamic";
-import { AllDeviceActions } from "@/components/DeviceActionsView/AllDeviceActions";
import { SessionIdWrapper } from "@/components/SessionIdWrapper";
+const AllDeviceActions = dynamic(
+ () =>
+ import("@/components/DeviceActionsView/AllDeviceActions").then(
+ (mod) => mod.AllDeviceActions,
+ ),
+ { ssr: false },
+);
const DeviceActions: React.FC = () => {
return ;
diff --git a/apps/sample/src/app/signer/ethereum/page.tsx b/apps/sample/src/app/signer/ethereum/page.tsx
index c297848d3..afece2c9e 100644
--- a/apps/sample/src/app/signer/ethereum/page.tsx
+++ b/apps/sample/src/app/signer/ethereum/page.tsx
@@ -1,8 +1,12 @@
"use client";
import React from "react";
+import dynamic from "next/dynamic";
import { SessionIdWrapper } from "@/components/SessionIdWrapper";
-import { SignerEthView } from "@/components/SignerEthView";
+const SignerEthView = dynamic(
+ () => import("@/components/SignerEthView").then((mod) => mod.SignerEthView),
+ { ssr: false },
+);
const Signer: React.FC = () => {
return ;
diff --git a/apps/sample/src/app/signer/solana/page.tsx b/apps/sample/src/app/signer/solana/page.tsx
index 85b74a573..5bef0cc5e 100644
--- a/apps/sample/src/app/signer/solana/page.tsx
+++ b/apps/sample/src/app/signer/solana/page.tsx
@@ -1,9 +1,13 @@
"use client";
import React from "react";
+import dynamic from "next/dynamic";
import { SessionIdWrapper } from "@/components/SessionIdWrapper";
-import { SignerSolanaView } from "@/components/SignerSolanaView";
-
+const SignerSolanaView = dynamic(
+ () =>
+ import("@/components/SignerSolanaView").then((mod) => mod.SignerSolanaView),
+ { ssr: false },
+);
const Signer: React.FC = () => {
return ;
};
diff --git a/apps/sample/src/components/SessionIdWrapper.tsx b/apps/sample/src/components/SessionIdWrapper.tsx
index 7a0514711..0e3c3108b 100644
--- a/apps/sample/src/components/SessionIdWrapper.tsx
+++ b/apps/sample/src/components/SessionIdWrapper.tsx
@@ -9,7 +9,7 @@ import { useDeviceSessionsContext } from "@/providers/DeviceSessionsProvider";
* If there is no selected sessionId, it renders a message and a button to go to the home page.
*/
export const SessionIdWrapper: React.FC<{
- ChildComponent: React.FC<{ sessionId: string }>;
+ ChildComponent: React.ComponentType<{ sessionId: string }>;
}> = ({ ChildComponent }) => {
const {
state: { selectedId: sessionId },