npm - @loafmarkets/ui - Versions diffs - 0.1.266 → 0.1.268 - Mend

@loafmarkets/ui 0.1.266 → 0.1.268

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 (5) hide show

package/dist/index.js CHANGED Viewed

@@ -13807,362 +13807,364 @@ function PortfolioActivityPanel({
       /* @__PURE__ */ jsxRuntime.jsx(Tab, { $active: activeTab === "trades", onClick: () => handleTabChange("trades"), children: "Trade History" }),
       /* @__PURE__ */ jsxRuntime.jsx(Tab, { $active: activeTab === "transfers", onClick: () => handleTabChange("transfers"), children: "Transfers" })
     ] }),
-    activeTab === "positions" && showPositionsTab && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      positions.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "No positions yet. Subscribe to an offering or buy on the secondary market." }),
-      positions.length > 0 && compactPositions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(CToolbar, { children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(CSortWrap, { children: [
-            /* @__PURE__ */ jsxRuntime.jsxs(CSortBtn, { onClick: () => setSortDropdownOpen((v) => !v), children: [
-              "Sort by: ",
-              sortKeyLabel(posSortKey),
-              " \u25BE"
+    /* @__PURE__ */ jsxRuntime.jsxs(ContentScroll, { children: [
+      activeTab === "positions" && showPositionsTab && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        positions.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "No positions yet. Subscribe to an offering or buy on the secondary market." }),
+        positions.length > 0 && compactPositions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(CToolbar, { children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(CSortWrap, { children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(CSortBtn, { onClick: () => setSortDropdownOpen((v) => !v), children: [
+                "Sort by: ",
+                sortKeyLabel(posSortKey),
+                " \u25BE"
+              ] }),
+              sortDropdownOpen && /* @__PURE__ */ jsxRuntime.jsx(CSortDropdown, { children: sortKeys.map((k) => /* @__PURE__ */ jsxRuntime.jsx(CSortOption, { $active: posSortKey === k, onClick: () => {
+                setPosSortKey(k);
+                setPosSortAsc(true);
+                setSortDropdownOpen(false);
+              }, children: sortKeyLabel(k) }, k)) })
             ] }),
-            sortDropdownOpen && /* @__PURE__ */ jsxRuntime.jsx(CSortDropdown, { children: sortKeys.map((k) => /* @__PURE__ */ jsxRuntime.jsx(CSortOption, { $active: posSortKey === k, onClick: () => {
-              setPosSortKey(k);
-              setPosSortAsc(true);
-              setSortDropdownOpen(false);
-            }, children: sortKeyLabel(k) }, k)) })
+            /* @__PURE__ */ jsxRuntime.jsxs(CToolbarActions, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(CToolbarLink, { onClick: toggleExpandAll, children: allExpanded ? "Collapse All" : "Expand All" }),
+              onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(CToolbarLink, { onClick: () => setCloseAllOpen(true), children: "Sell All" })
+            ] })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs(CToolbarActions, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(CToolbarLink, { onClick: toggleExpandAll, children: allExpanded ? "Collapse All" : "Expand All" }),
-            onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(CToolbarLink, { onClick: () => setCloseAllOpen(true), children: "Sell All" })
-          ] })
-        ] }),
-        pageSlice(sortedPositions).map((pos) => {
-          const currentValue = pos.quantity * pos.marketPrice;
-          const costBasis = pos.quantity * pos.averageEntryPrice;
-          const pnl = pos.propertyPnl ?? currentValue - costBasis;
-          const pnlPercent = pos.propertyPnlPercent ?? pos.percentChange ?? 0;
-          const isPositive = pnl >= 0;
-          const posExpanded = expandedPositions.has(pos.tokenName) || allExpanded;
-          const ticker = pos.tokenName.toUpperCase().slice(0, 7);
-          return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-            /* @__PURE__ */ jsxRuntime.jsxs(CRow, { $expanded: posExpanded, onClick: () => togglePosition(pos.tokenName), children: [
-              /* @__PURE__ */ jsxRuntime.jsxs(CAssetCell, { onClick: (e) => {
-                e.stopPropagation();
-                onPositionClick?.(pos.tokenName, pos.isIpoAllocation);
-              }, children: [
-                /* @__PURE__ */ jsxRuntime.jsx(CCellLabel, { children: "Asset" }),
-                /* @__PURE__ */ jsxRuntime.jsxs(CAssetName, { children: [
-                  pos.imageUrl && /* @__PURE__ */ jsxRuntime.jsx(CAssetLogo, { src: pos.imageUrl, alt: "" }),
-                  pos.tokenName
-                ] })
+          pageSlice(sortedPositions).map((pos) => {
+            const currentValue = pos.quantity * pos.marketPrice;
+            const costBasis = pos.quantity * pos.averageEntryPrice;
+            const pnl = pos.propertyPnl ?? currentValue - costBasis;
+            const pnlPercent = pos.propertyPnlPercent ?? pos.percentChange ?? 0;
+            const isPositive = pnl >= 0;
+            const posExpanded = expandedPositions.has(pos.tokenName) || allExpanded;
+            const ticker = pos.tokenName.toUpperCase().slice(0, 7);
+            return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(CRow, { $expanded: posExpanded, onClick: () => togglePosition(pos.tokenName), children: [
+                /* @__PURE__ */ jsxRuntime.jsxs(CAssetCell, { onClick: (e) => {
+                  e.stopPropagation();
+                  onPositionClick?.(pos.tokenName, pos.isIpoAllocation);
+                }, children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(CCellLabel, { children: "Asset" }),
+                  /* @__PURE__ */ jsxRuntime.jsxs(CAssetName, { children: [
+                    pos.imageUrl && /* @__PURE__ */ jsxRuntime.jsx(CAssetLogo, { src: pos.imageUrl, alt: "" }),
+                    pos.tokenName
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs(CUnitsCell, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(CCellLabel, { children: "Units" }),
+                  formatNumber2(pos.quantity, pos.quantity >= 100 ? 0 : 2),
+                  " ",
+                  ticker
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs(CPnlCell, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(CCellLabel, { children: "PNL (%)" }),
+                  /* @__PURE__ */ jsxRuntime.jsxs(CPnlValue, { $positive: isPositive, children: [
+                    isPositive ? "+" : "-",
+                    formatCurrency4(Math.abs(pnl))
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs(CPnlPct, { $positive: isPositive, children: [
+                    "(",
+                    isPositive ? "+" : "",
+                    pnlPercent.toFixed(1),
+                    "%)"
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx(CChevronWrap, { $open: posExpanded, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "rgba(255,255,255,0.5)", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "6 9 12 15 18 9" }) }) })
               ] }),
-              /* @__PURE__ */ jsxRuntime.jsxs(CUnitsCell, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(CCellLabel, { children: "Units" }),
-                formatNumber2(pos.quantity, pos.quantity >= 100 ? 0 : 2),
+              posExpanded && /* @__PURE__ */ jsxRuntime.jsxs(CExpandedWrap, { children: [
+                /* @__PURE__ */ jsxRuntime.jsxs(CDetailGrid, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs(CDetailItem, { children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(CDLabel, { children: "Position Value" }),
+                    /* @__PURE__ */ jsxRuntime.jsx(CDValue, { children: formatCurrency4(currentValue, { minimumFractionDigits: 0, maximumFractionDigits: 0 }) })
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs(CDetailItem, { children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(CDLabel, { children: "Avg Price" }),
+                    /* @__PURE__ */ jsxRuntime.jsx(CDValue, { children: formatCurrency4(pos.averageEntryPrice) })
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs(CDetailItem, { children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(CDLabel, { children: "Current Price" }),
+                    /* @__PURE__ */ jsxRuntime.jsx(CDValue, { children: formatCurrency4(pos.marketPrice) })
+                  ] })
+                ] }),
+                onClosePosition && /* @__PURE__ */ jsxRuntime.jsxs(CActionRow, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice), children: "Market Sell" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice), children: "Limit Sell" })
+                ] })
+              ] })
+            ] }, pos.tokenName);
+          })
+        ] }),
+        positions.length > 0 && !compactPositions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(PositionsHeader, { $hasClose: !!onClosePosition, children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "asset", onClick: () => handlePosSort("asset"), children: [
+              "Asset ",
+              posSortKey === "asset" && (posSortAsc ? "\u2191" : "\u2193")
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "units", onClick: () => handlePosSort("units"), children: [
+              "Units ",
+              posSortKey === "units" && (posSortAsc ? "\u2191" : "\u2193")
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "value", onClick: () => handlePosSort("value"), children: [
+              "Position Value ",
+              posSortKey === "value" && (posSortAsc ? "\u2191" : "\u2193")
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "avgPrice", onClick: () => handlePosSort("avgPrice"), children: [
+              "Avg Price ",
+              posSortKey === "avgPrice" && (posSortAsc ? "\u2191" : "\u2193")
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "currentPrice", onClick: () => handlePosSort("currentPrice"), children: [
+              "Current Price ",
+              posSortKey === "currentPrice" && (posSortAsc ? "\u2191" : "\u2193")
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "pnl", onClick: () => handlePosSort("pnl"), children: [
+              "PNL (%) ",
+              posSortKey === "pnl" && (posSortAsc ? "\u2191" : "\u2193")
+            ] }),
+            onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CloseAllHeaderBtn, { onClick: () => setCloseAllOpen(true), children: "Sell All" }) })
+          ] }),
+          pageSlice(sortedPositions).map((pos) => {
+            const currentValue = pos.quantity * pos.marketPrice;
+            const costBasis = pos.quantity * pos.averageEntryPrice;
+            const pnl = pos.propertyPnl ?? currentValue - costBasis;
+            const pnlPercent = pos.propertyPnlPercent ?? pos.percentChange ?? 0;
+            const isPositive = pnl >= 0;
+            return /* @__PURE__ */ jsxRuntime.jsxs(PositionsRow, { $hasClose: !!onClosePosition, children: [
+              /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx(HoldingsPropertyLink, { onClick: () => onPositionClick?.(pos.tokenName, pos.isIpoAllocation), children: pos.tokenName }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: [
+                formatNumber2(pos.quantity),
                 " ",
-                ticker
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsxs(CPnlCell, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(CCellLabel, { children: "PNL (%)" }),
-                /* @__PURE__ */ jsxRuntime.jsxs(CPnlValue, { $positive: isPositive, children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "rgba(255,255,255,0.4)", fontSize: "0.7rem" }, children: pos.tokenName.toUpperCase() })
+              ] }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: [
+                formatCurrency4(currentValue, { minimumFractionDigits: 0, maximumFractionDigits: 0 }),
+                " ",
+                /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "rgba(255,255,255,0.4)", fontSize: "0.7rem" }, children: "USD" })
+              ] }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "rgba(255,255,255,0.7)", fontSize: "0.8rem" }, children: formatCurrency4(pos.averageEntryPrice) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: formatCurrency4(pos.marketPrice) }) }),
+              /* @__PURE__ */ jsxRuntime.jsxs(PositionsCell, { children: [
+                /* @__PURE__ */ jsxRuntime.jsxs(PnLAmount, { $positive: isPositive, children: [
                   isPositive ? "+" : "-",
                   formatCurrency4(Math.abs(pnl))
                 ] }),
-                /* @__PURE__ */ jsxRuntime.jsxs(CPnlPct, { $positive: isPositive, children: [
-                  "(",
+                /* @__PURE__ */ jsxRuntime.jsxs(PnLPercentage, { $positive: isPositive, children: [
                   isPositive ? "+" : "",
                   pnlPercent.toFixed(1),
-                  "%)"
-                ] })
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsx(CChevronWrap, { $open: posExpanded, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "rgba(255,255,255,0.5)", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "6 9 12 15 18 9" }) }) })
-            ] }),
-            posExpanded && /* @__PURE__ */ jsxRuntime.jsxs(CExpandedWrap, { children: [
-              /* @__PURE__ */ jsxRuntime.jsxs(CDetailGrid, { children: [
-                /* @__PURE__ */ jsxRuntime.jsxs(CDetailItem, { children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(CDLabel, { children: "Position Value" }),
-                  /* @__PURE__ */ jsxRuntime.jsx(CDValue, { children: formatCurrency4(currentValue, { minimumFractionDigits: 0, maximumFractionDigits: 0 }) })
-                ] }),
-                /* @__PURE__ */ jsxRuntime.jsxs(CDetailItem, { children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(CDLabel, { children: "Avg Price" }),
-                  /* @__PURE__ */ jsxRuntime.jsx(CDValue, { children: formatCurrency4(pos.averageEntryPrice) })
-                ] }),
-                /* @__PURE__ */ jsxRuntime.jsxs(CDetailItem, { children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(CDLabel, { children: "Current Price" }),
-                  /* @__PURE__ */ jsxRuntime.jsx(CDValue, { children: formatCurrency4(pos.marketPrice) })
+                  "%"
                 ] })
               ] }),
-              onClosePosition && /* @__PURE__ */ jsxRuntime.jsxs(CActionRow, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice), children: "Market Sell" }),
-                /* @__PURE__ */ jsxRuntime.jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice), children: "Limit Sell" })
-              ] })
-            ] })
-          ] }, pos.tokenName);
-        })
-      ] }),
-      positions.length > 0 && !compactPositions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(PositionsHeader, { $hasClose: !!onClosePosition, children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "asset", onClick: () => handlePosSort("asset"), children: [
-            "Asset ",
-            posSortKey === "asset" && (posSortAsc ? "\u2191" : "\u2193")
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "units", onClick: () => handlePosSort("units"), children: [
-            "Units ",
-            posSortKey === "units" && (posSortAsc ? "\u2191" : "\u2193")
+              onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CloseActions, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(CloseBtn2, { onClick: (e) => {
+                  e.stopPropagation();
+                  onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice);
+                }, children: "Market Sell" }),
+                /* @__PURE__ */ jsxRuntime.jsx(CloseBtn2, { onClick: (e) => {
+                  e.stopPropagation();
+                  onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice);
+                }, children: "Limit Sell" })
+              ] }) })
+            ] }, pos.tokenName);
+          })
+        ] }),
+        positions.length > 0 && closeAllOpen && onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(CloseAllOverlay, { onClick: () => setCloseAllOpen(false), children: /* @__PURE__ */ jsxRuntime.jsxs(CloseAllModal, { onClick: (e) => e.stopPropagation(), children: [
+          /* @__PURE__ */ jsxRuntime.jsx(CloseAllModalX, { onClick: () => setCloseAllOpen(false), children: "\xD7" }),
+          /* @__PURE__ */ jsxRuntime.jsx(CloseAllTitle, { children: "Confirm Sell All" }),
+          /* @__PURE__ */ jsxRuntime.jsx(CloseAllDesc, { children: "This will sell all your positions and cancel their associated TP/SL orders." }),
+          /* @__PURE__ */ jsxRuntime.jsxs(CloseAllOption, { onClick: () => setCloseAllType("market"), children: [
+            /* @__PURE__ */ jsxRuntime.jsx(CloseAllRadio, { $selected: closeAllType === "market" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Market Sell" })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "value", onClick: () => handlePosSort("value"), children: [
-            "Position Value ",
-            posSortKey === "value" && (posSortAsc ? "\u2191" : "\u2193")
+          /* @__PURE__ */ jsxRuntime.jsxs(CloseAllOption, { onClick: () => setCloseAllType("limit"), children: [
+            /* @__PURE__ */ jsxRuntime.jsx(CloseAllRadio, { $selected: closeAllType === "limit" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Limit Sell at Mid Price" })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "avgPrice", onClick: () => handlePosSort("avgPrice"), children: [
-            "Avg Price ",
-            posSortKey === "avgPrice" && (posSortAsc ? "\u2191" : "\u2193")
+          /* @__PURE__ */ jsxRuntime.jsxs(CloseAllConfirmBtn, { onClick: () => {
+            positions.forEach((pos) => onClosePosition(pos.tokenName, closeAllType, pos.quantity, pos.marketPrice));
+            setCloseAllOpen(false);
+          }, children: [
+            "Confirm ",
+            closeAllType === "market" ? "Market" : "Limit",
+            " Sell"
+          ] })
+        ] }) })
+      ] }),
+      activeTab === "subscriptions" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        offeringOrders.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "IPO allocations will appear here once you subscribe." }),
+        offeringOrders.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "1.2fr 0.8fr 1fr 1fr 0.8fr 1fr", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Asset" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Qty" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Price" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Total" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "currentPrice", onClick: () => handlePosSort("currentPrice"), children: [
-            "Current Price ",
-            posSortKey === "currentPrice" && (posSortAsc ? "\u2191" : "\u2193")
+          pageSlice(offeringOrders).map((order) => {
+            const meta = getOrderStatusMeta(order.status);
+            return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.8fr 1fr 1fr 0.8fr 1fr", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: order.tokenName }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatNumber2(order.quantity) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatCurrency4(order.price) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatCurrency4(order.price * order.quantity) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(ActivityTag, { $color: meta.color, $bg: meta.bg, children: prettyLabel(order.status) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatTimestamp(order.createdAt) }) })
+            ] }, `${order.tokenName}-${order.txHash}-${order.createdAt}`);
+          })
+        ] })
+      ] }),
+      activeTab === "open-orders" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        openOrders.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "Open orders will appear here while they are working in the market." }),
+        openOrders.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          onCancelAllOrders && openOrdersCount > 1 && /* @__PURE__ */ jsxRuntime.jsx(CancelAllRow, { children: /* @__PURE__ */ jsxRuntime.jsx(CancelAllBtn, { type: "button", disabled: cancellingAll, onClick: () => setCancelAllConfirmOpen(true), children: "Cancel All" }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: onCancelOrder ? "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 70px" : "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Asset" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Side" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Type" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Qty" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Price" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Filled" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
+            onCancelOrder && /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, {})
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "pnl", onClick: () => handlePosSort("pnl"), children: [
-            "PNL (%) ",
-            posSortKey === "pnl" && (posSortAsc ? "\u2191" : "\u2193")
+          pageSlice(openOrders).map((order) => {
+            const meta = getOrderStatusMeta(order.status);
+            const isMarket = order.type === "MARKET";
+            const filledPercent = order.quantity > 0 ? Math.round(order.filledQuantity / order.quantity * 100) : 0;
+            const isCancelling = cancellingOrderId === order.id;
+            return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: onCancelOrder ? "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 70px" : "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: order.tokenName }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: sideLabel(order.side), children: sideLabel(order.side) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: prettyLabel(order.type) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: onAmendOrder ? /* @__PURE__ */ jsxRuntime.jsx(EditableField, { value: order.quantity, format: formatNumber2, onCommit: (v) => onAmendOrder(order.id, { quantity: v }) }) : /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatNumber2(order.quantity) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: !isMarket && order.price && onAmendOrder ? /* @__PURE__ */ jsxRuntime.jsx(EditableField, { value: order.price, format: (v) => formatCurrency4(v), onCommit: (v) => onAmendOrder(order.id, { price: v }) }) : /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: isMarket || !order.price ? "Market" : formatCurrency4(order.price) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CellText, { $muted: true, children: [
+                filledPercent,
+                "%"
+              ] }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(ActivityTag, { $color: meta.color, $bg: meta.bg, children: prettyLabel(order.status) }) }),
+              onCancelOrder && /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(
+                CancelButton,
+                {
+                  type: "button",
+                  disabled: isCancelling || cancellingOrderId != null,
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    setPendingCancelOrderId(order.id);
+                  },
+                  children: isCancelling ? "\u2026" : "Cancel"
+                }
+              ) })
+            ] }, `open-${order.id}`);
+          })
+        ] })
+      ] }),
+      activeTab === "orders" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        orderHistory.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "No orders yet. Place a trade to see it appear here." }),
+        orderHistory.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 1fr", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Asset" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Side" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Type" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Qty" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Price" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Filled" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
           ] }),
