mirror of
https://github.com/pezkuwichain/pwap.git
synced 2026-04-22 05:37:56 +00:00
pezkuwichain
0ea3b9df1f
## Problem Frontend was showing 'connecting network' message on production (pezkuwichain.io) because: 1. WebSocket endpoint was hardcoded to localhost in App.tsx 2. DEFAULT_ENDPOINT in polkadot.ts was not reading environment variables ## Solution ### shared/blockchain/polkadot.ts - Added getWebSocketEndpoint() function to read VITE_NETWORK and corresponding VITE_WS_ENDPOINT_* env vars - Changed DEFAULT_ENDPOINT from hardcoded value to call getWebSocketEndpoint() - Now correctly uses wss://ws.pezkuwichain.io in production ### web/src/App.tsx - Removed hardcoded endpoint="ws://127.0.0.1:9944" prop from PolkadotProvider - Now uses DEFAULT_ENDPOINT which reads from environment ### web/vite.config.ts - Minor formatting improvements (no functional changes) ### CLAUDE_README_KRITIK.md (New file) - Critical documentation for future Claude instances - Documents VPS validator setup, bootnode configuration - Strict warnings not to modify working blockchain - Troubleshooting commands and procedures - Frontend deployment steps ## Result - Production site now correctly connects to wss://ws.pezkuwichain.io - Environment-based configuration working as expected - Local dev still uses ws://127.0.0.1:9944 ## Files Changed - shared/blockchain/polkadot.ts: Dynamic endpoint selection - web/src/App.tsx: Remove hardcoded endpoint - CLAUDE_README_KRITIK.md: Critical documentation (new)
Shared Code
This directory contains code shared between web, mobile, and SDK UI applications.
Structure
-
types/ - TypeScript type definitions and interfaces
blockchain.ts- Blockchain-related types (WalletAccount, Transaction, etc.)tokens.ts- Token and DEX types (TokenInfo, PoolInfo, SwapQuote, etc.)
-
constants/ - Shared constants and configuration values
KNOWN_TOKENS- Token definitions (HEZ, PEZ, USDT)KURDISTAN_COLORS- Color palette (Kesk, Sor, Zer, Spî, Reş)SUPPORTED_LANGUAGES- Available languages (EN, TR, KMR, CKB, AR, FA)TOKEN_DISPLAY_SYMBOLS- Display vs blockchain symbol mapping
-
blockchain/ - Blockchain-related utilities
polkadot.ts- Polkadot/Substrate utilities and endpointsDEFAULT_ENDPOINT- Current blockchain endpoint (beta testnet)
-
i18n/ - Internationalization
locales/- Translation files for 6 languagesLANGUAGES- Language configurations with RTL supporttranslations- All locale data
-
utils/ - Utility functions and helpers
formatting.ts- Address and number formattingvalidation.ts- Input validation utilities
Usage
Import shared code in your projects:
// Token types and constants
import { TokenInfo, KNOWN_TOKENS } from '../../../shared/types/tokens';
import { KURDISTAN_COLORS, TOKEN_DISPLAY_SYMBOLS } from '../../../shared/constants';
// Blockchain utilities
import { DEFAULT_ENDPOINT, BLOCKCHAIN_ENDPOINTS } from '../../../shared/blockchain/polkadot';
// i18n
import { translations, LANGUAGES, isRTL } from '../../../shared/i18n';
// Formatting utilities
import { formatAddress, formatTokenAmount } from '../../../shared/utils/formatting';
Guidelines
- Keep code framework-agnostic when possible
- Add comprehensive JSDoc comments
- Write unit tests for utilities
- Avoid platform-specific dependencies
- Use relative imports:
../../../shared/...from web/mobile/SDK UI