feat: wip

Author: abretonc7s

packages/examples/nextjs-demo/next.config.js

@@ -1,4 +1,12 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {}
+const nextConfig = {
+  webpack: (config) => {
+    config.externals.push({
+      'bufferutil': 'bufferutil',
+      'utf-8-validate': 'utf-8-validate',
+    })
+    return config
+  },
+}
 
-module.exports = nextConfig
+module.exports = nextConfig

packages/examples/nextjs-demo/package.json

@@ -10,6 +10,7 @@
     "allow-scripts": "echo 'n/a'"
   },
   "dependencies": {
+    "@metamask/providers": "^18.3.1",
     "@metamask/sdk-react": "^0.30.0",
     "@types/node": "20.2.1",
     "@types/react": "18.2.6",
@@ -20,5 +21,15 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "typescript": "5.0.4"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.26.0",
+    "@babel/plugin-proposal-json-modules": "^7.25.9",
+    "@babel/plugin-syntax-import-assertions": "^7.26.0",
+    "@babel/plugin-transform-modules-commonjs": "^7.26.3",
+    "@babel/preset-env": "^7.26.0",
+    "babel-loader": "^9.2.1",
+    "bufferutil": "^4.0.9",
+    "utf-8-validate": "^6.0.5"
   }
 }

packages/examples/nextjs-demo/sdk-copy.sh

@@ -7,26 +7,35 @@ SDK_WORKSPACE_DIR="$( pwd; )";
 COMM_LAYER_DIR="$SDK_WORKSPACE_DIR/packages/sdk-communication-layer"
 SDK_DIR="$SDK_WORKSPACE_DIR/packages/sdk"
 SDK_REACT_DIR="$SDK_WORKSPACE_DIR/packages/sdk-react"
-SDK_REACT_UI_DIR="$SDK_WORKSPACE_DIR/packages/sdk-react-ui"
+SDK_INSTALL_MODAL_WEB_DIR="$SDK_WORKSPACE_DIR/packages/sdk-install-modal-web"
 
 DAPP_DIR="$SDK_WORKSPACE_DIR/packages/examples/nextjs-demo"
 
 echo "SDK_DIR: $SDK_DIR"
 echo "COMM_LAYER_DIR: $COMM_LAYER_DIR"
 echo "DAPP_DIR: $DAPP_DIR"
 echo "SDK_REACT_DIR: $SDK_REACT_DIR"
-echo "SDK_REACT_UI_DIR: $SDK_REACT_UI_DIR"
+echo "SDK_INSTALL_MODAL_WEB_DIR: $SDK_INSTALL_MODAL_WEB_DIR"
 
 echo "########### START REPLACING SDK_COMMUNICATION_LAYER #########"
 
 cd $DAPP_DIR
 echo "Hack Metamask sdk && sdk-communication-layer packages..."
 ## hack to debug to latest unpublished version of the sdk
-rm -rf node_modules/@metamask/sdk-communication-layer node_modules/@metamask/sdk node_modules/@metamask/sdk-react node_modules/@metamask/sdk-react-ui
-cp -rf $COMM_LAYER_DIR node_modules/@metamask/
-cp -rf $SDK_DIR node_modules/@metamask/
-cp -rf $SDK_REACT_DIR node_modules/@metamask/
-cp -rf $SDK_REACT_UI_DIR node_modules/@metamask/
+rm -rf node_modules/@metamask/sdk-communication-layer/dist node_modules/@metamask/sdk/dist node_modules/@metamask/sdk-react/dist node_modules/@metamask/sdk-install-modal-web/dist
+cp -rf $COMM_LAYER_DIR/dist node_modules/@metamask/sdk-communication-layer/dist
+cp -rf $COMM_LAYER_DIR/package.json node_modules/@metamask/sdk-communication-layer/package.json
 
+cp -rf $SDK_DIR/dist node_modules/@metamask/sdk/dist
+cp -rf $SDK_DIR/package.json node_modules/@metamask/sdk/package.json
+
+cp -rf $SDK_REACT_DIR/dist node_modules/@metamask/sdk-react/dist
+cp -rf $SDK_REACT_DIR/package.json node_modules/@metamask/sdk-react/package.json
+
+cp -rf $SDK_INSTALL_MODAL_WEB_DIR/dist node_modules/@metamask/sdk-install-modal-web
+cp -rf $SDK_INSTALL_MODAL_WEB_DIR/package.json node_modules/@metamask/sdk-install-modal-web/package.json
+
+# Remove vite cache
+rm -rf .next
 
 echo "All done."

packages/examples/nextjs-demo/src/app/SDKContainer.tsx

@@ -30,7 +30,7 @@ export default function SDKContainer() {
   const [serviceStatus, setServiceStatus] = useState<ServiceStatus>();
   const [activeProvider, setActiveProvider] = useState<SDKProvider>();
   const [currentLanguage, setCurrentLanguage] = useState(
-    localStorage.getItem('MetaMaskSDKLng') || 'en',
+    'en',
   );
 
   const languages = sdk?.availableLanguages ?? ['en'];