fix: build

Author: linkielink

install_charting_library.sh

@@ -24,4 +24,20 @@ cp -r "$LATEST_HASH/charting_library" src/utils/
 cp -r "$LATEST_HASH/datafeeds" public/
 cp -r "$LATEST_HASH/datafeeds" src/utils/
 
+# Create index.js to export widget for Next.js compatibility
+cat > "src/utils/charting_library/index.js" << 'JSEOF'
+// The charting library is loaded via a UMD bundle that attaches to window.TradingView
+// We provide a stub that resolves to the actual widget at runtime
+export const widget = (typeof window !== 'undefined' && typeof window.TradingView !== 'undefined')
+  ? window.TradingView.widget
+  : class MockWidget {}
+JSEOF
+
+# Create index.d.ts to re-export types
+cat > "src/utils/charting_library/index.d.ts" << 'DTSEOF'
+// Re-export all types from the charting library
+export * from './charting_library.d'
+export * from './datafeed-api.d'
+DTSEOF
+
 remove_if_directory_exists "$LATEST_HASH"

next.config.js

@@ -105,6 +105,13 @@ const nextConfig = {
       use: ['@svgr/webpack'],
     })
 
+    // Handle charting library - it's a UMD bundle that needs special treatment
+    config.resolve.alias = {
+      ...config.resolve.alias,
+      // Ensure the charting library is resolved correctly
+      'utils/charting_library': require.resolve('./src/utils/charting_library/index.js'),
+    }
+
     return config
   },
 }

src/pages/TradePage.tsx

@@ -1,10 +1,13 @@
 import { useEffect, useMemo } from 'react'
 import { useLocation } from 'react-router-dom'
+import dynamic from 'next/dynamic'
 
 import GridWithSplitters from 'components/common/Grid/GridWithSplitters'
 import AccountDetailsCard from 'components/trade/AccountDetailsCard'
-import TradeChart from 'components/trade/TradeChart'
 import TradeModule from 'components/trade/TradeModule'
+
+// TradeChart uses the charting library which is browser-only, so we load it dynamically
+const TradeChart = dynamic(() => import('components/trade/TradeChart'), { ssr: false })
 import { getDefaultChainSettings } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import useTradeEnabledAssets from 'hooks/assets/useTradeEnabledAssets'