@n1xyz/wallet-widget 0.0.5 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (92) hide show
  1. package/dist/Logic/sessionManager.d.ts +1 -1
  2. package/dist/Logic/sessionManager.js +9 -5
  3. package/dist/Logic/transactionManager.js +7 -3
  4. package/dist/Logic/utils.js +9 -12
  5. package/dist/Modal/N1WalletModal.js +2 -3
  6. package/dist/Modal/NTSFlow/NTSFlow.js +7 -3
  7. package/dist/Modal/NTSFlow/components/BackButton.js +0 -1
  8. package/dist/Modal/NTSFlow/views/CreateSessionView.js +1 -1
  9. package/dist/Modal/NordFlow/NordFlow.js +27 -22
  10. package/dist/Modal/NordFlow/components/ChainButton.d.ts +1 -1
  11. package/dist/Modal/NordFlow/components/ChainButton.js +8 -8
  12. package/dist/Modal/NordFlow/components/EVMChainsButton.d.ts +8 -0
  13. package/dist/Modal/NordFlow/components/EVMChainsButton.js +18 -0
  14. package/dist/Modal/NordFlow/components/MoreButton.d.ts +8 -0
  15. package/dist/Modal/NordFlow/components/MoreButton.js +18 -0
  16. package/dist/Modal/NordFlow/components/TransactionTable.d.ts +1 -1
  17. package/dist/Modal/NordFlow/components/TransactionTable.js +8 -6
  18. package/dist/Modal/NordFlow/constants.js +9 -4
  19. package/dist/Modal/NordFlow/hooks/useDepositFlow.js +39 -18
  20. package/dist/Modal/NordFlow/hooks/useFlowState.js +5 -4
  21. package/dist/Modal/NordFlow/hooks/useNordInstance.js +17 -8
  22. package/dist/Modal/NordFlow/hooks/useNordWalletConnect.js +28 -20
  23. package/dist/Modal/NordFlow/screens/02-EvmWalletAuthScreen.js +1 -1
  24. package/dist/Modal/NordFlow/screens/03-ChainSelectionScreen.js +39 -23
  25. package/dist/Modal/NordFlow/screens/04-AmountInputScreen.d.ts +4 -1
  26. package/dist/Modal/NordFlow/screens/04-AmountInputScreen.js +38 -16
  27. package/dist/Modal/NordFlow/screens/05-DepositProgressScreen.d.ts +1 -1
  28. package/dist/Modal/NordFlow/screens/05-DepositProgressScreen.js +3 -2
  29. package/dist/Modal/NordFlow/screens/06-DepositSuccessScreen.js +3 -1
  30. package/dist/Modal/NordFlow/screens/07-AuthLoadingScreen.d.ts +1 -1
  31. package/dist/Modal/NordFlow/screens/07-AuthLoadingScreen.js +19 -10
  32. package/dist/Modal/NordFlow/screens/08-FinalSuccessScreen.d.ts +1 -1
  33. package/dist/Modal/NordFlow/screens/08-FinalSuccessScreen.js +3 -3
  34. package/dist/Modal/NordFlow/screens/09-ErrorScreen.d.ts +1 -1
  35. package/dist/Modal/NordFlow/screens/09-ErrorScreen.js +11 -6
  36. package/dist/Modal/NordFlow/types.d.ts +4 -1
  37. package/dist/Modal/NordFlow/types.js +1 -0
  38. package/dist/Modal/NordFlow/utils/imageUtils.js +3 -3
  39. package/dist/Modal/NordFlow/utils/nordUtils.js +3 -1
  40. package/dist/Modal/Sidebar/N1Sidebar.js +11 -5
  41. package/dist/Modal/Sidebar/NordTradingView/MarketOverview/MarketOverview.d.ts +1 -1
  42. package/dist/Modal/Sidebar/NordTradingView/MarketOverview/MarketSelector.d.ts +1 -1
  43. package/dist/Modal/Sidebar/NordTradingView/MarketOverview/MarketSelector.js +7 -3
  44. package/dist/Modal/Sidebar/NordTradingView/MarketOverview/MarketStats.d.ts +1 -1
  45. package/dist/Modal/Sidebar/NordTradingView/NordTradingView.js +7 -7
  46. package/dist/Modal/Sidebar/NordTradingView/OrderBook/OrderBook.js +27 -16
  47. package/dist/Modal/Sidebar/NordTradingView/OrderBook/OrderBookDepthVisualizer.d.ts +1 -1
  48. package/dist/Modal/Sidebar/NordTradingView/OrderBook/OrderBookHeader.d.ts +1 -1
  49. package/dist/Modal/Sidebar/NordTradingView/OrderBook/OrderBookHeader.js +3 -2
  50. package/dist/Modal/Sidebar/NordTradingView/OrderBook/OrderBookTable.d.ts +1 -1
  51. package/dist/Modal/Sidebar/NordTradingView/OrderBook/OrderBookTable.js +2 -3
  52. package/dist/Modal/Sidebar/NordTradingView/TradeForm/AmountInput.d.ts +1 -1
  53. package/dist/Modal/Sidebar/NordTradingView/TradeForm/BuySellTabs.js +2 -2
  54. package/dist/Modal/Sidebar/NordTradingView/TradeForm/FillModeSelector.d.ts +1 -1
  55. package/dist/Modal/Sidebar/NordTradingView/TradeForm/FillModeSelector.js +16 -13
  56. package/dist/Modal/Sidebar/NordTradingView/TradeForm/OrderTypeSelector.d.ts +1 -1
  57. package/dist/Modal/Sidebar/NordTradingView/TradeForm/OrderTypeSelector.js +17 -11
  58. package/dist/Modal/Sidebar/NordTradingView/TradeForm/PriceInput.d.ts +1 -1
  59. package/dist/Modal/Sidebar/NordTradingView/TradeForm/SubmitButton.d.ts +1 -1
  60. package/dist/Modal/Sidebar/NordTradingView/TradeForm/SubmitButton.js +2 -2
  61. package/dist/Modal/Sidebar/NordTradingView/TradeForm/TotalCalculator.d.ts +1 -1
  62. package/dist/Modal/Sidebar/NordTradingView/TradeForm/TotalCalculator.js +3 -1
  63. package/dist/Modal/Sidebar/NordTradingView/TradeForm/TradeForm.js +21 -11
  64. package/dist/Modal/Sidebar/NordTradingView/UserBalances/UserBalances.js +1 -1
  65. package/dist/Modal/Sidebar/NordTradingView/UserOrders/UserOrders.js +11 -6
  66. package/dist/Modal/Sidebar/NordTradingView/UserPositions/UserPositions.js +14 -7
  67. package/dist/Provider/LazyWalletProvider.js +11 -5
  68. package/dist/Provider/N1WalletProvider.js +6 -5
  69. package/dist/components/logos/ArbitrumLogo.d.ts +8 -0
  70. package/dist/components/logos/ArbitrumLogo.js +5 -0
  71. package/dist/components/logos/BaseLogo.d.ts +8 -0
  72. package/dist/components/logos/BaseLogo.js +5 -0
  73. package/dist/components/logos/BeraLogo.d.ts +8 -0
  74. package/dist/components/logos/BeraLogo.js +5 -0
  75. package/dist/components/logos/BitcoinLogo.d.ts +8 -0
  76. package/dist/components/logos/BitcoinLogo.js +5 -0
  77. package/dist/components/logos/EVMChainsGroup.d.ts +7 -0
  78. package/dist/components/logos/EVMChainsGroup.js +18 -0
  79. package/dist/components/logos/EthereumLogo.d.ts +8 -0
  80. package/dist/components/logos/EthereumLogo.js +5 -0
  81. package/dist/components/logos/HyperliquidLogo.d.ts +8 -0
  82. package/dist/components/logos/HyperliquidLogo.js +5 -0
  83. package/dist/components/logos/MoreChainsGroup.d.ts +7 -0
  84. package/dist/components/logos/MoreChainsGroup.js +18 -0
  85. package/dist/components/logos/OptimismLogo.d.ts +8 -0
  86. package/dist/components/logos/OptimismLogo.js +5 -0
  87. package/dist/components/logos/SolanaLogo.d.ts +8 -0
  88. package/dist/components/logos/SolanaLogo.js +5 -0
  89. package/dist/components/logos/index.d.ts +10 -0
  90. package/dist/components/logos/index.js +10 -0
  91. package/dist/main.css +1 -1
  92. package/package.json +1 -1
