@n1xyz/wallet-widget 0.0.4 → 0.0.7

package/dist/Modal/Sidebar/NordTradingView/TradeForm/TradeForm.js

@@ -0,0 +1,259 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from 'react';
+import { useN1WalletContext } from '../../../../Provider/hooks';
+import BuySellTabs from './BuySellTabs';
+import FillModeSelector from './FillModeSelector';
+import PriceInput from './PriceInput';
+import AmountInput from './AmountInput';
+import TotalCalculator from './TotalCalculator';
+import SubmitButton from './SubmitButton';
+import { AlertCircle, Check, Lock, Unlock, Info } from 'lucide-react';
+import { logger } from '../../../../utils/logger';
+// Map our FillMode to the Nord FillMode enum
+var mapFillMode = function (mode) {
+    switch (mode) {
+        case 'GTC':
+            return 0; // LIMIT
+        case 'POST_ONLY':
+            return 1; // POST_ONLY
+        case 'IOC':
+            return 2; // IMMEDIATE_OR_CANCEL
+        case 'FOK':
+            return 3; // FILL_OR_KILL
+        default:
+            return 0;
+    }
+};
+// Map our OrderSide to the Nord Side enum
+var mapSide = function (side) {
+    return side === 'BUY' ? 1 : 0; // BID = 1, ASK = 0
+};
+// Helper to determine if a fill mode is a market order
+var isMarketOrder = function (mode) {
+    return mode === 'IOC'; // IOC is used for market orders
+};
+export default function TradeForm(_a) {
+    var _this = this;
+    var marketSymbol = _a.marketSymbol;
+    var _b = useN1WalletContext(), nord = _b.nord, nordUser = _b.nordUser;
+    // Form state
+    var _c = useState('BUY'), side = _c[0], setSide = _c[1];
+    var _d = useState('GTC'), fillMode = _d[0], setFillMode = _d[1];
+    var _e = useState(''), price = _e[0], setPrice = _e[1];
+    var _f = useState(''), amount = _f[0], setAmount = _f[1];
+    var _g = useState(''), total = _g[0], setTotal = _g[1];
+    var _h = useState(false), isReduceOnly = _h[0], setIsReduceOnly = _h[1];
+    var _j = useState(undefined), accountId = _j[0], setAccountId = _j[1];
+    // UI state
+    var _k = useState(false), loading = _k[0], setLoading = _k[1];
+    var _l = useState(null), error = _l[0], setError = _l[1];
+    var _m = useState(null), success = _m[0], setSuccess = _m[1];
+    var _o = useState(false), formVisible = _o[0], setFormVisible = _o[1];
+    // Market data
+    var _p = useState(null), marketInfo = _p[0], setMarketInfo = _p[1];
+    // Show form with animation after initial render
+    useEffect(function () {
+        var timer = setTimeout(function () {
+            setFormVisible(true);
+        }, 100);
+        return function () { return clearTimeout(timer); };
+    }, []);
+    // Fetch market info and user account ID when market changes
+    useEffect(function () {
+        if (!marketSymbol || !nord)
+            return;
+        var fetchMarketInfo = function () { return __awaiter(_this, void 0, void 0, function () {
+            var stats, selectedMarket, err_1;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        _a.trys.push([0, 2, , 3]);
+                        return [4 /*yield*/, nord.getMarketStats()];
+                    case 1:
+                        stats = _a.sent();
+                        selectedMarket = stats.markets.find(function (m) { return m.symbol === marketSymbol; });
+                        setMarketInfo(selectedMarket || null);
+                        // Set default price to current market price
+                        if (selectedMarket === null || selectedMarket === void 0 ? void 0 : selectedMarket.lastPrice) {
+                            setPrice(selectedMarket.lastPrice.toString());
+                        }
+                        return [3 /*break*/, 3];
+                    case 2:
+                        err_1 = _a.sent();
+                        console.error('Error fetching market info:', err_1);
+                        return [3 /*break*/, 3];
+                    case 3: return [2 /*return*/];
+                }
+            });
+        }); };
+        var fetchUserAccount = function () { return __awaiter(_this, void 0, void 0, function () {
+            var err_2;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        if (!nordUser) return [3 /*break*/, 4];
+                        _a.label = 1;
+                    case 1:
+                        _a.trys.push([1, 3, , 4]);
+                        // Update account ID
+                        return [4 /*yield*/, nordUser.updateAccountId()];
+                    case 2:
+                        // Update account ID
+                        _a.sent();
+                        // Set the first account ID if available
+                        if (nordUser.accountIds && nordUser.accountIds.length > 0) {
+                            setAccountId(nordUser.accountIds[0]);
+                        }
+                        return [3 /*break*/, 4];
+                    case 3:
+                        err_2 = _a.sent();
+                        console.error('Error fetching user account:', err_2);
+                        return [3 /*break*/, 4];
+                    case 4: return [2 /*return*/];
+                }
+            });
+        }); };
+        fetchMarketInfo();
+        fetchUserAccount();
+    }, [marketSymbol, nord, nordUser]);
+    // Calculate total when price or amount changes
+    useEffect(function () {
+        if (!isMarketOrder(fillMode) && price && amount) {
+            var calculatedTotal = parseFloat(price) * parseFloat(amount);
+            setTotal(calculatedTotal.toFixed(8));
+        }
+        else if (isMarketOrder(fillMode)) {
+            setTotal('Market');
+        }
+        else {
+            setTotal('');
+        }
+    }, [price, amount, fillMode]);
+    // Handle order submission
+    var handleSubmit = function (e) { return __awaiter(_this, void 0, void 0, function () {
+        var market, marketId, orderParams, orderId, err_3;
+        var _a;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
+                case 0:
+                    e.preventDefault();
+                    if (!marketSymbol || !nordUser) {
+                        setError('User or market not available');
+                        return [2 /*return*/];
+                    }
+                    if (!isMarketOrder(fillMode) && (!price || parseFloat(price) <= 0)) {
+                        setError('Please enter a valid price');
+                        return [2 /*return*/];
+                    }
+                    if (!amount || parseFloat(amount) <= 0) {
+                        setError('Please enter a valid amount');
+                        return [2 /*return*/];
+                    }
+                    setLoading(true);
+                    setError(null);
+                    setSuccess(null);
+                    _b.label = 1;
+                case 1:
+                    _b.trys.push([1, 3, 4, 5]);
+                    market = (_a = nord === null || nord === void 0 ? void 0 : nord.markets) === null || _a === void 0 ? void 0 : _a.find(function (m) { return m.symbol === marketSymbol; });
+                    marketId = market
+                        ? market.id || market.marketId || 0
+                        : 0;
+                    orderParams = {
+                        marketId: marketId,
+                        side: mapSide(side),
+                        fillMode: mapFillMode(fillMode),
+                        isReduceOnly: isReduceOnly,
+                        // For limit orders or SELL orders, we need size
+                        size: !isMarketOrder(fillMode) || side === 'SELL' ? amount : undefined,
+                        // For limit orders, we need price
+                        price: !isMarketOrder(fillMode) ? price : undefined,
+                        // For market BUY orders, we need quoteSize (total amount to spend)
+                        quoteSize: isMarketOrder(fillMode) && side === 'BUY' ? total : undefined,
+                        // Use the first account ID if available
+                        accountId: accountId,
+                    };
+                    logger.debug('Placing order with params:', orderParams);
+                    return [4 /*yield*/, nordUser.placeOrder(orderParams)];
+                case 2:
+                    orderId = _b.sent();
+                    if (orderId) {
+                        setSuccess("Order placed successfully! Order ID: ".concat(orderId));
+                        // Reset form
+                        setAmount('');
+                        if (isMarketOrder(fillMode)) {
+                            setPrice('');
+                        }
+                    }
+                    else {
+                        throw new Error('Failed to place order');
+                    }
+                    return [3 /*break*/, 5];
+                case 3:
+                    err_3 = _b.sent();
+                    logger.error('Error placing order:', err_3);
+                    setError(err_3.message || 'Failed to place order');
+                    return [3 /*break*/, 5];
+                case 4:
+                    setLoading(false);
+                    return [7 /*endfinally*/];
+                case 5: return [2 /*return*/];
+            }
+        });
+    }); };
+    return (_jsxs("div", { className: "p-4 bg-white dark:bg-dark-950 transition-colors duration-300", children: [_jsxs("h2", { className: "text-base font-semibold text-gray-900 dark:text-gray-100 mb-3 transform transition-all duration-500 ".concat(formVisible ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0'), children: ["Place Order", ' ', marketSymbol ? (_jsx("span", { className: side === 'BUY'
+                            ? 'text-emerald-600 dark:text-emerald-500'
+                            : 'text-red-700 dark:text-red-600', children: marketSymbol })) : ('')] }), !marketSymbol ? (_jsx("div", { className: "p-3 border border-gray-200 dark:border-gray-800 rounded-sm text-gray-500 dark:text-gray-400 text-xs bg-gray-50 dark:bg-dark-950 transform transition-all duration-500 ".concat(formVisible ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0'), children: "Select a market to place orders" })) : (_jsx("form", { onSubmit: handleSubmit, children: _jsxs("div", { className: "space-y-3", children: [_jsx("div", { className: "transform transition-all duration-500 delay-100 ".concat(formVisible ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0'), children: _jsx(BuySellTabs, { side: side, onChange: setSide }) }), _jsx("div", { className: "transform transition-all duration-500 delay-200 ".concat(formVisible ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0'), children: _jsx(FillModeSelector, { fillMode: fillMode, onFillModeChange: setFillMode }) }), !isMarketOrder(fillMode) && (_jsx("div", { className: "transform transition-all duration-500 delay-300 ".concat(formVisible ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0'), children: _jsx(PriceInput, { price: price, onChange: setPrice, marketPrice: marketInfo === null || marketInfo === void 0 ? void 0 : marketInfo.lastPrice }) })), _jsx("div", { className: "transform transition-all duration-500 delay-400 ".concat(formVisible ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0'), children: _jsx(AmountInput, { amount: amount, onChange: setAmount, marketInfo: marketInfo }) }), _jsx("div", { className: "transform transition-all duration-500 delay-500 ".concat(formVisible ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0'), children: _jsx(TotalCalculator, { total: total, orderType: isMarketOrder(fillMode) ? 'MARKET' : 'LIMIT' }) }), accountId && (_jsx("div", { className: "transform transition-all duration-500 delay-550 ".concat(formVisible ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0'), children: _jsxs("div", { className: "flex items-center text-xs text-gray-500 dark:text-gray-400", children: [_jsx(Info, { size: 12, className: "mr-1" }), _jsxs("span", { children: ["Account ID: ", accountId] })] }) })), _jsx("div", { className: "transform transition-all duration-500 delay-600 ".concat(formVisible ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0'), children: _jsxs("button", { type: "button", onClick: function () { return setIsReduceOnly(!isReduceOnly); }, className: "w-full flex items-center justify-between px-3 py-2 rounded-sm text-sm transition-all duration-300 ".concat(isReduceOnly
+                                    ? side === 'BUY'
+                                        ? 'bg-emerald-50 dark:bg-emerald-900/10 text-emerald-700 dark:text-emerald-400 border border-emerald-200 dark:border-emerald-800/30'
+                                        : 'bg-red-50 dark:bg-red-900/10 text-red-700 dark:text-red-400 border border-red-200 dark:border-red-800/30'
+                                    : 'bg-gray-50 dark:bg-gray-900 text-gray-700 dark:text-gray-300 border border-gray-200 dark:border-gray-800 hover:border-gray-300 dark:hover:border-gray-600'), children: [_jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "mr-2 transition-colors duration-300 ".concat(isReduceOnly
+                                                    ? side === 'BUY'
+                                                        ? 'text-emerald-600 dark:text-emerald-500'
+                                                        : 'text-red-600 dark:text-red-500'
+                                                    : 'text-gray-500 dark:text-gray-400'), children: isReduceOnly ? _jsx(Lock, { size: 14 }) : _jsx(Unlock, { size: 14 }) }), _jsx("span", { className: "text-xs", children: "Reduce Only" })] }), _jsx("div", { className: "flex items-center justify-center w-4 h-4 rounded-full transition-all duration-300 ".concat(isReduceOnly
+                                            ? side === 'BUY'
+                                                ? 'bg-emerald-600 dark:bg-emerald-500 text-white'
+                                                : 'bg-red-600 dark:bg-red-500 text-white'
+                                            : 'bg-gray-200 dark:bg-gray-700'), children: isReduceOnly && _jsx(Check, { size: 10 }) })] }) }), _jsxs("div", { className: "p-2 border rounded-sm text-xs transition-all duration-300 transform ".concat(error
+                                ? 'opacity-100 max-h-20 border-red-200 dark:border-red-900/30 bg-red-50 dark:bg-red-900/10 text-red-700 dark:text-red-400 flex items-center translate-y-0'
+                                : 'opacity-0 max-h-0 overflow-hidden border-transparent translate-y-2'), children: [error && (_jsx(AlertCircle, { size: 14, className: "mr-2 flex-shrink-0" })), error] }), _jsx("div", { className: "p-2 border rounded-sm text-xs transition-all duration-300 transform ".concat(success
+                                ? 'opacity-100 max-h-20 border-emerald-200 dark:border-emerald-900/30 bg-emerald-50 dark:bg-emerald-900/10 text-emerald-700 dark:text-emerald-400 translate-y-0'
+                                : 'opacity-0 max-h-0 overflow-hidden border-transparent translate-y-2'), children: success }), _jsx("div", { className: "transform transition-all duration-500 delay-700 ".concat(formVisible ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0'), children: _jsx(SubmitButton, { loading: loading, side: side, orderType: isMarketOrder(fillMode) ? 'MARKET' : 'LIMIT', disabled: !marketSymbol || loading }) })] }) }))] }));
+}

package/dist/Modal/Sidebar/NordTradingView/TradeHistory/TradeHistory.d.ts

@@ -0,0 +1,5 @@
+interface TradeHistoryProps {
+    marketSymbol: string | null;
+}
+export default function TradeHistory({ marketSymbol }: TradeHistoryProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Modal/Sidebar/NordTradingView/TradeHistory/TradeHistory.js

@@ -0,0 +1,138 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { useState, useEffect, useRef } from 'react';
+import { useN1WalletContext } from '../../../../Provider/hooks';
+import { RefreshCw, ArrowUp, ArrowDown } from 'lucide-react';
+export default function TradeHistory(_a) {
+    var _this = this;
+    var marketSymbol = _a.marketSymbol;
+    var nord = useN1WalletContext().nord;
+    var _b = useState([]), trades = _b[0], setTrades = _b[1];
+    var _c = useState(false), loading = _c[0], setLoading = _c[1];
+    var _d = useState(null), error = _d[0], setError = _d[1];
+    var _e = useState(true), autoscroll = _e[0], setAutoscroll = _e[1];
+    var tradeListRef = useRef(null);
+    // Fetch trade history
+    useEffect(function () {
+        if (!marketSymbol || !nord)
+            return;
+        var subscription = null;
+        var fetchTrades = function () { return __awaiter(_this, void 0, void 0, function () {
+            var response, formattedTrades, err_1;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        setLoading(true);
+                        setError(null);
+                        _a.label = 1;
+                    case 1:
+                        _a.trys.push([1, 3, 4, 5]);
+                        return [4 /*yield*/, nord.getTrades({
+                                symbol: marketSymbol,
+                                limit: 50
+                            })];
+                    case 2:
+                        response = _a.sent();
+                        formattedTrades = response.trades.map(function (trade) { return ({
+                            id: trade.id,
+                            price: trade.price,
+                            size: trade.size,
+                            side: trade.side,
+                            timestamp: trade.timestamp,
+                        }); });
+                        setTrades(formattedTrades);
+                        // Subscribe to real-time updates
+                        subscription = nord.subscribeTrades(marketSymbol);
+                        subscription.on('update', function (update) {
+                            setTrades(function (prev) {
+                                // Add new trade to the beginning of the array
+                                var newTrades = __spreadArray([
+                                    {
+                                        id: update.id,
+                                        price: update.price,
+                                        size: update.size,
+                                        side: update.side,
+                                        timestamp: update.timestamp || Date.now(),
+                                    }
+                                ], prev, true);
+                                // Limit to 50 trades
+                                return newTrades.slice(0, 50);
+                            });
+                        });
+                        return [3 /*break*/, 5];
+                    case 3:
+                        err_1 = _a.sent();
+                        console.error('Error fetching trades:', err_1);
+                        setError('Failed to load trade history');
+                        return [3 /*break*/, 5];
+                    case 4:
+                        setLoading(false);
+                        return [7 /*endfinally*/];
+                    case 5: return [2 /*return*/];
+                }
+            });
+        }); };
+        fetchTrades();
+        // Cleanup subscription on unmount or market change
+        return function () {
+            if (subscription) {
+                subscription.close();
+            }
+        };
+    }, [marketSymbol, nord]);
+    // Auto-scroll to the top when new trades come in
+    useEffect(function () {
+        if (autoscroll && tradeListRef.current) {
+            tradeListRef.current.scrollTop = 0;
+        }
+    }, [trades, autoscroll]);
+    // Format timestamp
+    var formatTime = function (timestamp) {
+        return new Date(timestamp).toLocaleTimeString();
+    };
+    return (_jsx("div", { className: "bg-white dark:bg-gray-950 rounded-xl shadow-sm border border-gray-200 dark:border-gray-800 overflow-hidden", children: _jsxs("div", { className: "p-4", children: [_jsxs("div", { className: "flex items-center justify-between mb-4", children: [_jsxs("h2", { className: "text-lg font-semibold text-gray-900 dark:text-gray-100", children: ["Trade History ", marketSymbol ? "(".concat(marketSymbol, ")") : ''] }), _jsxs("div", { className: "flex items-center", children: [_jsxs("label", { className: "flex items-center text-sm text-gray-600 dark:text-gray-400 mr-3", children: [_jsx("input", { type: "checkbox", checked: autoscroll, onChange: function () { return setAutoscroll(!autoscroll); }, className: "mr-1 h-3 w-3" }), "Auto-scroll"] }), loading && (_jsx(RefreshCw, { size: 16, className: "text-gray-400 animate-spin" }))] })] }), error ? (_jsx("div", { className: "p-3 bg-red-50 dark:bg-red-900/20 rounded-lg text-red-600 dark:text-red-400 text-sm", children: error })) : !marketSymbol ? (_jsx("div", { className: "p-3 bg-gray-50 dark:bg-gray-800 rounded-lg text-gray-500 dark:text-gray-400 text-sm text-center", children: "Select a market to view trade history" })) : loading && trades.length === 0 ? (_jsx("div", { className: "flex items-center justify-center h-32", children: _jsx(RefreshCw, { size: 20, className: "text-gray-400 animate-spin" }) })) : trades.length === 0 ? (_jsx("div", { className: "p-3 bg-gray-50 dark:bg-gray-800 rounded-lg text-gray-500 dark:text-gray-400 text-sm text-center", children: "No trades found" })) : (_jsx("div", { ref: tradeListRef, className: "overflow-y-auto max-h-60", onMouseEnter: function () { return setAutoscroll(false); }, onMouseLeave: function () { return setAutoscroll(true); }, children: _jsxs("table", { className: "min-w-full divide-y divide-gray-200 dark:divide-gray-800", children: [_jsx("thead", { className: "bg-gray-50 dark:bg-gray-800", children: _jsxs("tr", { children: [_jsx("th", { className: "px-3 py-2 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider", children: "Time" }), _jsx("th", { className: "px-3 py-2 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider", children: "Side" }), _jsx("th", { className: "px-3 py-2 text-right text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider", children: "Price" }), _jsx("th", { className: "px-3 py-2 text-right text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider", children: "Size" })] }) }), _jsx("tbody", { className: "bg-white dark:bg-gray-950 divide-y divide-gray-200 dark:divide-gray-800", children: trades.map(function (trade) { return (_jsxs("tr", { className: "hover:bg-gray-50 dark:hover:bg-gray-800", children: [_jsx("td", { className: "px-3 py-2 whitespace-nowrap text-xs text-gray-500 dark:text-gray-400", children: formatTime(trade.timestamp) }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-xs", children: _jsxs("div", { className: "flex items-center ".concat(trade.side === 'BUY' ? 'text-green-600 dark:text-green-400' : 'text-red-600 dark:text-red-400'), children: [trade.side === 'BUY' ? (_jsx(ArrowUp, { size: 12, className: "mr-1" })) : (_jsx(ArrowDown, { size: 12, className: "mr-1" })), trade.side] }) }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-xs text-gray-900 dark:text-gray-100 text-right font-mono", children: trade.price.toFixed(4) }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-xs text-gray-900 dark:text-gray-100 text-right font-mono", children: trade.size.toFixed(4) })] }, trade.id)); }) })] }) }))] }) }));
+}

package/dist/Modal/Sidebar/NordTradingView/UserBalances/UserBalances.d.ts

@@ -0,0 +1 @@
+export default function UserBalances(): import("react/jsx-runtime").JSX.Element;

package/dist/Modal/Sidebar/NordTradingView/UserBalances/UserBalances.js

@@ -0,0 +1,108 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from 'react';
+import { useN1WalletContext } from '../../../../Provider/hooks';
+import { RefreshCw } from 'lucide-react';
+export default function UserBalances() {
+    var _this = this;
+    var _a = useN1WalletContext(), nord = _a.nord, nordUser = _a.nordUser;
+    var _b = useState([]), balances = _b[0], setBalances = _b[1];
+    var _c = useState(false), loading = _c[0], setLoading = _c[1];
+    var _d = useState(null), error = _d[0], setError = _d[1];
+    // Fetch user balances
+    useEffect(function () {
+        if (!nordUser || !nord)
+            return;
+        var fetchBalances = function () { return __awaiter(_this, void 0, void 0, function () {
+            var realBalances, _i, _a, accountId, accountBalances, _b, accountBalances_1, balance, err_1;
+            return __generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0:
+                        setLoading(true);
+                        setError(null);
+                        _c.label = 1;
+                    case 1:
+                        _c.trys.push([1, 3, 4, 5]);
+                        // Refresh user info to get latest balances
+                        return [4 /*yield*/, nordUser.fetchInfo()];
+                    case 2:
+                        // Refresh user info to get latest balances
+                        _c.sent();
+                        realBalances = [];
+                        // Loop through all accounts
+                        if (nordUser.accountIds) {
+                            for (_i = 0, _a = nordUser.accountIds; _i < _a.length; _i++) {
+                                accountId = _a[_i];
+                                accountBalances = nordUser.balances[accountId];
+                                if (accountBalances && accountBalances.length > 0) {
+                                    // Add each balance to our list
+                                    for (_b = 0, accountBalances_1 = accountBalances; _b < accountBalances_1.length; _b++) {
+                                        balance = accountBalances_1[_b];
+                                        // Only include non-zero balances
+                                        if (balance.balance > 0) {
+                                            realBalances.push({
+                                                symbol: balance.symbol,
+                                                balance: balance.balance,
+                                                accountId: accountId,
+                                            });
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                        setBalances(realBalances);
+                        return [3 /*break*/, 5];
+                    case 3:
+                        err_1 = _c.sent();
+                        console.error('Error fetching balances:', err_1);
+                        setError('Failed to load balances');
+                        return [3 /*break*/, 5];
+                    case 4:
+                        setLoading(false);
+                        return [7 /*endfinally*/];
+                    case 5: return [2 /*return*/];
+                }
+            });
+        }); };
+        fetchBalances();
+        // Set up polling for balance updates
+        var intervalId = setInterval(fetchBalances, 10000); // Update every 10 seconds
+        return function () { return clearInterval(intervalId); };
+    }, [nordUser, nord]);
+    return (_jsx("div", { className: "bg-white dark:bg-gray-950 overflow-hidden", children: _jsxs("div", { className: "p-4", children: [_jsx("h2", { className: "text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4", children: "Balances" }), loading && balances.length === 0 ? (_jsx("div", { className: "flex items-center justify-center h-32", children: _jsx(RefreshCw, { size: 20, className: "text-gray-400 animate-spin" }) })) : error ? (_jsx("div", { className: "p-3 bg-red-50 dark:bg-red-900/20 rounded-lg text-red-600 dark:text-red-400 text-sm", children: error })) : balances.length === 0 ? (_jsx("div", { className: "p-3 bg-gray-50 dark:bg-gray-950 rounded-lg text-gray-500 dark:text-gray-400 text-sm text-center", children: "No balances found" })) : (_jsxs("div", { className: "space-y-3", children: [balances.map(function (balance, index) { return (_jsxs("div", { className: "p-3 bg-gray-50 dark:bg-gray-950 rounded-lg", children: [_jsxs("div", { className: "flex items-center justify-between mb-2", children: [_jsx("div", { className: "flex items-center", children: _jsx("span", { className: "font-medium text-gray-900 dark:text-gray-100", children: balance.symbol }) }), _jsx("div", { className: "font-medium text-gray-900 dark:text-gray-100 font-mono", children: balance.balance.toFixed(6) })] }), _jsxs("div", { className: "text-xs text-gray-500 dark:text-gray-400", children: ["Account ID: ", balance.accountId] })] }, index)); }), loading && balances.length > 0 && (_jsx("div", { className: "flex justify-center mt-2", children: _jsx(RefreshCw, { size: 16, className: "text-gray-400 animate-spin" }) }))] }))] }) }));
+}

package/dist/Modal/Sidebar/NordTradingView/UserOrders/UserOrders.d.ts

@@ -0,0 +1 @@
+export default function UserOrders(): import("react/jsx-runtime").JSX.Element;