-          onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CloseAllHeaderBtn, { onClick: () => setCloseAllOpen(true), children: "Sell All" }) })
-        ] }),
-        pageSlice(sortedPositions).map((pos) => {
-          const currentValue = pos.quantity * pos.marketPrice;
-          const costBasis = pos.quantity * pos.averageEntryPrice;
-          const pnl = pos.propertyPnl ?? currentValue - costBasis;
-          const pnlPercent = pos.propertyPnlPercent ?? pos.percentChange ?? 0;
-          const isPositive = pnl >= 0;
-          return /* @__PURE__ */ jsxRuntime.jsxs(PositionsRow, { $hasClose: !!onClosePosition, children: [
-            /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx(HoldingsPropertyLink, { onClick: () => onPositionClick?.(pos.tokenName, pos.isIpoAllocation), children: pos.tokenName }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: [
-              formatNumber2(pos.quantity),
-              " ",
-              /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "rgba(255,255,255,0.4)", fontSize: "0.7rem" }, children: pos.tokenName.toUpperCase() })
-            ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: [
-              formatCurrency4(currentValue, { minimumFractionDigits: 0, maximumFractionDigits: 0 }),
-              " ",
-              /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "rgba(255,255,255,0.4)", fontSize: "0.7rem" }, children: "USD" })
-            ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "rgba(255,255,255,0.7)", fontSize: "0.8rem" }, children: formatCurrency4(pos.averageEntryPrice) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: formatCurrency4(pos.marketPrice) }) }),
-            /* @__PURE__ */ jsxRuntime.jsxs(PositionsCell, { children: [
-              /* @__PURE__ */ jsxRuntime.jsxs(PnLAmount, { $positive: isPositive, children: [
-                isPositive ? "+" : "-",
-                formatCurrency4(Math.abs(pnl))
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsxs(PnLPercentage, { $positive: isPositive, children: [
-                isPositive ? "+" : "",
-                pnlPercent.toFixed(1),
+          pageSlice(orderHistory).map((order) => {
+            const meta = getOrderStatusMeta(order.status);
+            const isMarket = order.type === "MARKET";
+            const filledPercent = order.quantity > 0 ? Math.round(order.filledQuantity / order.quantity * 100) : 0;
+            return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 1fr", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: order.tokenName }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: sideLabel(order.side), children: sideLabel(order.side) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: prettyLabel(order.type) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatNumber2(order.quantity) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: isMarket || !order.price ? "Market" : formatCurrency4(order.price) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CellText, { $muted: true, children: [
+                filledPercent,
                 "%"
-              ] })
-            ] }),
-            onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CloseActions, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx(CloseBtn2, { onClick: (e) => {
-                e.stopPropagation();
-                onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice);
-              }, children: "Market Sell" }),
-              /* @__PURE__ */ jsxRuntime.jsx(CloseBtn2, { onClick: (e) => {
-                e.stopPropagation();
-                onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice);
-              }, children: "Limit Sell" })
-            ] }) })
-          ] }, pos.tokenName);
-        })
+              ] }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(ActivityTag, { $color: meta.color, $bg: meta.bg, children: prettyLabel(order.status) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatTimestamp(order.createdAt) }) })
+            ] }, order.id);
+          })
+        ] })
       ] }),