@@ -84,17 +84,22 @@ export default function OrderBook(_a) {
84
84
  return [4 /*yield*/, nord.getOrderbook({ symbol: marketSymbol })];
85
85
  case 2:
86
86
  orderbook = _a.sent();
87
- console.log(orderbook, "orderbook");
88
87
  bids = Array.isArray(orderbook.bids[0])
89
88
  ? orderbook.bids
90
- : orderbook.bids.map(function (entry) { return [entry.price, entry.size]; });
89
+ : orderbook.bids.map(function (entry) { return [
90
+ entry.price,
91
+ entry.size,
92
+ ]; });
91
93
  asks = Array.isArray(orderbook.asks[0])
92
94
  ? orderbook.asks
93
- : orderbook.asks.map(function (entry) { return [entry.price, entry.size]; });
95
+ : orderbook.asks.map(function (entry) { return [
96
+ entry.price,
97
+ entry.size,
98
+ ]; });
94
99
  setOrderBookData({
95
100
  bids: bids,
96
101
  asks: asks,
97
- timestamp: Date.now()
102
+ timestamp: Date.now(),
98
103
  });
99
104
  // Subscribe to real-time updates
100
105
  subscription = nord.subscribeOrderbook(marketSymbol);
@@ -103,16 +108,22 @@ export default function OrderBook(_a) {
103
108
  if (!prev)
104
109
  return update;
105
110
  // Convert OrderbookEntry[] to [number, number][] if needed
106
- var updatedBids = update.bids ?
107
- update.bids.map(function (entry) { return [entry.price, entry.size]; }) :
108
- prev.bids;
109
- var updatedAsks = update.asks ?
110
- update.asks.map(function (entry) { return [entry.price, entry.size]; }) :
111
- prev.asks;
111
+ var updatedBids = update.bids
112
+ ? update.bids.map(function (entry) { return [
113
+ entry.price,
114
+ entry.size,
115
+ ]; })
116
+ : prev.bids;
117
+ var updatedAsks = update.asks
118
+ ? update.asks.map(function (entry) { return [
119
+ entry.price,
120
+ entry.size,
121
+ ]; })
122
+ : prev.asks;
112
123
  return {
113
124
  bids: updatedBids,
114
125
  asks: updatedAsks,
115
- timestamp: Date.now()
126
+ timestamp: Date.now(),
116
127
  };
117
128
  });
118
129
  });
@@ -141,20 +152,21 @@ export default function OrderBook(_a) {
141
152
  var aggregateOrderBook = function (data, level) {
142
153
  if (!data)
143
154
  return null;
144
- console.log(data, "zzzz");
145
155
  var aggregatedBids = {};
146
156
  var aggregatedAsks = {};
147
157
  // Aggregate bids
148
158
  data.bids.forEach(function (_a) {
149
159
  var price = _a[0], size = _a[1];
150
160
  var aggregatedPrice = Math.floor(price / level) * level;
151
- aggregatedBids[aggregatedPrice] = (aggregatedBids[aggregatedPrice] || 0) + size;
161
+ aggregatedBids[aggregatedPrice] =
162
+ (aggregatedBids[aggregatedPrice] || 0) + size;
152
163
  });
153
164
  // Aggregate asks
154
165
  data.asks.forEach(function (_a) {
155
166
  var price = _a[0], size = _a[1];
156
167
  var aggregatedPrice = Math.ceil(price / level) * level;
157
- aggregatedAsks[aggregatedPrice] = (aggregatedAsks[aggregatedPrice] || 0) + size;
168
+ aggregatedAsks[aggregatedPrice] =
169
+ (aggregatedAsks[aggregatedPrice] || 0) + size;
158
170
  });
159
171
  // Convert back to arrays and sort
160
172
  var bids = Object.entries(aggregatedBids)
@@ -169,11 +181,10 @@ export default function OrderBook(_a) {
169
181
  return [parseFloat(price), size];
170
182
  })
171
183
  .sort(function (a, b) { return a[0] - b[0]; });
172
- console.log(bids, asks);
173
184
  return {
174
185
  bids: bids,
175
186
  asks: asks,
176
- timestamp: data.timestamp
187
+ timestamp: data.timestamp,
177
188
  };
178
189
  };
179
190
  var aggregatedData = aggregateOrderBook(orderBookData, aggregationLevel);
@@ -6,5 +6,5 @@ interface OrderBookDepthVisualizerProps {
6
6
  } | null;
7
7
  maxSize: number;
8
8
  }
9
- export default function OrderBookDepthVisualizer({ data, maxSize }: OrderBookDepthVisualizerProps): import("react/jsx-runtime").JSX.Element | null;
9
+ export default function OrderBookDepthVisualizer({ data, maxSize, }: OrderBookDepthVisualizerProps): import("react/jsx-runtime").JSX.Element | null;
10
10
  export {};
@@ -3,5 +3,5 @@ interface OrderBookHeaderProps {
3
3
  aggregationLevel: number;
4
4
  onAggregationChange: (level: number) => void;
5
5
  }
6
- export default function OrderBookHeader({ marketSymbol, aggregationLevel, onAggregationChange }: OrderBookHeaderProps): import("react/jsx-runtime").JSX.Element;
6
+ export default function OrderBookHeader({ marketSymbol, aggregationLevel, onAggregationChange, }: OrderBookHeaderProps): import("react/jsx-runtime").JSX.Element;
7
7
  export {};
