Integrate warehouse data and platform prices to display real transactions

[netlify-coding]

🔗 View agent run: https://app.netlify.com/projects/pirc-101/agent-runs/69b492ebd8b441091fd057e0

🤖 Agent: Claude

💬 Prompt: Now, let it react based on warehouse information, attract prices from platforms and exchanges, and display actual transactions to begin displaying transactions in a real way.

✅ Result: The PiRC-101 dashboard was transformed from a simulation-based display to a live, real-data trading dashboard that fetches actual prices, transactions, and order book data from OKX and MEXC exchanges.

Previously, the dashboard generated random/simulated prices and fake transaction data using Math.random() on a 3-second interval. There was no connection to real exchange APIs, and the transaction explorer showed fabricated hashes and amounts.

Three Netlify Functions were created to serve as API proxies for real exchange data:

• netlify/functions/prices.js — Fetches real-time PI/USDT ticker data from both OKX and MEXC public APIs, including 24-hour price changes, highs, lows, and trading volume. It also retrieves 1-minute candlestick (kline) data from MEXC for the live chart. An aggregated average price across both exchanges is computed.

• netlify/functions/trades.js — Fetches the 15 most recent actual trades from both OKX and MEXC, returning real trade data including price, quantity, buy/sell side, and timestamps. Trades are merged and sorted by time.

• netlify/functions/orderbook.js — Fetches real order book (depth) data from both exchanges, computing warehouse/inventory metrics: best bid, best ask, spread, spread percentage, total bid/ask volume, and a buy pressure indicator that reflects real market supply/demand dynamics.

The frontend (index.html) was completely rewritten to consume these real APIs:

• Exchange prices now show actual OKX and MEXC prices with real 24-hour change percentages
• The candlestick chart displays real 1-minute kline data from MEXC instead of random candles
• The PiRC justice price chart derives from actual exchange data multiplied by the WCF multiplier
• A new order book summary bar shows real best bid/ask, spread, and buy pressure with a visual indicator
• The transaction explorer now displays actual trades from both exchanges with real prices, quantities, timestamps, exchange badges (OKX/MEXC), and buy/sell classification
• New trades are highlighted with a fade-in animation and automatically detected via trade ID deduplication
• Connection status indicators show whether the live data feed is active
• An error banner appears if API calls fail, with automatic retry
• Polling intervals: prices every 5 seconds, trades every 4 seconds, order book every 6 seconds
• Protocol efficiency (Φ) is now computed from the real spread between exchanges

A netlify.toml configuration file was added to define the functions directory and build settings. All API calls use Promise.allSettled for resilience — if one exchange is unavailable, the dashboard continues to work with data from the other.

[netlify]

✅ Deploy Preview for pirc-101 ready!

Name	Link
🔨 Latest commit	a02bf32
🔍 Latest deploy log	https://app.netlify.com/projects/pirc-101/deploys/69b494dca39d98000851b512
😎 Deploy Preview	https://deploy-preview-2--pirc-101.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.