-      positions.length > 0 && closeAllOpen && onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(CloseAllOverlay, { onClick: () => setCloseAllOpen(false), children: /* @__PURE__ */ jsxRuntime.jsxs(CloseAllModal, { onClick: (e) => e.stopPropagation(), children: [
-        /* @__PURE__ */ jsxRuntime.jsx(CloseAllModalX, { onClick: () => setCloseAllOpen(false), children: "\xD7" }),
-        /* @__PURE__ */ jsxRuntime.jsx(CloseAllTitle, { children: "Confirm Sell All" }),
-        /* @__PURE__ */ jsxRuntime.jsx(CloseAllDesc, { children: "This will sell all your positions and cancel their associated TP/SL orders." }),
-        /* @__PURE__ */ jsxRuntime.jsxs(CloseAllOption, { onClick: () => setCloseAllType("market"), children: [
-          /* @__PURE__ */ jsxRuntime.jsx(CloseAllRadio, { $selected: closeAllType === "market" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Market Sell" })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(CloseAllOption, { onClick: () => setCloseAllType("limit"), children: [
-          /* @__PURE__ */ jsxRuntime.jsx(CloseAllRadio, { $selected: closeAllType === "limit" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Limit Sell at Mid Price" })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(CloseAllConfirmBtn, { onClick: () => {
-          positions.forEach((pos) => onClosePosition(pos.tokenName, closeAllType, pos.quantity, pos.marketPrice));
-          setCloseAllOpen(false);
-        }, children: [
-          "Confirm ",
-          closeAllType === "market" ? "Market" : "Limit",
-          " Sell"
+      activeTab === "trades" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        tradeHistory.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "Completed trades will appear here." }),
+        tradeHistory.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "1.2fr 0.6fr 0.8fr 1fr 1fr 0.8fr 1fr", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Asset" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Side" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Qty" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Price" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Total" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Fee" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
+          ] }),
+          pageSlice(tradeHistory).map((trade) => /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.6fr 0.8fr 1fr 1fr 0.8fr 1fr", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: trade.tokenName }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: sideLabel(trade.side), children: sideLabel(trade.side) }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatNumber2(trade.quantity) }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatCurrency4(trade.price) }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatCurrency4(trade.price * trade.quantity) }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatCurrency4(trade.fee) }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatTimestamp(trade.executedAt) }) })
+          ] }, trade.tradeId))
         ] })
-      ] }) })
-    ] }),
-    activeTab === "subscriptions" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      offeringOrders.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "IPO allocations will appear here once you subscribe." }),
-      offeringOrders.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "1.2fr 0.8fr 1fr 1fr 0.8fr 1fr", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Asset" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Qty" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Price" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Total" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
-        ] }),
-        pageSlice(offeringOrders).map((order) => {
-          const meta = getOrderStatusMeta(order.status);
-          return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.8fr 1fr 1fr 0.8fr 1fr", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: order.tokenName }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatNumber2(order.quantity) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatCurrency4(order.price) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatCurrency4(order.price * order.quantity) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(ActivityTag, { $color: meta.color, $bg: meta.bg, children: prettyLabel(order.status) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatTimestamp(order.createdAt) }) })
-          ] }, `${order.tokenName}-${order.txHash}-${order.createdAt}`);
-        })
-      ] })
-    ] }),
-    activeTab === "open-orders" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      openOrders.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "Open orders will appear here while they are working in the market." }),
-      openOrders.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        onCancelAllOrders && openOrdersCount > 1 && /* @__PURE__ */ jsxRuntime.jsx(CancelAllRow, { children: /* @__PURE__ */ jsxRuntime.jsx(CancelAllBtn, { type: "button", disabled: cancellingAll, onClick: () => setCancelAllConfirmOpen(true), children: "Cancel All" }) }),
-        /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: onCancelOrder ? "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 70px" : "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Asset" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Side" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Type" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Qty" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Price" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Filled" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
-          onCancelOrder && /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, {})
-        ] }),
-        pageSlice(openOrders).map((order) => {
-          const meta = getOrderStatusMeta(order.status);
-          const isMarket = order.type === "MARKET";
-          const filledPercent = order.quantity > 0 ? Math.round(order.filledQuantity / order.quantity * 100) : 0;
-          const isCancelling = cancellingOrderId === order.id;
-          return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: onCancelOrder ? "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 70px" : "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: order.tokenName }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: sideLabel(order.side), children: sideLabel(order.side) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: prettyLabel(order.type) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: onAmendOrder ? /* @__PURE__ */ jsxRuntime.jsx(EditableField, { value: order.quantity, format: formatNumber2, onCommit: (v) => onAmendOrder(order.id, { quantity: v }) }) : /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatNumber2(order.quantity) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: !isMarket && order.price && onAmendOrder ? /* @__PURE__ */ jsxRuntime.jsx(EditableField, { value: order.price, format: (v) => formatCurrency4(v), onCommit: (v) => onAmendOrder(order.id, { price: v }) }) : /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: isMarket || !order.price ? "Market" : formatCurrency4(order.price) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CellText, { $muted: true, children: [
-              filledPercent,
-              "%"
-            ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(ActivityTag, { $color: meta.color, $bg: meta.bg, children: prettyLabel(order.status) }) }),
-            onCancelOrder && /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(
-              CancelButton,
-              {
-                type: "button",
-                disabled: isCancelling || cancellingOrderId != null,
-                onClick: (e) => {
-                  e.stopPropagation();
-                  setPendingCancelOrderId(order.id);
-                },
-                children: isCancelling ? "\u2026" : "Cancel"
-              }
-            ) })
-          ] }, `open-${order.id}`);
-        })
-      ] })
-    ] }),
-    activeTab === "orders" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      orderHistory.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "No orders yet. Place a trade to see it appear here." }),
-      orderHistory.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 1fr", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Asset" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Side" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Type" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Qty" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Price" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Filled" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
-        ] }),
-        pageSlice(orderHistory).map((order) => {
-          const meta = getOrderStatusMeta(order.status);
-          const isMarket = order.type === "MARKET";
-          const filledPercent = order.quantity > 0 ? Math.round(order.filledQuantity / order.quantity * 100) : 0;
-          return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 1fr", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: order.tokenName }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: sideLabel(order.side), children: sideLabel(order.side) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: prettyLabel(order.type) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatNumber2(order.quantity) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: isMarket || !order.price ? "Market" : formatCurrency4(order.price) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CellText, { $muted: true, children: [
-              filledPercent,
-              "%"
-            ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(ActivityTag, { $color: meta.color, $bg: meta.bg, children: prettyLabel(order.status) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatTimestamp(order.createdAt) }) })
-          ] }, order.id);
-        })
-      ] })
-    ] }),
-    activeTab === "trades" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      tradeHistory.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "Completed trades will appear here." }),
-      tradeHistory.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "1.2fr 0.6fr 0.8fr 1fr 1fr 0.8fr 1fr", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Asset" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Side" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Qty" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Price" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Total" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Fee" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
-        ] }),
-        pageSlice(tradeHistory).map((trade) => /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.6fr 0.8fr 1fr 1fr 0.8fr 1fr", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: trade.tokenName }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: sideLabel(trade.side), children: sideLabel(trade.side) }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatNumber2(trade.quantity) }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatCurrency4(trade.price) }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatCurrency4(trade.price * trade.quantity) }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatCurrency4(trade.fee) }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatTimestamp(trade.executedAt) }) })
-        ] }, trade.tradeId))
-      ] })
-    ] }),
-    activeTab === "transfers" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      transfers.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "Deposits and withdrawals will appear here." }),
-      transfers.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "0.8fr 1fr 1.5fr 0.8fr 1fr", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Type" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Amount" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Address" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
-          /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
+      ] }),
+      activeTab === "transfers" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        transfers.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { children: "Deposits and withdrawals will appear here." }),
+        transfers.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "0.8fr 1fr 1.5fr 0.8fr 1fr", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Type" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Amount" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Address" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
+            /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
+          ] }),
+          pageSlice(transfers).map((t, idx) => {
+            const isDeposit = t.type === "DEPOSIT";
+            const statusMeta = getOrderStatusMeta(t.status);
+            return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "0.8fr 1fr 1.5fr 0.8fr 1fr", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: isDeposit ? "Buy" : "Sell", children: isDeposit ? "Deposit" : "Withdraw" }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CellText, { $color: isDeposit ? "#0ecb81" : "#f6465d", children: [
+                isDeposit ? "+" : "-",
+                formatCurrency4(t.amount)
+              ] }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatAddress(t.address) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(ActivityTag, { $color: statusMeta.color, $bg: statusMeta.bg, children: prettyLabel(t.status) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatTimestamp(t.createdAt) }) })
+            ] }, t.blockchainTxHash ?? `transfer-${idx}`);
+          })
+        ] })
+      ] }),
+      activityTotalPages > 1 && /* @__PURE__ */ jsxRuntime.jsxs(PaginationRow, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          PaginationButton,
+          {
+            type: "button",
+            onClick: () => setActivityPage((p) => p - 1),
+            disabled: activityPage === 0,
+            children: "\u2190 Prev"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs(PaginationLabel, { children: [
+          activityPage + 1,
+          " / ",
+          activityTotalPages
         ] }),
-        pageSlice(transfers).map((t, idx) => {
-          const isDeposit = t.type === "DEPOSIT";
-          const statusMeta = getOrderStatusMeta(t.status);
-          return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "0.8fr 1fr 1.5fr 0.8fr 1fr", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: isDeposit ? "Buy" : "Sell", children: isDeposit ? "Deposit" : "Withdraw" }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CellText, { $color: isDeposit ? "#0ecb81" : "#f6465d", children: [
-              isDeposit ? "+" : "-",
-              formatCurrency4(t.amount)
-            ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatAddress(t.address) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(ActivityTag, { $color: statusMeta.color, $bg: statusMeta.bg, children: prettyLabel(t.status) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: formatTimestamp(t.createdAt) }) })
-          ] }, t.blockchainTxHash ?? `transfer-${idx}`);
-        })
+        /* @__PURE__ */ jsxRuntime.jsx(
+          PaginationButton,
+          {
+            type: "button",
+            onClick: () => setActivityPage((p) => p + 1),
+            disabled: activityPage >= activityTotalPages - 1,
+            children: "Next \u2192"
+          }
+        )
       ] })
     ] }),