@@ -10,7 +10,8 @@ export default function OrderBookHeader(_a) {
10
10
  // Close dropdown when clicking outside
11
11
  useEffect(function () {
12
12
  function handleClickOutside(event) {
13
- if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
13
+ if (dropdownRef.current &&
14
+ !dropdownRef.current.contains(event.target)) {
14
15
  setIsOpen(false);
15
16
  }
16
17
  }
@@ -19,7 +20,7 @@ export default function OrderBookHeader(_a) {
19
20
  document.removeEventListener('mousedown', handleClickOutside);
20
21
  };
21
22
  }, []);
22
- return (_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("h2", { className: "text-base font-semibold text-gray-900 dark:text-gray-100", children: ["Order Book ", marketSymbol ? _jsx("span", { className: "text-main", children: marketSymbol }) : ''] }), _jsxs("div", { className: "relative", ref: dropdownRef, children: [_jsxs("button", { onClick: function () { return setIsOpen(!isOpen); }, className: "flex items-center gap-1 px-2 py-1 bg-gray-100 dark:bg-gray-950 rounded-sm text-xs text-gray-900 dark:text-gray-100 border border-gray-200 dark:border-gray-800 hover:border-main dark:hover:border-main transition-colors duration-200", children: [_jsxs("span", { children: ["Precision: ", _jsx("span", { className: "font-mono font-medium", children: aggregationLevel })] }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isOpen ? 'rotate-180 text-main' : 'text-gray-500 dark:text-gray-400') })] }), isOpen && (_jsx("div", { className: "absolute right-0 z-50 mt-1 w-36 bg-white dark:bg-gray-950 rounded-sm shadow-lg border border-gray-200 dark:border-gray-800 overflow-hidden", children: aggregationOptions.map(function (level) { return (_jsx("button", { onClick: function () {
23
+ return (_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("h2", { className: "text-base font-semibold text-gray-900 dark:text-gray-100", children: ["Order Book", ' ', marketSymbol ? _jsx("span", { className: "text-main", children: marketSymbol }) : ''] }), _jsxs("div", { className: "relative", ref: dropdownRef, children: [_jsxs("button", { onClick: function () { return setIsOpen(!isOpen); }, className: "flex items-center gap-1 px-2 py-1 bg-gray-100 dark:bg-gray-950 rounded-sm text-xs text-gray-900 dark:text-gray-100 border border-gray-200 dark:border-gray-800 hover:border-main dark:hover:border-main transition-colors duration-200", children: [_jsxs("span", { children: ["Precision:", ' ', _jsx("span", { className: "font-mono font-medium", children: aggregationLevel })] }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isOpen ? 'rotate-180 text-main' : 'text-gray-500 dark:text-gray-400') })] }), isOpen && (_jsx("div", { className: "absolute right-0 z-50 mt-1 w-36 bg-white dark:bg-gray-950 rounded-sm shadow-lg border border-gray-200 dark:border-gray-800 overflow-hidden", children: aggregationOptions.map(function (level) { return (_jsx("button", { onClick: function () {
23
24
  onAggregationChange(level);
24
25
  setIsOpen(false);
25
26
  }, className: "w-full text-left px-3 py-1.5 text-xs hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-200 ".concat(aggregationLevel === level
@@ -7,5 +7,5 @@ interface OrderBookTableProps {
7
7
  loading: boolean;
8
8
  maxSize: number;
9
9
  }
10
- export default function OrderBookTable({ data, loading, maxSize }: OrderBookTableProps): import("react/jsx-runtime").JSX.Element;
10
+ export default function OrderBookTable({ data, loading, maxSize, }: OrderBookTableProps): import("react/jsx-runtime").JSX.Element;
11
11
  export {};
@@ -5,7 +5,6 @@ export default function OrderBookTable(_a) {
5
5
  if (!data) {
6
6
  return (_jsx("div", { className: "flex items-center justify-center h-40", children: _jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: "No orderbook data available" }) }));
7
7
  }
8
- console.log(data);
9
8
  // Limit the number of rows to display
10
9
  var maxRows = 8;
11
10
  var bids = data.bids.slice(0, maxRows);
@@ -14,9 +13,9 @@ export default function OrderBookTable(_a) {
14
13
  var price = _a[0], size = _a[1];
15
14
  var sizePercentage = (size / maxSize) * 100;
16
15
  return (_jsxs("div", { className: "grid grid-cols-3 gap-1 relative", children: [_jsx("div", { className: "text-left text-xs" }), _jsx("div", { className: "text-center text-xs font-medium text-red-600 dark:text-red-400 font-mono z-10", children: price.toFixed(4) }), _jsx("div", { className: "text-right text-xs font-medium text-gray-900 dark:text-gray-100 font-mono z-10", children: size.toFixed(4) }), _jsx("div", { className: "absolute top-0 right-0 h-full bg-red-100/50 dark:bg-red-900/10 z-0", style: { width: "".concat(sizePercentage, "%") } })] }, "ask-".concat(index)));
17
- }) }), bids.length > 0 && asks.length > 0 && (_jsx("div", { className: "py-1 px-2 mb-2 border border-gray-200 dark:border-gray-800 rounded-sm text-center", children: _jsxs("span", { className: "text-[10px] text-gray-500 dark:text-gray-400", children: ["Spread: ", _jsx("span", { className: "font-mono font-medium", children: (asks[asks.length - 1][0] - bids[0][0]).toFixed(4) }), " (", _jsxs("span", { className: "font-mono", children: [((asks[asks.length - 1][0] / bids[0][0] - 1) * 100).toFixed(2), "%"] }), ")"] }) })), _jsx("div", { className: "space-y-px", children: bids.map(function (_a, index) {
16
+ }) }), bids.length > 0 && asks.length > 0 && (_jsx("div", { className: "py-1 px-2 mb-2 border border-gray-200 dark:border-gray-800 rounded-sm text-center", children: _jsxs("span", { className: "text-[10px] text-gray-500 dark:text-gray-400", children: ["Spread:", ' ', _jsx("span", { className: "font-mono font-medium", children: (asks[asks.length - 1][0] - bids[0][0]).toFixed(4) }), ' ', "(", _jsxs("span", { className: "font-mono", children: [((asks[asks.length - 1][0] / bids[0][0] - 1) * 100).toFixed(2), "%"] }), ")"] }) })), _jsx("div", { className: "space-y-px", children: bids.map(function (_a, index) {
18
17
  var price = _a[0], size = _a[1];
19
18
  var sizePercentage = (size / maxSize) * 100;
20
19
  return (_jsxs("div", { className: "grid grid-cols-3 gap-1 relative", children: [_jsx("div", { className: "text-left text-xs font-medium text-gray-900 dark:text-gray-100 font-mono z-10", children: size.toFixed(4) }), _jsx("div", { className: "text-center text-xs font-medium text-green-600 dark:text-green-400 font-mono z-10", children: price.toFixed(4) }), _jsx("div", { className: "text-right text-xs" }), _jsx("div", { className: "absolute top-0 left-0 h-full bg-green-100/50 dark:bg-green-900/10 z-0", style: { width: "".concat(sizePercentage, "%") } })] }, "bid-".concat(index)));
21
- }) }), _jsxs("div", { className: "mt-2 text-[10px] text-gray-500 dark:text-gray-400 text-right", children: ["Last updated: ", _jsx("span", { className: "font-mono", children: new Date(data.timestamp).toLocaleTimeString() })] })] }));
20
+ }) }), _jsxs("div", { className: "mt-2 text-[10px] text-gray-500 dark:text-gray-400 text-right", children: ["Last updated:", ' ', _jsx("span", { className: "font-mono", children: new Date(data.timestamp).toLocaleTimeString() })] })] }));
22
21
  }
@@ -3,5 +3,5 @@ interface AmountInputProps {
3
3
  onChange: (amount: string) => void;
4
4
  marketInfo?: any;
5
5
  }
6
- export default function AmountInput({ amount, onChange, marketInfo }: AmountInputProps): import("react/jsx-runtime").JSX.Element;
6
+ export default function AmountInput({ amount, onChange, marketInfo, }: AmountInputProps): import("react/jsx-runtime").JSX.Element;
7
7
  export {};
@@ -15,9 +15,9 @@ export default function BuySellTabs(_a) {
15
15
  ? 'left-0 bg-emerald-600 dark:bg-emerald-600 rounded-r-sm'
16
16
  : 'left-1/2 bg-red-700 dark:bg-red-700 rounded-l-sm') }), _jsxs("button", { type: "button", onClick: function () { return handleSideChange('BUY'); }, onMouseEnter: function () { return setHoveredSide('BUY'); }, onMouseLeave: function () { return setHoveredSide(null); }, className: "flex-1 py-2 text-center text-sm font-medium transition-colors duration-200 relative overflow-hidden z-10", children: [_jsx("span", { className: "relative transition-colors duration-300 ".concat(side === 'BUY' ? 'text-white' : 'text-gray-700 dark:text-gray-300'), children: "Buy" }), side === 'BUY' && hoveredSide === 'BUY' && !animating && (_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] animate-shimmer", style: {
17
17
  backgroundSize: '200% 100%',
18
- animationDuration: '1.5s'
18
+ animationDuration: '1.5s',
19
19
  } }))] }), _jsxs("button", { type: "button", onClick: function () { return handleSideChange('SELL'); }, onMouseEnter: function () { return setHoveredSide('SELL'); }, onMouseLeave: function () { return setHoveredSide(null); }, className: "flex-1 py-2 text-center text-sm font-medium transition-colors duration-200 relative overflow-hidden z-10", children: [_jsx("span", { className: "relative transition-colors duration-300 ".concat(side === 'SELL' ? 'text-white' : 'text-gray-700 dark:text-gray-300'), children: "Sell" }), side === 'SELL' && hoveredSide === 'SELL' && !animating && (_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] animate-shimmer", style: {
20
20
  backgroundSize: '200% 100%',
21
- animationDuration: '1.5s'
21
+ animationDuration: '1.5s',
22
22
  } }))] })] }));
