fix next config

Author: CocDap

apps/playground/app/chat/page.tsx

@@ -1,15 +1,11 @@
 "use client"
 
-export const dynamic = 'force-dynamic'
-
 import { useState, useEffect } from "react"
 import { Textarea } from "@/components/ui/textarea"
 import { Badge } from "@/components/ui/badge"
-import { ScrollArea } from "@/components/ui/scroll-area"
 import { Bot } from "lucide-react"
 import Sidebar from "@/components/sidebar"
 import { useAgentStore, useAgentRestore, useIsInitialized } from "@/stores/agent-store"
-import { ASSETS_PROMPT, XCM_PROMPT } from "@polkadot-agent-kit/llm"
 import { SystemMessage, HumanMessage, ToolMessage } from "@langchain/core/messages"
 
 interface ChatMessage {
@@ -102,6 +98,9 @@ export default function ChatPage() {
       const tools = getLangChainTools(agentKit)
       const modelWithTools = chatModel.bindTools(tools)
 
+      // Dynamically import prompts to avoid build-time issues
+      const { ASSETS_PROMPT, XCM_PROMPT } = await import("@polkadot-agent-kit/llm")
+
       const messages = [
         new SystemMessage({ content: ASSETS_PROMPT + XCM_PROMPT }),
         new HumanMessage({ content: userMessage.content }),

apps/playground/app/config/page.tsx

@@ -1,6 +1,5 @@
 "use client"
 
-export const dynamic = 'force-dynamic'
 
 import { useState, useEffect, useRef } from "react"
 import { useRouter } from "next/navigation"
@@ -9,12 +8,12 @@ import { Card } from "@/components/ui/card"
 import { Input } from "@/components/ui/input"
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
 import { Badge } from "@/components/ui/badge"
-import { Settings, Key, Cpu, Loader2, Check, ArrowLeft, ArrowRight, Link } from "lucide-react"
+import { Key, Cpu, Loader2, Check, ArrowLeft, ArrowRight, Link } from "lucide-react"
 import Sidebar from "@/components/sidebar"
 import { ChainSelector } from "@/components/chain-selector"
 import { useAgentStore, useIsInitialized } from "@/stores/agent-store"
 import { useToast } from "@/hooks/use-toast"
-import type { KnownChainId, KeyType } from "@polkadot-agent-kit/common"
+import type { KeyType } from "@polkadot-agent-kit/common"
 interface AgentConfig {
   llmProvider: string
   llmModel: string

apps/playground/app/developer/page.tsx

@@ -1,16 +1,12 @@
 "use client"
 
-export const dynamic = 'force-dynamic'
-
 import { useEffect, useMemo, useState } from "react"
 import Sidebar from "@/components/sidebar"
 import { Badge } from "@/components/ui/badge"
 import { Card } from "@/components/ui/card"
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
 import { Input } from "@/components/ui/input"
-import { Textarea } from "@/components/ui/textarea"
 import { Button } from "@/components/ui/button"
-import { ScrollArea } from "@/components/ui/scroll-area"
 import { Play, Zap, Terminal, X, Loader2 } from "lucide-react"
 import {
   Collapsible,

apps/playground/next.config.mjs

@@ -9,7 +9,7 @@ const nextConfig = {
   images: {
     unoptimized: true,
   },
-  webpack: (config) => {
+  webpack: (config, { isServer }) => {
     // Enable WebAssembly used by downstream SDK deps
     config.experiments = {
       ...(config.experiments || {}),
@@ -24,6 +24,23 @@ const nextConfig = {
         asyncFunction: true,
       },
     }
+    
+    // Configure WASM file handling
+    config.module.rules.push({
+      test: /\.wasm$/,
+      type: 'asset/resource',
+    })
+    
+    // Externalize Polkadot packages on server to avoid build-time execution
+    if (isServer) {
+      config.externals = config.externals || []
+      config.externals.push({
+        '@polkadot/wasm-crypto': '@polkadot/wasm-crypto',
+        '@polkadot/wasm-bridge': '@polkadot/wasm-bridge',
+        '@polkadot/wasm-util': '@polkadot/wasm-util',
+      })
+    }
+    
     return config
   },
 }