-    activityTotalPages > 1 && /* @__PURE__ */ jsxRuntime.jsxs(PaginationRow, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        PaginationButton,
-        {
-          type: "button",
-          onClick: () => setActivityPage((p) => p - 1),
-          disabled: activityPage === 0,
-          children: "\u2190 Prev"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsxs(PaginationLabel, { children: [
-        activityPage + 1,
-        " / ",
-        activityTotalPages
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        PaginationButton,
-        {
-          type: "button",
-          onClick: () => setActivityPage((p) => p + 1),
-          disabled: activityPage >= activityTotalPages - 1,
-          children: "Next \u2192"
-        }
-      )
-    ] }),
     cancelAllConfirmOpen && /* @__PURE__ */ jsxRuntime.jsx(CancelConfirmOverlay, { onClick: () => setCancelAllConfirmOpen(false), children: /* @__PURE__ */ jsxRuntime.jsxs(CancelConfirmModal, { onClick: (e) => e.stopPropagation(), children: [
       /* @__PURE__ */ jsxRuntime.jsx(CancelConfirmTitle, { children: "Cancel All Orders" }),
       /* @__PURE__ */ jsxRuntime.jsxs(CancelConfirmBody, { children: [
@@ -14217,6 +14219,14 @@ function PortfolioActivityPanel({
   ] });
 }
 var Container3 = styled9__default.default.div`
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+`;
+var ContentScroll = styled9__default.default.div`
+  flex: 1;
+  overflow-y: auto;
+  min-height: 0;
   scrollbar-width: thin;
   scrollbar-color: rgba(255, 255, 255, 0.1) transparent;
   &::-webkit-scrollbar { width: 4px; }
@@ -14878,7 +14888,7 @@ var CRow = styled9__default.default.button`
 var CCellLabel = styled9__default.default.div`
   font-size: 0.6rem;
   font-weight: 500;
-  color: rgba(255, 255, 255, 0.3);
+  color: rgba(255, 255, 255, 0.5);
   margin-bottom: 1px;
 `;
 var CAssetCell = styled9__default.default.div``;
@@ -14937,7 +14947,7 @@ var CDetailGrid = styled9__default.default.div`
 var CDetailItem = styled9__default.default.div``;
 var CDLabel = styled9__default.default.div`
   font-size: 0.6rem;
-  color: rgba(255, 255, 255, 0.3);
+  color: rgba(255, 255, 255, 0.5);
   margin-bottom: 1px;
 `;
 var CDValue = styled9__default.default.div`