23
23
  }
@@ -3,5 +3,5 @@ interface FillModeSelectorProps {
3
3
  fillMode: FillMode;
4
4
  onFillModeChange: (mode: FillMode) => void;
5
5
  }
6
- export default function FillModeSelector({ fillMode, onFillModeChange }: FillModeSelectorProps): import("react/jsx-runtime").JSX.Element;
6
+ export default function FillModeSelector({ fillMode, onFillModeChange, }: FillModeSelectorProps): import("react/jsx-runtime").JSX.Element;
7
7
  export {};
@@ -17,7 +17,8 @@ export default function FillModeSelector(_a) {
17
17
  // Close dropdowns when clicking outside
18
18
  useEffect(function () {
19
19
  function handleClickOutside(event) {
20
- if (fillModeRef.current && !fillModeRef.current.contains(event.target)) {
20
+ if (fillModeRef.current &&
21
+ !fillModeRef.current.contains(event.target)) {
21
22
  setIsFillModeOpen(false);
22
23
  }
23
24
  }
@@ -30,22 +31,22 @@ export default function FillModeSelector(_a) {
30
31
  var fillModes = ['GTC', 'POST_ONLY', 'IOC', 'FOK'];
31
32
  // Fill mode descriptions and display names
32
33
  var fillModeInfo = {
33
- 'GTC': {
34
+ GTC: {
34
35
  displayName: 'Limit',
35
- description: 'Good Till Cancelled'
36
+ description: 'Good Till Cancelled',
36
37
  },
37
- 'POST_ONLY': {
38
+ POST_ONLY: {
38
39
  displayName: 'Post Only',
39
- description: 'Only maker orders'
40
+ description: 'Only maker orders',
40
41
  },
41
- 'IOC': {
42
+ IOC: {
42
43
  displayName: 'Market',
43
- description: 'Immediate or Cancel'
44
+ description: 'Immediate or Cancel',
44
45
  },
45
- 'FOK': {
46
+ FOK: {
46
47
  displayName: 'Fill or Kill',
47
- description: 'Fill completely or cancel'
48
- }
48
+ description: 'Fill completely or cancel',
49
+ },
49
50
  };
50
51
  // Render fill mode dropdown via portal
51
52
  var renderFillModeDropdown = function () {
@@ -58,7 +59,7 @@ export default function FillModeSelector(_a) {
58
59
  width: "".concat(fillModeRect.width, "px"),
59
60
  zIndex: 9999,
60
61
  maxHeight: '200px',
61
- overflowY: 'auto'
62
+ overflowY: 'auto',
62
63
  };
63
64
  return createPortal(_jsx("div", { className: "bg-white dark:bg-dark-950 rounded-sm shadow-lg border border-gray-200 dark:border-gray-700 overflow-hidden animate-dropdown-open", style: dropdownStyle, children: fillModes.map(function (mode) { return (_jsxs("button", { type: "button", onClick: function () {
64
65
  onFillModeChange(mode);
@@ -69,8 +70,10 @@ export default function FillModeSelector(_a) {
69
70
  ? 'bg-emerald-600 dark:bg-emerald-500'
70
71
  : 'bg-transparent') }), _jsxs("div", { className: "flex flex-col ml-1", children: [_jsx("span", { className: "font-medium", children: fillModeInfo[mode].displayName }), _jsx("span", { className: "text-[10px] text-gray-500 dark:text-gray-400", children: fillModeInfo[mode].description })] })] }), fillMode === mode && hoveredFillMode === mode && (_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] animate-shimmer dark:via-gray-300", style: {
71
72
  backgroundSize: '200% 100%',
72
- animationDuration: '1.5s'
73
+ animationDuration: '1.5s',
73
74
  } }))] }, mode)); }) }), document.body);
74
75
  };
75
- return (_jsxs("div", { className: "relative", ref: fillModeRef, children: [_jsx("label", { className: "block text-xs font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Order Type" }), _jsxs("button", { type: "button", onClick: function () { return setIsFillModeOpen(!isFillModeOpen); }, className: "w-full flex items-center justify-between px-3 py-2 border border-gray-200 dark:border-gray-700 rounded-sm text-sm text-gray-900 dark:text-gray-100 hover:border-gray-400 dark:hover:border-gray-500 transition-colors duration-200 bg-white dark:bg-dark-950 focus:outline-none focus:ring-1 focus:ring-gray-400 dark:focus:ring-gray-600", children: [_jsx("span", { children: fillModeInfo[fillMode].displayName }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isFillModeOpen ? 'rotate-180 text-gray-700 dark:text-gray-300' : 'text-gray-500 dark:text-gray-400') })] }), renderFillModeDropdown()] }));
76
+ return (_jsxs("div", { className: "relative", ref: fillModeRef, children: [_jsx("label", { className: "block text-xs font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Order Type" }), _jsxs("button", { type: "button", onClick: function () { return setIsFillModeOpen(!isFillModeOpen); }, className: "w-full flex items-center justify-between px-3 py-2 border border-gray-200 dark:border-gray-700 rounded-sm text-sm text-gray-900 dark:text-gray-100 hover:border-gray-400 dark:hover:border-gray-500 transition-colors duration-200 bg-white dark:bg-dark-950 focus:outline-none focus:ring-1 focus:ring-gray-400 dark:focus:ring-gray-600", children: [_jsx("span", { children: fillModeInfo[fillMode].displayName }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isFillModeOpen
77
+ ? 'rotate-180 text-gray-700 dark:text-gray-300'
78
+ : 'text-gray-500 dark:text-gray-400') })] }), renderFillModeDropdown()] }));
76
79
  }
