fix(critical): resolve 4 production blockers

CRITICAL FIXES:
1.  Hardcoded endpoint replaced with env variable
   - App.tsx: Uses VITE_WS_ENDPOINT from .env
   - PolkadotContext: Fallback endpoints support
   - .env & .env.production: Added VITE_WS_ENDPOINT config

2.  Console statements guarded (433 instances)
   - All console.log/warn/error wrapped with import.meta.env.DEV
   - Production builds now clean (no console output)

3.  ESLint error fixed
   - vite.config.ts: Removed unused 'mode' parameter
   - 0 errors, 27 warnings (non-critical exhaustive-deps)

4.  Bundle optimization implemented
   - Route-based code splitting with React.lazy + Suspense
   - Manual chunks: polkadot (968KB), vendor (160KB), ui (112KB), i18n (60KB)
   - Total gzip: 843KB → 650KB (23% reduction)
   - Individual route chunks for optimal loading

PRODUCTION READY IMPROVEMENTS:
- Endpoint configuration: Environment-based with fallbacks
- Performance: 23% bundle size reduction
- Code quality: Clean production builds
- User experience: Loading states for route transitions

Build verified: ✓ 0 errors
Bundle analysis: ✓ Optimized chunks
Production deployment: READY

🤖 Generated with Claude Code

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-20 06:26:48 +03:00
parent 275e3f8d43
commit 0e0ef734fc
74 changed files with 616 additions and 1764 deletions
+10 -10
View File
@@ -59,7 +59,7 @@ export const RemoveLiquidityModal: React.FC<RemoveLiquidityModalProps> = ({
const fetchMinBalances = async () => {
try {
console.log(`🔍 Fetching minBalances for pool: asset0=${asset0} (${getDisplayTokenName(asset0)}), asset1=${asset1} (${getDisplayTokenName(asset1)})`);
if (import.meta.env.DEV) console.log(`🔍 Fetching minBalances for pool: asset0=${asset0} (${getDisplayTokenName(asset0)}), asset1=${asset1} (${getDisplayTokenName(asset1)})`);
// For wHEZ (asset ID 0), we need to fetch from assets pallet
// For native HEZ, we would need existentialDeposit from balances
@@ -72,7 +72,7 @@ export const RemoveLiquidityModal: React.FC<RemoveLiquidityModalProps> = ({
const details0 = assetDetails0.unwrap().toJSON() as Record<string, unknown>;
const min0 = Number(details0.minBalance) / Math.pow(10, getAssetDecimals(asset0));
setMinBalance0(min0);
console.log(`📊 ${getDisplayTokenName(asset0)} minBalance: ${min0}`);
if (import.meta.env.DEV) console.log(`📊 ${getDisplayTokenName(asset0)} minBalance: ${min0}`);
}
} else {
// Other assets (PEZ, wUSDT, etc.)
@@ -81,7 +81,7 @@ export const RemoveLiquidityModal: React.FC<RemoveLiquidityModalProps> = ({
const details0 = assetDetails0.unwrap().toJSON() as Record<string, unknown>;
const min0 = Number(details0.minBalance) / Math.pow(10, getAssetDecimals(asset0));
setMinBalance0(min0);
console.log(`📊 ${getDisplayTokenName(asset0)} minBalance: ${min0}`);
if (import.meta.env.DEV) console.log(`📊 ${getDisplayTokenName(asset0)} minBalance: ${min0}`);
}
}
@@ -92,7 +92,7 @@ export const RemoveLiquidityModal: React.FC<RemoveLiquidityModalProps> = ({
const details1 = assetDetails1.unwrap().toJSON() as Record<string, unknown>;
const min1 = Number(details1.minBalance) / Math.pow(10, getAssetDecimals(asset1));
setMinBalance1(min1);
console.log(`📊 ${getDisplayTokenName(asset1)} minBalance: ${min1}`);
if (import.meta.env.DEV) console.log(`📊 ${getDisplayTokenName(asset1)} minBalance: ${min1}`);
}
} else {
// Other assets (PEZ, wUSDT, etc.)
@@ -101,11 +101,11 @@ export const RemoveLiquidityModal: React.FC<RemoveLiquidityModalProps> = ({
const details1 = assetDetails1.unwrap().toJSON() as Record<string, unknown>;
const min1 = Number(details1.minBalance) / Math.pow(10, getAssetDecimals(asset1));
setMinBalance1(min1);
console.log(`📊 ${getDisplayTokenName(asset1)} minBalance: ${min1}`);
if (import.meta.env.DEV) console.log(`📊 ${getDisplayTokenName(asset1)} minBalance: ${min1}`);
}
}
} catch (err) {
console.error('Error fetching minBalances:', err);
if (import.meta.env.DEV) console.error('Error fetching minBalances:', err);
}
};
@@ -128,7 +128,7 @@ export const RemoveLiquidityModal: React.FC<RemoveLiquidityModalProps> = ({
setMaxRemovablePercentage(safeMaxPercent > 0 ? safeMaxPercent : 99);
console.log(`🔒 Max removable: ${safeMaxPercent}% (asset0: ${maxPercent0.toFixed(2)}%, asset1: ${maxPercent1.toFixed(2)}%)`);
if (import.meta.env.DEV) console.log(`🔒 Max removable: ${safeMaxPercent}% (asset0: ${maxPercent0.toFixed(2)}%, asset1: ${maxPercent1.toFixed(2)}%)`);
}, [minBalance0, minBalance1, lpPosition.asset0Amount, lpPosition.asset1Amount]);
const handleRemoveLiquidity = async () => {
@@ -186,9 +186,9 @@ export const RemoveLiquidityModal: React.FC<RemoveLiquidityModalProps> = ({
{ signer: injector.signer },
({ status, events }) => {
if (status.isInBlock) {
console.log('Transaction in block');
if (import.meta.env.DEV) console.log('Transaction in block');
} else if (status.isFinalized) {
console.log('Transaction finalized');
if (import.meta.env.DEV) console.log('Transaction finalized');
// Check for errors
const hasError = events.some(({ event }) =>
@@ -212,7 +212,7 @@ export const RemoveLiquidityModal: React.FC<RemoveLiquidityModalProps> = ({
}
);
} catch (err) {
console.error('Error removing liquidity:', err);
if (import.meta.env.DEV) console.error('Error removing liquidity:', err);
setError(err instanceof Error ? err.message : 'Failed to remove liquidity');
setIsLoading(false);
}