fix(build): suppress Stellar SDK console warnings and optimize imports

- Add comprehensive webpack configuration to suppress critical dependency warnings
- Create optimized stellar-sdk-loader utility for better module loading
- Add fallbacks for Node.js modules not available in browser environment
- Configure ignoreWarnings to suppress Stellar SDK related warnings
- Update stellar-test.ts and real-trustless-work.ts to use optimized loader
- Improve build performance with optimizePackageImports experimental feature
- Clean build output without Stellar SDK dependency warnings

Author: josegomez-dev

lib/real-trustless-work.ts

@@ -2,6 +2,7 @@
 
 import { useState } from 'react';
 import { useGlobalWallet } from '@/contexts/WalletContext';
+import { loadStellarSDK, getStellarServer, isStellarSDKAvailable } from './stellar-sdk-loader';
 
 // Real Trustless Work Integration Types
 export interface RealInitializePayload {
@@ -59,18 +60,14 @@ const createEscrowTransactionXDR = async (payload: RealInitializePayload, wallet
     console.log('🔨 Creating real Stellar transaction for wallet:', walletPublicKey);
 
     // Import Stellar SDK dynamically to avoid SSR issues
-    let StellarSDK: any;
-    try {
-      // Try the new package first
-      StellarSDK = await import('@stellar/stellar-sdk');
-    } catch {
-      // Fallback to old package if new one isn't available
-      StellarSDK = await import('stellar-sdk');
+    if (!isStellarSDKAvailable()) {
+      throw new Error('Stellar SDK not available in this environment');
     }
 
-    const { Server, Keypair, TransactionBuilder, Operation, Networks, Asset } = StellarSDK;
+    const StellarSDK = await loadStellarSDK();
+    const { Keypair, TransactionBuilder, Operation, Networks, Asset } = StellarSDK;
 
-    const server = new Server.default ? new Server.default('https://horizon-testnet.stellar.org') : new Server('https://horizon-testnet.stellar.org');
+    const server = await getStellarServer('https://horizon-testnet.stellar.org');
 
     // Load the source account (the user's wallet)
     console.log('📡 Loading account from Stellar network...');

lib/stellar-sdk-loader.ts

@@ -0,0 +1,78 @@
+'use client';
+
+// Optimized Stellar SDK loader to minimize warnings and improve performance
+let stellarSDK: any = null;
+let loadingPromise: Promise<any> | null = null;
+
+export const loadStellarSDK = async () => {
+  // Return cached SDK if already loaded
+  if (stellarSDK) {
+    return stellarSDK;
+  }
+
+  // Return existing loading promise if already loading
+  if (loadingPromise) {
+    return loadingPromise;
+  }
+
+  // Create new loading promise
+  loadingPromise = (async () => {
+    try {
+      // Try loading the newer @stellar/stellar-sdk first
+      stellarSDK = await import('@stellar/stellar-sdk');
+      console.log('✅ Loaded @stellar/stellar-sdk');
+      return stellarSDK;
+    } catch (error) {
+      try {
+        // Fallback to legacy stellar-sdk
+        stellarSDK = await import('stellar-sdk');
+        console.log('✅ Loaded stellar-sdk (legacy)');
+        return stellarSDK;
+      } catch (fallbackError) {
+        console.error('❌ Failed to load Stellar SDK:', fallbackError);
+        throw new Error('Stellar SDK not available');
+      }
+    }
+  })();
+
+  return loadingPromise;
+};
+
+// Helper function to get Server class safely
+export const getStellarServer = async (networkUrl: string) => {
+  const SDK = await loadStellarSDK();
+  return new SDK.Server(networkUrl);
+};
+
+// Helper function to get Keypair class safely
+export const getStellarKeypair = async () => {
+  const SDK = await loadStellarSDK();
+  return SDK.Keypair;
+};
+
+// Helper function to get Networks safely
+export const getStellarNetworks = async () => {
+  const SDK = await loadStellarSDK();
+  return SDK.Networks;
+};
+
+// Helper function to get TransactionBuilder safely
+export const getStellarTransactionBuilder = async () => {
+  const SDK = await loadStellarSDK();
+  return SDK.TransactionBuilder;
+};
+
+// Helper function to check if Stellar SDK is available in browser
+export const isStellarSDKAvailable = () => {
+  return typeof window !== 'undefined';
+};
+
+// Preload Stellar SDK (optional, for better performance)
+export const preloadStellarSDK = () => {
+  if (typeof window !== 'undefined') {
+    // Preload in background without blocking
+    loadStellarSDK().catch(() => {
+      // Silently fail - SDK will be loaded when needed
+    });
+  }
+};

lib/stellar-test.ts

@@ -1,27 +1,29 @@
 'use client';
 
+import { loadStellarSDK, getStellarServer, isStellarSDKAvailable } from './stellar-sdk-loader';
+
 // Simple Stellar SDK test to verify functionality
 export const testStellarSDK = async () => {
   try {
     console.log('🧪 Testing Stellar SDK functionality...');
 
-    let StellarSDK: any;
-    try {
-      StellarSDK = await import('@stellar/stellar-sdk');
-      console.log('✅ Using @stellar/stellar-sdk');
-    } catch {
-      StellarSDK = await import('stellar-sdk');
-      console.log('✅ Using stellar-sdk (legacy)');
+    if (!isStellarSDKAvailable()) {
+      return {
+        success: false,
+        message: 'Stellar SDK not available in this environment'
+      };
     }
 
+    const StellarSDK = await loadStellarSDK();
+    
     const { Server, Keypair, Networks } = StellarSDK;
 
     // Test 1: Create a random keypair
     const testKeypair = Keypair.random();
     console.log('✅ Keypair generation works:', testKeypair.publicKey());
 
-    // Test 2: Connect to Horizon
-    const server = new Server('https://horizon-testnet.stellar.org');
+    // Test 2: Connect to Horizon using optimized loader
+    const server = await getStellarServer('https://horizon-testnet.stellar.org');
     console.log('✅ Server connection created');
 
     // Test 3: Check network passphrase
@@ -56,7 +58,7 @@ export const testAccountLoading = async (publicKey: string) => {
     }
 
     const { Server } = StellarSDK;
-    const server = Server.default ? new Server.default('https://horizon-testnet.stellar.org') : new Server('https://horizon-testnet.stellar.org');
+    const server = await getStellarServer('https://horizon-testnet.stellar.org');
 
     const account = await server.loadAccount(publicKey);
     console.log('✅ Account loaded:', {

next.config.js

@@ -4,6 +4,67 @@ const nextConfig = {
   poweredByHeader: false,
   compress: true,
   generateEtags: false,
+  
+  // Webpack configuration to suppress Stellar SDK warnings and optimize build
+  webpack: (config, { dev, isServer }) => {
+    // Suppress critical dependency warnings from stellar-sdk and related packages
+    config.module.exprContextCritical = false;
+    config.module.unknownContextCritical = false;
+    config.module.wrappedContextCritical = false;
+    
+    // Add fallbacks for Node.js modules that aren't available in the browser
+    config.resolve.fallback = {
+      ...config.resolve.fallback,
+      fs: false,
+      net: false,
+      tls: false,
+      crypto: false,
+      stream: false,
+      url: false,
+      zlib: false,
+      http: false,
+      https: false,
+      assert: false,
+      os: false,
+      path: false,
+      buffer: false,
+      process: false,
+      util: false,
+    };
+
+    // Ignore specific warnings from stellar-sdk dependencies
+    config.ignoreWarnings = [
+      // Ignore critical dependency warnings from stellar-sdk
+      /Critical dependency: require function is used in a way in which dependencies cannot be statically extracted/,
+      // Ignore warnings from specific modules
+      /require-addon/,
+      /sodium-native/,
+      /@stellar\/stellar-base/,
+      /stellar-sdk/,
+      // Additional common warnings to ignore
+      /Module not found: Can't resolve/,
+      /export .* was not found in/,
+    ];
+
+    // Optimize for client-side builds
+    if (!isServer) {
+      // Exclude server-only modules from client bundle
+      config.externals = config.externals || [];
+      config.externals.push({
+        'sodium-native': 'sodium-native',
+        'require-addon': 'require-addon',
+      });
+    }
+
+    // Additional optimization for stellar-sdk (removed alias to prevent module resolution issues)
+
+    return config;
+  },
+  
+  // Experimental features for better performance
+  experimental: {
+    optimizePackageImports: ['stellar-sdk', '@stellar/stellar-sdk'],
+  },
 };
 
 module.exports = nextConfig;