@@ -5,5 +5,5 @@ interface FillModeSelectorProps {
5
5
  onOrderTypeChange: (type: OrderType) => void;
6
6
  onFillModeChange: (mode: FillMode) => void;
7
7
  }
8
- export default function FillModeSelector({ orderType, fillMode, onOrderTypeChange, onFillModeChange }: FillModeSelectorProps): import("react/jsx-runtime").JSX.Element;
8
+ export default function FillModeSelector({ orderType, fillMode, onOrderTypeChange, onFillModeChange, }: FillModeSelectorProps): import("react/jsx-runtime").JSX.Element;
9
9
  export {};
@@ -26,10 +26,12 @@ export default function FillModeSelector(_a) {
26
26
  // Close dropdowns when clicking outside
27
27
  useEffect(function () {
28
28
  function handleClickOutside(event) {
29
- if (orderTypeRef.current && !orderTypeRef.current.contains(event.target)) {
29
+ if (orderTypeRef.current &&
30
+ !orderTypeRef.current.contains(event.target)) {
30
31
  setIsOrderTypeOpen(false);
31
32
  }
32
- if (fillModeRef.current && !fillModeRef.current.contains(event.target)) {
33
+ if (fillModeRef.current &&
34
+ !fillModeRef.current.contains(event.target)) {
33
35
  setIsFillModeOpen(false);
34
36
  }
35
37
  }
@@ -44,10 +46,10 @@ export default function FillModeSelector(_a) {
44
46
  var fillModes = ['GTC', 'IOC', 'FOK', 'POST_ONLY'];
45
47
  // Fill mode descriptions
46
48
  var fillModeDescriptions = {
47
- 'GTC': 'Good Till Cancelled',
48
- 'IOC': 'Immediate or Cancel',
49
- 'FOK': 'Fill or Kill',
50
- 'POST_ONLY': 'Post Only'
49
+ GTC: 'Good Till Cancelled',
50
+ IOC: 'Immediate or Cancel',
51
+ FOK: 'Fill or Kill',
52
+ POST_ONLY: 'Post Only',
51
53
  };
52
54
  // Render dropdown via portal
53
55
  var renderOrderTypeDropdown = function () {
@@ -60,7 +62,7 @@ export default function FillModeSelector(_a) {
60
62
  width: "".concat(orderTypeRect.width, "px"),
61
63
  zIndex: 9999,
62
64
  maxHeight: '200px',
63
- overflowY: 'auto'
65
+ overflowY: 'auto',
64
66
  };
65
67
  return createPortal(_jsx("div", { className: "bg-white dark:bg-dark-950 rounded-sm shadow-lg border border-gray-200 dark:border-gray-800 overflow-hidden animate-dropdown-open", style: dropdownStyle, children: orderTypes.map(function (type) { return (_jsxs("button", { type: "button", onClick: function () {
66
68
  onOrderTypeChange(type);
@@ -71,7 +73,7 @@ export default function FillModeSelector(_a) {
71
73
  ? 'bg-emerald-600 dark:bg-emerald-500'
72
74
  : 'bg-transparent') }), _jsx("span", { className: "ml-1", children: type })] }), orderType === type && hoveredOrderType === type && (_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] animate-shimmer dark:via-gray-300", style: {
73
75
  backgroundSize: '200% 100%',
74
- animationDuration: '1.5s'
76
+ animationDuration: '1.5s',
75
77
  } }))] }, type)); }) }), document.body);
76
78
  };
77
79
  // Render fill mode dropdown via portal
@@ -85,7 +87,7 @@ export default function FillModeSelector(_a) {
85
87
  width: "".concat(fillModeRect.width, "px"),
86
88
  zIndex: 9999,
87
89
  maxHeight: '200px',
88
- overflowY: 'auto'
90
+ overflowY: 'auto',
89
91
  };
90
92
  return createPortal(_jsx("div", { className: "bg-white dark:bg-dark-950 rounded-sm shadow-lg border border-gray-200 dark:border-gray-800 overflow-hidden animate-dropdown-open", style: dropdownStyle, children: fillModes.map(function (mode) { return (_jsxs("button", { type: "button", onClick: function () {
91
93
  onFillModeChange(mode);
@@ -96,8 +98,12 @@ export default function FillModeSelector(_a) {
96
98
  ? 'bg-emerald-600 dark:bg-emerald-500'
97
99
  : 'bg-transparent') }), _jsxs("div", { className: "flex flex-col ml-1", children: [_jsx("span", { children: mode }), _jsx("span", { className: "text-[10px] text-gray-500 dark:text-gray-400", children: fillModeDescriptions[mode] })] })] }), fillMode === mode && hoveredFillMode === mode && (_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] animate-shimmer dark:via-gray-300", style: {
98
100
  backgroundSize: '200% 100%',
99
- animationDuration: '1.5s'
101
+ animationDuration: '1.5s',
100
102
  } }))] }, mode)); }) }), document.body);
101
103
  };
102
- return (_jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "relative", ref: orderTypeRef, children: [_jsx("label", { className: "block text-xs font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Order Type" }), _jsxs("button", { type: "button", onClick: function () { return setIsOrderTypeOpen(!isOrderTypeOpen); }, className: "w-full flex items-center justify-between px-3 py-2 border border-gray-200 dark:border-gray-800 rounded-sm text-sm text-gray-900 dark:text-gray-100 hover:border-gray-400 dark:hover:border-gray-500 transition-colors duration-200 bg-white dark:bg-dark-950 focus:outline-none focus:ring-1 focus:ring-gray-400 dark:focus:ring-gray-600", children: [_jsx("span", { children: orderType }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isOrderTypeOpen ? 'rotate-180 text-gray-700 dark:text-gray-300' : 'text-gray-500 dark:text-gray-400') })] }), renderOrderTypeDropdown()] }), orderType === 'LIMIT' && (_jsxs("div", { className: "relative", ref: fillModeRef, children: [_jsx("label", { className: "block text-xs font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Fill Mode" }), _jsxs("button", { type: "button", onClick: function () { return setIsFillModeOpen(!isFillModeOpen); }, className: "w-full flex items-center justify-between px-3 py-2 border border-gray-200 dark:border-gray-800 rounded-sm text-sm text-gray-900 dark:text-gray-100 hover:border-gray-400 dark:hover:border-gray-500 transition-colors duration-200 bg-white dark:bg-dark-950 focus:outline-none focus:ring-1 focus:ring-gray-400 dark:focus:ring-gray-600", children: [_jsx("span", { children: fillMode }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isFillModeOpen ? 'rotate-180 text-gray-700 dark:text-gray-300' : 'text-gray-500 dark:text-gray-400') })] }), renderFillModeDropdown()] }))] }));
104
+ return (_jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "relative", ref: orderTypeRef, children: [_jsx("label", { className: "block text-xs font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Order Type" }), _jsxs("button", { type: "button", onClick: function () { return setIsOrderTypeOpen(!isOrderTypeOpen); }, className: "w-full flex items-center justify-between px-3 py-2 border border-gray-200 dark:border-gray-800 rounded-sm text-sm text-gray-900 dark:text-gray-100 hover:border-gray-400 dark:hover:border-gray-500 transition-colors duration-200 bg-white dark:bg-dark-950 focus:outline-none focus:ring-1 focus:ring-gray-400 dark:focus:ring-gray-600", children: [_jsx("span", { children: orderType }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isOrderTypeOpen
105
+ ? 'rotate-180 text-gray-700 dark:text-gray-300'
106
+ : 'text-gray-500 dark:text-gray-400') })] }), renderOrderTypeDropdown()] }), orderType === 'LIMIT' && (_jsxs("div", { className: "relative", ref: fillModeRef, children: [_jsx("label", { className: "block text-xs font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Fill Mode" }), _jsxs("button", { type: "button", onClick: function () { return setIsFillModeOpen(!isFillModeOpen); }, className: "w-full flex items-center justify-between px-3 py-2 border border-gray-200 dark:border-gray-800 rounded-sm text-sm text-gray-900 dark:text-gray-100 hover:border-gray-400 dark:hover:border-gray-500 transition-colors duration-200 bg-white dark:bg-dark-950 focus:outline-none focus:ring-1 focus:ring-gray-400 dark:focus:ring-gray-600", children: [_jsx("span", { children: fillMode }), _jsx(ChevronDown, { size: 14, className: "transition-transform duration-200 ".concat(isFillModeOpen
107
+ ? 'rotate-180 text-gray-700 dark:text-gray-300'
108
+ : 'text-gray-500 dark:text-gray-400') })] }), renderFillModeDropdown()] }))] }));
103
109
  }
@@ -3,5 +3,5 @@ interface PriceInputProps {
3
3
  onChange: (price: string) => void;
4
4
  marketPrice?: number;
5
5
  }
6
- export default function PriceInput({ price, onChange, marketPrice }: PriceInputProps): import("react/jsx-runtime").JSX.Element;
6
+ export default function PriceInput({ price, onChange, marketPrice, }: PriceInputProps): import("react/jsx-runtime").JSX.Element;
7
7
  export {};
@@ -5,5 +5,5 @@ interface SubmitButtonProps {
5
5
  orderType: OrderType;
6
6
  disabled: boolean;
7
7
  }
8
- export default function SubmitButton({ loading, side, orderType, disabled }: SubmitButtonProps): import("react/jsx-runtime").JSX.Element;
8
+ export default function SubmitButton({ loading, side, orderType, disabled, }: SubmitButtonProps): import("react/jsx-runtime").JSX.Element;
9
9
  export {};
@@ -16,7 +16,7 @@ export default function SubmitButton(_a) {
16
16
  };
17
17
  // Generate button color based on side
18
18
  var getButtonClass = function () {
19
- var baseClasses = "w-full py-3 rounded-sm font-medium transition-all duration-200 flex items-center justify-center relative overflow-hidden";
19
+ var baseClasses = 'w-full py-3 rounded-sm font-medium transition-all duration-200 flex items-center justify-center relative overflow-hidden';
20
20
  if (disabled || loading) {
21
21
  return "".concat(baseClasses, " bg-gray-200 dark:bg-gray-800 text-gray-400 dark:text-gray-500 cursor-not-allowed");
22
22
  }
@@ -32,7 +32,7 @@ export default function SubmitButton(_a) {
32
32
  setIsPressed(false);
33
33
  }, onMouseDown: function () { return setIsPressed(true); }, onMouseUp: function () { return setIsPressed(false); }, children: [_jsx("span", { className: "relative z-10 flex items-center justify-center transition-transform duration-200 ".concat(isPressed ? 'scale-95' : ''), children: loading ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { size: 18, className: "animate-spin mr-2 inline-block" }), "Processing..."] })) : (_jsxs(_Fragment, { children: [side === 'BUY' ? (_jsx("svg", { className: "w-4 h-4 mr-2", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M12 5L12 19M12 5L6 11M12 5L18 11", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "transition-transform duration-300 ".concat(isHovered ? 'translate-y-[-2px]' : '') }) })) : (_jsx("svg", { className: "w-4 h-4 mr-2", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M12 19L12 5M12 19L6 13M12 19L18 13", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "transition-transform duration-300 ".concat(isHovered ? 'translate-y-[2px]' : '') }) })), getButtonText()] })) }), !disabled && !loading && (_jsxs(_Fragment, { children: [_jsx("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white to-transparent opacity-25 pointer-events-none translate-x-[-200%] ".concat(isHovered ? 'animate-shimmer' : ''), style: {
34
34
  backgroundSize: '200% 100%',
35
- animationDuration: '1.5s'
35
+ animationDuration: '1.5s',
36
36
  } }), _jsx("span", { className: "absolute inset-0 rounded-sm transition-opacity duration-300 pointer-events-none ".concat(isPressed
37
37
  ? 'bg-black opacity-10 dark:bg-white dark:opacity-10'
38
38
  : 'opacity-0') })] }))] }));
@@ -3,5 +3,5 @@ interface TotalCalculatorProps {
3
3
  total: string;
4
4
  orderType: OrderType;
5
5
  }
6
- export default function TotalCalculator({ total, orderType }: TotalCalculatorProps): import("react/jsx-runtime").JSX.Element;
6
+ export default function TotalCalculator({ total, orderType, }: TotalCalculatorProps): import("react/jsx-runtime").JSX.Element;
7
7
  export {};
@@ -2,6 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  export default function TotalCalculator(_a) {
3
3
  var total = _a.total, orderType = _a.orderType;
4
4
  // Calculate fee (example: 0.1% fee)
5
- var fee = total && orderType === 'LIMIT' ? (parseFloat(total) * 0.001).toFixed(6) : '0.00';
5
+ var fee = total && orderType === 'LIMIT'
6
+ ? (parseFloat(total) * 0.001).toFixed(6)
7
+ : '0.00';
6
8
  return (_jsxs("div", { className: "relative z-20", children: [_jsx("label", { className: "block text-xs font-medium text-gray-700 dark:text-gray-300 mb-1", children: "Total" }), _jsx("div", { className: "px-3 py-2 border border-gray-200 dark:border-gray-800 rounded-sm text-sm text-gray-900 dark:text-gray-100 bg-gray-50 dark:bg-dark-950 font-mono", children: orderType === 'MARKET' ? (_jsx("span", { className: "text-gray-500 dark:text-gray-400", children: "Market Order" })) : total ? (total) : (_jsx("span", { className: "text-gray-400 dark:text-gray-500", children: "0.00" })) }), _jsxs("div", { className: "mt-1 text-[10px] text-gray-500 dark:text-gray-400 flex justify-between", children: [_jsx("span", { children: "Estimated fee:" }), _jsx("span", { className: "font-mono", children: fee })] })] }));
7
9
  }
@@ -44,14 +44,20 @@ import AmountInput from './AmountInput';
44
44
  import TotalCalculator from './TotalCalculator';
45
45
  import SubmitButton from './SubmitButton';
46
46
  import { AlertCircle, Check, Lock, Unlock, Info } from 'lucide-react';
47
+ import { logger } from '../../../../utils/logger';
47
48
  // Map our FillMode to the Nord FillMode enum
48
49
  var mapFillMode = function (mode) {
49
50
  switch (mode) {
50
- case 'GTC': return 0; // LIMIT
51
- case 'POST_ONLY': return 1; // POST_ONLY
52
- case 'IOC': return 2; // IMMEDIATE_OR_CANCEL
53
- case 'FOK': return 3; // FILL_OR_KILL
54
- default: return 0;
51
+ case 'GTC':
52
+ return 0; // LIMIT
53
+ case 'POST_ONLY':
54
+ return 1; // POST_ONLY
55
+ case 'IOC':
56
+ return 2; // IMMEDIATE_OR_CANCEL
57
+ case 'FOK':
58
+ return 3; // FILL_OR_KILL
59
+ default:
60
+ return 0;
55
61
  }
56
62
  };
57
63
  // Map our OrderSide to the Nord Side enum
@@ -186,7 +192,9 @@ export default function TradeForm(_a) {
186
192
  case 1:
187
193
  _b.trys.push([1, 3, 4, 5]);
188
194
  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; });
189
- marketId = market ? (market.id || market.marketId || 0) : 0;
195
+ marketId = market
196
+ ? market.id || market.marketId || 0
197
+ : 0;
190
198
  orderParams = {
191
199
  marketId: marketId,
192
200
  side: mapSide(side),
@@ -199,9 +207,9 @@ export default function TradeForm(_a) {
199
207
  // For market BUY orders, we need quoteSize (total amount to spend)
200
208
  quoteSize: isMarketOrder(fillMode) && side === 'BUY' ? total : undefined,
201
209
  // Use the first account ID if available
202
- accountId: accountId
210
+ accountId: accountId,
203
211
  };
204
- console.log('Placing order with params:', orderParams);
212
+ logger.debug('Placing order with params:', orderParams);
205
213
  return [4 /*yield*/, nordUser.placeOrder(orderParams)];
206
214
  case 2:
207
215
  orderId = _b.sent();
@@ -219,7 +227,7 @@ export default function TradeForm(_a) {
219
227
  return [3 /*break*/, 5];
220
228
  case 3:
221
229
  err_3 = _b.sent();
222
- console.error('Error placing order:', err_3);
230
+ logger.error('Error placing order:', err_3);
223
231
  setError(err_3.message || 'Failed to place order');
224
232
  return [3 /*break*/, 5];
225
233
  case 4:
@@ -229,7 +237,9 @@ export default function TradeForm(_a) {
229
237
  }
230
238
  });
231
239
  }); };
232
- 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
240
+ 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'
241
+ ? 'text-emerald-600 dark:text-emerald-500'
242
+ : '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
233
243
  ? side === 'BUY'
234
244
  ? 'bg-emerald-50 dark:bg-emerald-900/10 text-emerald-700 dark:text-emerald-400 border border-emerald-200 dark:border-emerald-800/30'
235
245
  : 'bg-red-50 dark:bg-red-900/10 text-red-700 dark:text-red-400 border border-red-200 dark:border-red-800/30'
@@ -243,7 +253,7 @@ export default function TradeForm(_a) {
243
253
  : 'bg-red-600 dark:bg-red-500 text-white'
244
254
  : '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
245
255
  ? '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'
246
- : '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
256
+ : '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
247
257
  ? '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'
248
258
  : '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 }) })] }) }))] }));
249
259
  }
@@ -78,7 +78,7 @@ export default function UserBalances() {
78
78
  realBalances.push({
79
79
  symbol: balance.symbol,
80
80
  balance: balance.balance,
81
- accountId: accountId
81
+ accountId: accountId,
82
82
  });
83
83
  }
84
84
  }
@@ -38,6 +38,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
38
38
  import { RefreshCw, X } from 'lucide-react';
39
39
  import { useEffect, useState, useRef } from 'react';
40
40
  import { useN1WalletContext } from '../../../../Provider/hooks';
41
+ import { logger } from '../../../../utils/logger';
41
42
  export default function UserOrders() {
42
43
  var _this = this;
43
44
  var _a = useN1WalletContext(), nord = _a.nord, nordUser = _a.nordUser;
@@ -70,7 +71,7 @@ export default function UserOrders() {
70
71
  allOrders_1 = [];
71
72
  // This is a simplified approach - in a real implementation, you would
72
73
  // properly extract and format orders from the nordUser object
73
- console.log(nord === null || nord === void 0 ? void 0 : nord.markets, nordUser.orders);
74
+ logger.debug(nord === null || nord === void 0 ? void 0 : nord.markets, nordUser.orders);
74
75
  Object.values(nordUser.orders || {}).forEach(function (accountOrders) {
75
76
  if (Array.isArray(accountOrders)) {
76
77
  accountOrders.forEach(function (order) {
@@ -99,7 +100,7 @@ export default function UserOrders() {
99
100
  return [3 /*break*/, 5];
100
101
  case 3:
101
102
  err_1 = _a.sent();
102
- console.error('Error fetching orders:', err_1);
103
+ logger.error('Error fetching orders:', err_1);
103
104
  setError('Failed to load orders');
104
105
  return [3 /*break*/, 5];
105
106
  case 4:
@@ -159,7 +160,7 @@ export default function UserOrders() {
159
160
  return [3 /*break*/, 6];
160
161
  case 4:
161
162
  err_2 = _a.sent();
162
- console.error('Error cancelling order:', err_2);
163
+ logger.error('Error cancelling order:', err_2);
163
164
  setError('Failed to cancel order');
164
165
  return [3 /*break*/, 6];
165
166
  case 5:
@@ -169,9 +170,13 @@ export default function UserOrders() {
169
170
  }
170
171
  });
171
172
  }); };
172
- return (_jsx("div", { className: "bg-white dark:bg-gray-950 shadow-sm border border-gray-200 dark:border-gray-800 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: "Orders" }), _jsxs("div", { className: "overflow-hidden", ref: containerRef, children: [loading && (activeOrders.length === 0 && orderHistory.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 text-red-600 dark:text-red-400 text-sm", children: error })) : activeOrders.length === 0 ? (_jsx("div", { className: "p-3 bg-gray-50 dark:bg-gray-800 text-gray-500 dark:text-gray-400 text-sm text-center", children: "No active orders" })) : !compactView ? (
173
+ return (_jsx("div", { className: "bg-white dark:bg-gray-950 shadow-sm border border-gray-200 dark:border-gray-800 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: "Orders" }), _jsxs("div", { className: "overflow-hidden", ref: containerRef, children: [loading && activeOrders.length === 0 && orderHistory.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 text-red-600 dark:text-red-400 text-sm", children: error })) : activeOrders.length === 0 ? (_jsx("div", { className: "p-3 bg-gray-50 dark:bg-gray-800 text-gray-500 dark:text-gray-400 text-sm text-center", children: "No active orders" })) : !compactView ? (
173
174
  // Standard table view for larger containers
174
- _jsx("div", { className: "overflow-x-auto", 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: "Market" }), _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: "Size" }), _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: "Action" })] }) }), _jsx("tbody", { className: "bg-white dark:bg-gray-950 divide-y divide-gray-200 dark:divide-gray-800", children: activeOrders.map(function (order) { return (_jsxs("tr", { className: "hover:bg-gray-50 dark:hover:bg-gray-800", children: [_jsx("td", { className: "px-3 py-2 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100", children: order.symbol }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-sm", children: _jsx("span", { className: "font-medium ".concat(order.isLong ? 'text-green-600 dark:text-green-400' : 'text-red-600 dark:text-red-400'), children: order.isLong ? 'BUY' : 'SELL' }) }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100 text-right font-mono", children: order.size }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100 text-right font-mono", children: order.price }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-sm text-right", children: _jsx("button", { onClick: function () { return handleCancelOrder(order.orderId); }, disabled: cancellingOrderId === order.orderId, className: "text-red-600 dark:text-red-400 hover:text-red-800 dark:hover:text-red-300 relative ".concat(cancellingOrderId === order.orderId ? 'cursor-not-allowed' : ''), children: cancellingOrderId === order.orderId ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "opacity-0", children: "Cancel" }), _jsx(X, { size: 16, className: "absolute inset-0 m-auto animate-pulse text-red-500" })] })) : ("Cancel") }) })] }, order.orderId)); }) })] }) })) : (
175
+ _jsx("div", { className: "overflow-x-auto", 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: "Market" }), _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: "Size" }), _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: "Action" })] }) }), _jsx("tbody", { className: "bg-white dark:bg-gray-950 divide-y divide-gray-200 dark:divide-gray-800", children: activeOrders.map(function (order) { return (_jsxs("tr", { className: "hover:bg-gray-50 dark:hover:bg-gray-800", children: [_jsx("td", { className: "px-3 py-2 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100", children: order.symbol }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-sm", children: _jsx("span", { className: "font-medium ".concat(order.isLong ? 'text-green-600 dark:text-green-400' : 'text-red-600 dark:text-red-400'), children: order.isLong ? 'BUY' : 'SELL' }) }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100 text-right font-mono", children: order.size }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100 text-right font-mono", children: order.price }), _jsx("td", { className: "px-3 py-2 whitespace-nowrap text-sm text-right", children: _jsx("button", { onClick: function () { return handleCancelOrder(order.orderId); }, disabled: cancellingOrderId === order.orderId, className: "text-red-600 dark:text-red-400 hover:text-red-800 dark:hover:text-red-300 relative ".concat(cancellingOrderId === order.orderId
176
+ ? 'cursor-not-allowed'
177
+ : ''), children: cancellingOrderId === order.orderId ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "opacity-0", children: "Cancel" }), _jsx(X, { size: 16, className: "absolute inset-0 m-auto animate-pulse text-red-500" })] })) : ('Cancel') }) })] }, order.orderId)); }) })] }) })) : (
175
178
  // Compact card view for smaller containers
176
- _jsx("div", { className: "grid gap-2", children: activeOrders.map(function (order) { return (_jsxs("div", { className: "bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 rounded p-2 hover:bg-gray-50 dark:hover:bg-gray-800", children: [_jsxs("div", { className: "flex justify-between items-start mb-1", children: [_jsx("div", { className: "font-medium text-sm text-gray-900 dark:text-gray-100", children: order.symbol }), _jsx("button", { onClick: function () { return handleCancelOrder(order.orderId); }, disabled: cancellingOrderId === order.orderId, className: "text-red-600 dark:text-red-400 hover:text-red-800 dark:hover:text-red-300 text-xs relative ".concat(cancellingOrderId === order.orderId ? 'cursor-not-allowed' : ''), children: cancellingOrderId === order.orderId ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "opacity-0", children: "Cancel" }), _jsx(X, { size: 14, className: "absolute inset-0 m-auto animate-pulse text-red-500" })] })) : ("Cancel") })] }), _jsxs("div", { className: "grid grid-cols-3 gap-1 text-xs", children: [_jsx("div", { children: _jsx("span", { className: "font-medium ".concat(order.isLong ? 'text-green-600 dark:text-green-400' : 'text-red-600 dark:text-red-400'), children: order.isLong ? 'BUY' : 'SELL' }) }), _jsx("div", { className: "text-right font-mono text-gray-700 dark:text-gray-300", children: order.size }), _jsx("div", { className: "text-right font-mono text-gray-700 dark:text-gray-300", children: order.price })] })] }, order.orderId)); }) })), loading && (activeOrders.length > 0 || orderHistory.length > 0) && (_jsx("div", { className: "flex justify-center mt-2", children: _jsx(RefreshCw, { size: 16, className: "text-gray-400 animate-spin" }) }))] })] }) }));
179
+ _jsx("div", { className: "grid gap-2", children: activeOrders.map(function (order) { return (_jsxs("div", { className: "bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 rounded p-2 hover:bg-gray-50 dark:hover:bg-gray-800", children: [_jsxs("div", { className: "flex justify-between items-start mb-1", children: [_jsx("div", { className: "font-medium text-sm text-gray-900 dark:text-gray-100", children: order.symbol }), _jsx("button", { onClick: function () { return handleCancelOrder(order.orderId); }, disabled: cancellingOrderId === order.orderId, className: "text-red-600 dark:text-red-400 hover:text-red-800 dark:hover:text-red-300 text-xs relative ".concat(cancellingOrderId === order.orderId
180
+ ? 'cursor-not-allowed'
181
+ : ''), children: cancellingOrderId === order.orderId ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "opacity-0", children: "Cancel" }), _jsx(X, { size: 14, className: "absolute inset-0 m-auto animate-pulse text-red-500" })] })) : ('Cancel') })] }), _jsxs("div", { className: "grid grid-cols-3 gap-1 text-xs", children: [_jsx("div", { children: _jsx("span", { className: "font-medium ".concat(order.isLong ? 'text-green-600 dark:text-green-400' : 'text-red-600 dark:text-red-400'), children: order.isLong ? 'BUY' : 'SELL' }) }), _jsx("div", { className: "text-right font-mono text-gray-700 dark:text-gray-300", children: order.size }), _jsx("div", { className: "text-right font-mono text-gray-700 dark:text-gray-300", children: order.price })] })] }, order.orderId)); }) })), loading && (activeOrders.length > 0 || orderHistory.length > 0) && (_jsx("div", { className: "flex justify-center mt-2", children: _jsx(RefreshCw, { size: 16, className: "text-gray-400 animate-spin" }) }))] })] }) }));
177
182
  }