@microcosmmoney/portal-react 3.10.0 → 3.12.0
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.
- package/dist/components/auction/auction-page.js +11 -9
- package/dist/components/dashboard/assets-summary.d.ts +1 -1
- package/dist/components/dashboard/assets-summary.js +23 -18
- package/dist/components/dashboard/dashboard-overview.js +5 -2
- package/dist/components/dashboard/ecosystem-stats.js +7 -5
- package/dist/components/dashboard/lock-periods.d.ts +1 -1
- package/dist/components/dashboard/lock-periods.js +6 -4
- package/dist/components/dashboard/market-overview-bar.js +109 -23
- package/dist/components/dashboard/mcc-token-stats.d.ts +1 -1
- package/dist/components/dashboard/mcc-token-stats.js +34 -18
- package/dist/components/dashboard/mcd-stats.d.ts +1 -1
- package/dist/components/dashboard/mcd-stats.js +34 -18
- package/dist/components/dashboard/mining-weight.js +13 -15
- package/dist/components/dashboard/minting-stats.js +12 -11
- package/dist/components/dashboard/my-mining.d.ts +2 -1
- package/dist/components/dashboard/my-mining.js +24 -14
- package/dist/components/dashboard/price-chart.js +46 -7
- package/dist/components/dashboard/quick-actions.js +35 -21
- package/dist/components/fragment/fragment-page.js +3 -1
- package/dist/components/income/manager-income-page.js +5 -3
- package/dist/components/lending/lending-page.js +3 -1
- package/dist/components/mcd/mcd-page.js +7 -5
- package/dist/components/mining/mining-page.js +5 -3
- package/dist/components/profile/email-change-card.js +5 -3
- package/dist/components/profile/profile-page.js +10 -8
- package/dist/components/profile/two-factor-settings.js +6 -4
- package/dist/components/queue/queue-status-page.js +4 -2
- package/dist/components/reincarnation/reincarnation-page.js +6 -2
- package/dist/components/rewards/rewards-page.js +5 -3
- package/dist/components/stations/station-list-page.js +10 -8
- package/dist/components/territory/territory-page.js +5 -3
- package/dist/components/voting/voting-page.js +3 -1
- package/dist/components/wallet/wallet-page.js +9 -6
- package/dist/i18n-context.d.ts +11 -0
- package/dist/i18n-context.js +59 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +6 -2
- package/package.json +1 -1
|
@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
exports.MicrocosmAuctionPage = MicrocosmAuctionPage;
|
|
5
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
6
|
const react_1 = require("react");
|
|
7
|
+
const i18n_context_1 = require("../../i18n-context");
|
|
7
8
|
const auth_react_1 = require("@microcosmmoney/auth-react");
|
|
8
9
|
/* ─── Inline SVG Icons (lucide style, 24x24) ─── */
|
|
9
10
|
const IconGavel = ({ className = 'w-4 h-4' }) => ((0, jsx_runtime_1.jsxs)("svg", { className: className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [(0, jsx_runtime_1.jsx)("path", { d: "m14 13-7.5 7.5c-.83.83-2.17.83-3 0 0 0 0 0 0 0a2.12 2.12 0 0 1 0-3L11 10" }), (0, jsx_runtime_1.jsx)("path", { d: "m16 16 6-6" }), (0, jsx_runtime_1.jsx)("path", { d: "m8 8 6-6" }), (0, jsx_runtime_1.jsx)("path", { d: "m9 7 8 8" }), (0, jsx_runtime_1.jsx)("path", { d: "m21 11-8-8" })] }));
|
|
@@ -81,6 +82,7 @@ function Modal({ open, onClose, children }) {
|
|
|
81
82
|
return ((0, jsx_runtime_1.jsxs)("div", { className: "fixed inset-0 z-50 flex items-center justify-center", onClick: onClose, children: [(0, jsx_runtime_1.jsx)("div", { className: "absolute inset-0 bg-black/60" }), (0, jsx_runtime_1.jsx)("div", { className: "relative bg-neutral-900 border border-neutral-700 rounded-lg max-w-md w-full mx-4 font-mono max-h-[90vh] overflow-y-auto", onClick: e => e.stopPropagation(), children: children })] }));
|
|
82
83
|
}
|
|
83
84
|
function MicrocosmAuctionPage({ basePath = '', onNavigate }) {
|
|
85
|
+
const t = (0, i18n_context_1.useTranslations)('auctionsDash');
|
|
84
86
|
const { data: auctions, loading, refresh: refreshAuctions } = (0, auth_react_1.useAuctions)({ refetchInterval: 30000 });
|
|
85
87
|
const { data: myBids, refresh: refreshBids } = (0, auth_react_1.useMyBids)({ refetchInterval: 30000 });
|
|
86
88
|
const { data: history, refresh: refreshHistory } = (0, auth_react_1.useAuctionHistory)();
|
|
@@ -118,12 +120,12 @@ function MicrocosmAuctionPage({ basePath = '', onNavigate }) {
|
|
|
118
120
|
return;
|
|
119
121
|
const amount = parseFloat(bidAmount);
|
|
120
122
|
if (isNaN(amount) || amount <= 0) {
|
|
121
|
-
setActionError('Enter a valid bid amount');
|
|
123
|
+
setActionError(t('invalidBidAmount', 'Enter a valid bid amount'));
|
|
122
124
|
return;
|
|
123
125
|
}
|
|
124
126
|
const minBid = (selectedAuction.current_price ?? 0) + (selectedAuction.bid_increment ?? 0);
|
|
125
127
|
if (amount < minBid) {
|
|
126
|
-
setActionError(`Minimum bid is ${minBid.toLocaleString()} MCC
|
|
128
|
+
setActionError(t('minBidError', `Minimum bid is ${minBid.toLocaleString()} MCC`, { amount: minBid.toLocaleString() }));
|
|
127
129
|
return;
|
|
128
130
|
}
|
|
129
131
|
try {
|
|
@@ -135,12 +137,12 @@ function MicrocosmAuctionPage({ basePath = '', onNavigate }) {
|
|
|
135
137
|
handleRefresh();
|
|
136
138
|
}
|
|
137
139
|
catch (err) {
|
|
138
|
-
setActionError(err instanceof Error ? err.message : 'Bid failed');
|
|
140
|
+
setActionError(err instanceof Error ? err.message : t('bidFailed', 'Bid failed'));
|
|
139
141
|
}
|
|
140
142
|
};
|
|
141
143
|
if (loading)
|
|
142
144
|
return ((0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center h-[60vh]", children: (0, jsx_runtime_1.jsx)("span", { className: "inline-block w-8 h-8 border-2 border-neutral-400 border-t-transparent rounded-full animate-spin" }) }));
|
|
143
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: "max-w-7xl mx-auto p-6 space-y-6 font-mono", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-2xl font-bold text-white tracking-wider", children:
|
|
145
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "max-w-7xl mx-auto p-6 space-y-6 font-mono", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-2xl font-bold text-white tracking-wider", children: t('title', 'Territory Auctions') }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: t('subtitle', 'Bid for magistrate positions across the Microcosm') })] }), (0, jsx_runtime_1.jsxs)("button", { onClick: handleRefresh, disabled: refreshing, className: "flex items-center gap-2 px-3 py-1.5 text-sm border border-neutral-700 rounded text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 disabled:opacity-50 bg-transparent", children: [(0, jsx_runtime_1.jsx)(IconRefresh, { className: cn('w-4 h-4', refreshing && 'animate-spin') }), t('refresh', 'Refresh')] })] }), actionError && ((0, jsx_runtime_1.jsx)("div", { className: "p-3 bg-red-500/10 border border-red-500/30 rounded text-red-400 text-sm", children: actionError })), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg", children: (0, jsx_runtime_1.jsx)("div", { className: "p-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t('ongoing', 'Ongoing') }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold text-cyan-400 font-mono", children: auctionList.length }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: t('auctionsCount', 'auctions') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t('totalBids', 'Total Bids') }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold text-white font-mono", children: stats.totalBids }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: t('bidsCount', 'bids') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t('highestBid', 'Highest Bid') }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold text-cyan-400 font-mono", children: stats.highestBid > 0 ? stats.highestBid.toLocaleString() : '--' }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: "MCC" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t('totalLocked', 'Total Locked') }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold text-cyan-400 font-mono", children: stats.totalVolume > 0 ? stats.totalVolume.toLocaleString() : '--' }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: "MCC" })] })] }) }) }), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg", children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconFlame, { className: "w-4 h-4 text-cyan-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm font-medium text-neutral-300 tracking-wider", children: t('activeAuctions', 'Active Auctions') }), (0, jsx_runtime_1.jsxs)("span", { className: "text-xs text-neutral-500", children: ["(", auctionList.length, ")"] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 text-xs text-neutral-500", children: [(0, jsx_runtime_1.jsx)(IconClock, { className: "w-3 h-3" }), (0, jsx_runtime_1.jsx)("span", { children: t('autoRefresh', 'Auto-refresh 30s') })] })] }), auctionList.length === 0 ? ((0, jsx_runtime_1.jsxs)("div", { className: "text-center py-16", children: [(0, jsx_runtime_1.jsx)(IconGavel, { className: "w-10 h-10 text-neutral-700 mx-auto mb-3" }), (0, jsx_runtime_1.jsx)("div", { className: "text-neutral-500 text-sm mb-2", children: t('noActiveAuctions', 'No active auctions') }), (0, jsx_runtime_1.jsx)("div", { className: "text-neutral-500 text-xs max-w-md mx-auto", children: "Auctions are held for magistrate positions. When a territory opens for bidding, it will appear here." })] })) : ((0, jsx_runtime_1.jsx)("div", { className: "space-y-4", children: auctionList.map((auction) => {
|
|
144
146
|
const unitType = auction.unit_type || 'station';
|
|
145
147
|
const currentPrice = auction.current_price ?? auction.starting_price ?? 0;
|
|
146
148
|
const startingPrice = auction.starting_price ?? 0;
|
|
@@ -150,13 +152,13 @@ function MicrocosmAuctionPage({ basePath = '', onNavigate }) {
|
|
|
150
152
|
? ((currentPrice - startingPrice) / startingPrice * 100).toFixed(1)
|
|
151
153
|
: '0';
|
|
152
154
|
const isHot = (auction.bid_count || 0) >= 5;
|
|
153
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: cn('bg-neutral-800 border rounded p-5 hover:border-cyan-400/50 transition-colors', isHot ? 'border-cyan-400/30' : 'border-neutral-700'), children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-start justify-between mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-cyan-400", children: UNIT_ICONS[unitType] || UNIT_ICONS.station }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-white font-bold", children: auction.unit_name || `Territory #${auction.unit_id || auction.auction_id || auction.id}` }), isHot && ((0, jsx_runtime_1.jsxs)(Badge, { className: BADGE_VARIANTS.warning, children: [(0, jsx_runtime_1.jsx)(IconFlame, { className: "w-3 h-3" }),
|
|
154
|
-
}) }))] }) }), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg", children: (0, jsx_runtime_1.jsx)("div", { className: "p-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconAward, { className: "w-3.5 h-3.5 text-cyan-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400 tracking-wider", children:
|
|
155
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: cn('bg-neutral-800 border rounded p-5 hover:border-cyan-400/50 transition-colors', isHot ? 'border-cyan-400/30' : 'border-neutral-700'), children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-start justify-between mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-cyan-400", children: UNIT_ICONS[unitType] || UNIT_ICONS.station }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-white font-bold", children: auction.unit_name || `Territory #${auction.unit_id || auction.auction_id || auction.id}` }), isHot && ((0, jsx_runtime_1.jsxs)(Badge, { className: BADGE_VARIANTS.warning, children: [(0, jsx_runtime_1.jsx)(IconFlame, { className: "w-3 h-3" }), t('hot', 'Hot')] }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mt-0.5", children: [(0, jsx_runtime_1.jsx)(Badge, { className: BADGE_VARIANTS.info, children: UNIT_LABELS[unitType] || 'Station' }), (0, jsx_runtime_1.jsx)(Badge, { className: BADGE_VARIANTS.default, children: auction.auction_type === 'first' ? t('firstAuction', 'First Auction') : auction.auction_type === 'second' ? t('secondAuction', 'Second Auction') : 'Auction' }), (0, jsx_runtime_1.jsx)(Badge, { className: BADGE_VARIANTS.success, children: t('active', 'Active') })] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 bg-neutral-800 border border-neutral-700 rounded px-3 py-1.5 text-sm", children: [(0, jsx_runtime_1.jsx)(IconClock, { className: "w-3.5 h-3.5 text-cyan-400" }), (0, jsx_runtime_1.jsx)(TimeRemaining, { endTime: auction.end_time, className: "text-cyan-400 font-bold font-mono" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-3 mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 border border-neutral-700 rounded p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t('startingPrice', 'Starting Price') }), (0, jsx_runtime_1.jsx)("div", { className: "text-neutral-300 font-mono", children: startingPrice.toLocaleString() }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: "MCC" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t('currentHighest', 'Current Highest') }), (0, jsx_runtime_1.jsx)("div", { className: "text-xl font-bold text-cyan-400 font-mono", children: currentPrice.toLocaleString() }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1 text-xs", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-neutral-500", children: "MCC" }), Number(priceUp) > 0 && ((0, jsx_runtime_1.jsxs)("span", { className: "text-white flex items-center", children: [(0, jsx_runtime_1.jsx)(IconArrowUpRight, { className: "w-3 h-3" }), "+", priceUp, "%"] }))] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 border border-neutral-700 rounded p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t('bidCount', 'Bid Count') }), (0, jsx_runtime_1.jsx)("div", { className: "text-white font-bold font-mono", children: auction.bid_count || 0 }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: t('bidsCount', 'bids') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 border border-neutral-700 rounded p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t('minIncrement', 'Min Increment') }), (0, jsx_runtime_1.jsx)("div", { className: "text-neutral-300 font-mono", children: bidIncrement.toLocaleString() }), (0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-500", children: ["MCC (", '\u2265', "5%)"] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4 text-xs text-neutral-500", children: [(0, jsx_runtime_1.jsxs)("span", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)(IconLock, { className: "w-3 h-3" }), t('deposit50', '50% Deposit')] }), (0, jsx_runtime_1.jsxs)("span", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)(IconCrown, { className: "w-3 h-3" }), t('winnerMagistrate', 'Winner becomes Magistrate')] }), (0, jsx_runtime_1.jsxs)("span", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)(IconTimer, { className: "w-3 h-3" }), t('noNewBid24h', 'Settles if no new bid in 24h')] })] }), (auction.status === 'active' || !auction.status) && ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("button", { onClick: () => openBidDialog(auction), className: "flex items-center gap-2 px-4 py-2 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-sm font-mono", children: [(0, jsx_runtime_1.jsx)(IconGavel, { className: "w-4 h-4" }), t('placeBid', 'Place Bid')] }), (0, jsx_runtime_1.jsxs)("button", { onClick: () => openBidDialog(auction), className: "flex items-center gap-1.5 px-3 py-1.5 text-xs border border-neutral-700 rounded text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent", children: [(0, jsx_runtime_1.jsx)(IconZap, { className: "w-3 h-3" }), minNextBid.toLocaleString(), " MCC"] })] }))] })] }, auction.auction_id ?? auction.id));
|
|
156
|
+
}) }))] }) }), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg", children: (0, jsx_runtime_1.jsx)("div", { className: "p-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconAward, { className: "w-3.5 h-3.5 text-cyan-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400 tracking-wider", children: t('auctionTarget', 'Auction Target') })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-neutral-300 mb-1", children: t('auctionTargetDesc', 'Territory magistrate positions') }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: t('auctionTargetDetail', 'Station / Matrix / Sector / System levels') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconTimer, { className: "w-3.5 h-3.5 text-cyan-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400 tracking-wider", children: t('biddingRules', 'Bidding Rules') })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-neutral-300 mb-1", children: t('biddingRulesDesc', '50% deposit, ≥5% increment') }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: t('biddingRulesDetail', '24h with no new bids ends the auction') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [(0, jsx_runtime_1.jsx)(IconUsers, { className: "w-3.5 h-3.5 text-cyan-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400 tracking-wider", children: t('participationReq', 'Participation') })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-neutral-300 mb-1", children: t('participationReqDesc', 'Sufficient MCC balance required') }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: t('participationReqDetail', 'Miner level or above to participate') })] })] }) }) }), bidsList.length > 0 && ((0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg", children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6", children: [(0, jsx_runtime_1.jsxs)("div", { onClick: () => setShowMyBids(!showMyBids), className: "flex items-center justify-between cursor-pointer", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconShield, { className: "w-4 h-4 text-cyan-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-300 tracking-wider", children: t('myBids', 'My Bids') }), (0, jsx_runtime_1.jsxs)("span", { className: "text-xs text-neutral-500", children: [bidsList.length, " ", t('bidsCount', 'bids')] }), stats.myLeading > 0 && (0, jsx_runtime_1.jsxs)(Badge, { className: BADGE_VARIANTS.success, children: [stats.myLeading, " ", t('leading', 'leading')] })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-4", children: showMyBids
|
|
155
157
|
? (0, jsx_runtime_1.jsx)(IconChevronUp, { className: "w-4 h-4 text-neutral-500" })
|
|
156
|
-
: (0, jsx_runtime_1.jsx)(IconChevronDown, { className: "w-4 h-4 text-neutral-500" }) })] }), showMyBids && ((0, jsx_runtime_1.jsx)("div", { className: "mt-4 space-y-2", children: bidsList.length === 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "text-center py-8 text-neutral-500 text-sm", children:
|
|
158
|
+
: (0, jsx_runtime_1.jsx)(IconChevronDown, { className: "w-4 h-4 text-neutral-500" }) })] }), showMyBids && ((0, jsx_runtime_1.jsx)("div", { className: "mt-4 space-y-2", children: bidsList.length === 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "text-center py-8 text-neutral-500 text-sm", children: t('noBidRecords', 'No bid records') })) : bidsList.map((bid, idx) => {
|
|
157
159
|
const si = BID_STATUS_MAP[bid.status] || { label: bid.status || 'active', variant: 'default' };
|
|
158
160
|
return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between bg-neutral-800 border border-neutral-700 rounded p-3 hover:bg-neutral-700 transition-colors", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)(Badge, { className: BADGE_VARIANTS[si.variant] || BADGE_VARIANTS.default, children: si.label }), (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-300 text-sm", children: bid.unit_name || `#${bid.auction_id}` }), (0, jsx_runtime_1.jsxs)("span", { className: "text-white text-sm font-bold font-mono", children: [(bid.bid_amount ?? bid.amount ?? 0).toLocaleString(), " MCC"] })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-3", children: bid.created_at && (0, jsx_runtime_1.jsx)(FormattedDateTime, { dateTime: bid.created_at, className: "text-neutral-500 text-xs font-mono" }) })] }, bid.bid_id ?? idx));
|
|
159
|
-
}) }))] }) })), historyList.length > 0 && ((0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg", children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6", children: [(0, jsx_runtime_1.jsxs)("div", { onClick: () => setShowHistory(!showHistory), className: "flex items-center justify-between cursor-pointer", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconBarChart, { className: "w-4 h-4 text-neutral-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-300 tracking-wider", children:
|
|
161
|
+
}) }))] }) })), historyList.length > 0 && ((0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg", children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6", children: [(0, jsx_runtime_1.jsxs)("div", { onClick: () => setShowHistory(!showHistory), className: "flex items-center justify-between cursor-pointer", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconBarChart, { className: "w-4 h-4 text-neutral-400" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-300 tracking-wider", children: t('auctionHistory', 'Auction History') }), (0, jsx_runtime_1.jsxs)("span", { className: "text-xs text-neutral-500", children: [historyList.length, " ", t('auctionsCount', 'auctions')] })] }), showHistory
|
|
160
162
|
? (0, jsx_runtime_1.jsx)(IconChevronUp, { className: "w-4 h-4 text-neutral-500" })
|
|
161
|
-
: (0, jsx_runtime_1.jsx)(IconChevronDown, { className: "w-4 h-4 text-neutral-500" })] }), showHistory && ((0, jsx_runtime_1.jsx)("div", { className: "mt-4 space-y-2", children: historyList.map((a, idx) => ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between bg-neutral-800 border border-neutral-700 rounded p-3 hover:bg-neutral-700 transition-colors", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-cyan-400", children: UNIT_ICONS[a.unit_type || 'station'] || UNIT_ICONS.station }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-neutral-300 text-sm", children: a.unit_name || `Territory #${a.unit_id || a.auction_id}` }), (0, jsx_runtime_1.jsx)("div", { className: "text-neutral-500 text-xs", children: UNIT_LABELS[a.unit_type || 'station'] || 'Station' })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-right", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-white text-sm font-bold font-mono", children: [(a.current_price ?? a.final_price ?? 0).toLocaleString(), " MCC"] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-neutral-500 text-xs", children: [a.bid_count || 0, " bids"] })] }), (0, jsx_runtime_1.jsx)(Badge, { className: a.status === 'cancelled' ? BADGE_VARIANTS.error : BADGE_VARIANTS.default, children: a.status === 'ended' ? 'Ended' : a.status === 'cancelled' ? 'Cancelled' : 'Sold' })] })] }, a.auction_id ?? idx))) }))] }) })), (0, jsx_runtime_1.jsx)(Modal, { open: bidDialogOpen, onClose: () => setBidDialogOpen(false), children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6 space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-mono font-bold flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconGavel, { className: "w-5 h-5 text-cyan-400" }),
|
|
163
|
+
: (0, jsx_runtime_1.jsx)(IconChevronDown, { className: "w-4 h-4 text-neutral-500" })] }), showHistory && ((0, jsx_runtime_1.jsx)("div", { className: "mt-4 space-y-2", children: historyList.map((a, idx) => ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between bg-neutral-800 border border-neutral-700 rounded p-3 hover:bg-neutral-700 transition-colors", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-cyan-400", children: UNIT_ICONS[a.unit_type || 'station'] || UNIT_ICONS.station }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-neutral-300 text-sm", children: a.unit_name || `Territory #${a.unit_id || a.auction_id}` }), (0, jsx_runtime_1.jsx)("div", { className: "text-neutral-500 text-xs", children: UNIT_LABELS[a.unit_type || 'station'] || 'Station' })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-right", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-white text-sm font-bold font-mono", children: [(a.current_price ?? a.final_price ?? 0).toLocaleString(), " MCC"] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-neutral-500 text-xs", children: [a.bid_count || 0, " bids"] })] }), (0, jsx_runtime_1.jsx)(Badge, { className: a.status === 'cancelled' ? BADGE_VARIANTS.error : BADGE_VARIANTS.default, children: a.status === 'ended' ? t('ended', 'Ended') : a.status === 'cancelled' ? t('cancelled', 'Cancelled') : t('sold', 'Sold') })] })] }, a.auction_id ?? idx))) }))] }) })), (0, jsx_runtime_1.jsx)(Modal, { open: bidDialogOpen, onClose: () => setBidDialogOpen(false), children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6 space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-mono font-bold flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(IconGavel, { className: "w-5 h-5 text-cyan-400" }), t('bidDialog', 'Place Bid')] }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-400 font-mono text-sm mt-1", children: selectedAuction?.unit_name || `Territory #${selectedAuction?.unit_id || selectedAuction?.auction_id || selectedAuction?.id}` })] }), selectedAuction && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2 flex-wrap", children: [(0, jsx_runtime_1.jsx)(Badge, { className: BADGE_VARIANTS.info, children: UNIT_LABELS[selectedAuction.unit_type || 'station'] || 'Station' }), (0, jsx_runtime_1.jsx)(Badge, { className: BADGE_VARIANTS.default, children: selectedAuction.auction_type === 'first' ? t('firstAuction', 'First Auction') : selectedAuction.auction_type === 'second' ? t('secondAuction', 'Second Auction') : 'Auction' }), (0, jsx_runtime_1.jsxs)(Badge, { className: BADGE_VARIANTS.warning, children: [(0, jsx_runtime_1.jsx)(IconCrown, { className: "w-3 h-3" }), t('winnerMagistrate', 'Winner = Magistrate')] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 border border-neutral-700 rounded p-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: t('currentHighest', 'Current Highest') }), (0, jsx_runtime_1.jsxs)("div", { className: "text-3xl font-bold text-cyan-400 font-mono", children: [(selectedAuction.current_price ?? selectedAuction.starting_price ?? 0).toLocaleString(), ' ', (0, jsx_runtime_1.jsx)("span", { className: "text-base text-neutral-500", children: "MCC" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-500 mt-1", children: [selectedAuction.bid_count || 0, " bids \u00B7 Starting price ", (selectedAuction.starting_price ?? 0).toLocaleString(), " MCC"] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-center p-3 bg-neutral-800 rounded border border-neutral-700 text-sm", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400", children: t('minIncrement', 'Min Next Bid') }), (0, jsx_runtime_1.jsxs)("span", { className: "text-white font-bold font-mono", children: [((selectedAuction.current_price ?? selectedAuction.starting_price ?? 0) + (selectedAuction.bid_increment ?? 0)).toLocaleString(), " MCC"] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: [t('bidAmountLabel', 'Bid Amount'), " (", t('bidAmountMin', 'min {amount} MCC', { amount: ((selectedAuction.current_price ?? 0) + (selectedAuction.bid_increment ?? 0)).toLocaleString() }), ")"] }), (0, jsx_runtime_1.jsx)("input", { type: "number", step: selectedAuction.bid_increment ?? 1, value: bidAmount, onChange: (e) => setBidAmount(e.target.value), placeholder: t('bidAmountLabel', 'Enter bid amount'), className: "w-full bg-neutral-800 border border-neutral-600 text-white placeholder-neutral-400 px-3 py-2.5 rounded text-sm font-mono focus:border-cyan-400 focus:outline-none" })] }), bidAmount && !isNaN(parseFloat(bidAmount)) && parseFloat(bidAmount) > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-2 p-3 bg-neutral-800 rounded border border-neutral-700 text-sm", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-400", children: [t('bidAmountLabel', 'Bid Amount'), ":"] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-300 font-mono", children: [parseFloat(bidAmount).toLocaleString(), " MCC"] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-neutral-400", children: [t('depositLabel', 'Deposit (50%)'), ":"] }), (0, jsx_runtime_1.jsxs)("span", { className: "text-cyan-400 font-mono", children: [(parseFloat(bidAmount) * 0.5).toLocaleString(), " MCC"] })] })] })), actionError && ((0, jsx_runtime_1.jsxs)("div", { className: "text-red-500 text-xs flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)(IconLock, { className: "w-3 h-3" }), actionError] }))] })), (0, jsx_runtime_1.jsxs)("div", { className: "flex justify-end gap-3 pt-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => setBidDialogOpen(false), className: "px-4 py-2 text-sm border border-neutral-700 rounded text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent", children: t('cancel', 'Cancel') }), (0, jsx_runtime_1.jsx)("button", { onClick: handlePlaceBid, disabled: bidLoading || !bidAmount, className: "px-4 py-2 text-sm bg-cyan-700 hover:bg-cyan-600 text-white rounded disabled:opacity-50 font-mono", children: bidLoading ? 'Processing...' : t('confirmBid', 'Confirm Bid') })] })] }) })] }));
|
|
162
164
|
}
|
|
@@ -3,4 +3,4 @@ export interface MicrocosmAssetsSummaryProps {
|
|
|
3
3
|
onNavigate?: (path: string) => void;
|
|
4
4
|
accentColor?: string;
|
|
5
5
|
}
|
|
6
|
-
export declare function MicrocosmAssetsSummary({ basePath,
|
|
6
|
+
export declare function MicrocosmAssetsSummary({ basePath, accentColor }: MicrocosmAssetsSummaryProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -4,40 +4,45 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
exports.MicrocosmAssetsSummary = MicrocosmAssetsSummary;
|
|
5
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
6
|
const auth_react_1 = require("@microcosmmoney/auth-react");
|
|
7
|
+
const i18n_context_1 = require("../../i18n-context");
|
|
8
|
+
const link_context_1 = require("../../link-context");
|
|
7
9
|
const RANK_COLOR = {
|
|
8
10
|
miner: 'text-cyan-300',
|
|
9
11
|
commander: 'text-white', pioneer: 'text-cyan-400', warden: 'text-cyan-300', admiral: 'text-cyan-300',
|
|
10
12
|
};
|
|
11
|
-
function MicrocosmAssetsSummary({ basePath = '',
|
|
13
|
+
function MicrocosmAssetsSummary({ basePath = '', accentColor }) {
|
|
14
|
+
const t = (0, i18n_context_1.useTranslations)('mccDashboard');
|
|
15
|
+
const Link = (0, link_context_1.useLinkComponent)();
|
|
12
16
|
const { balance: mccData, loading: mccLoading } = (0, auth_react_1.useMCC)(120000);
|
|
13
|
-
const { balance: mcdData
|
|
17
|
+
const { balance: mcdData } = (0, auth_react_1.useMCD)(120000);
|
|
14
18
|
const { data: levelData } = (0, auth_react_1.useLevelProgress)();
|
|
15
19
|
const { data: wallets } = (0, auth_react_1.useWallets)();
|
|
16
20
|
const { data: locks } = (0, auth_react_1.useMCCLocks)();
|
|
17
21
|
const { data: marketData } = (0, auth_react_1.useMarketData)();
|
|
18
22
|
const resolvePath = (p) => basePath ? `${basePath.replace(/\/$/, '')}${p}` : p;
|
|
19
|
-
const
|
|
20
|
-
const mccPrice = marketData?.price_usd ?? 0;
|
|
21
|
-
const mccUsdValue = mccPrice > 0 ?
|
|
23
|
+
const mccDisplay = mccData?.balance ?? 0;
|
|
24
|
+
const mccPrice = marketData?.price ?? marketData?.price_usd ?? 0;
|
|
25
|
+
const mccUsdValue = mccPrice > 0 ? mccDisplay * mccPrice : 0;
|
|
22
26
|
const mcdAmount = parseFloat(mcdData?.available_balance ?? '0');
|
|
23
|
-
const
|
|
24
|
-
const
|
|
27
|
+
const mcdTotalReceived = parseFloat(mcdData?.total_balance ?? '0');
|
|
28
|
+
const mcdTotalSpent = parseFloat(mcdData?.frozen_balance ?? '0');
|
|
25
29
|
const walletCount = Array.isArray(wallets) ? wallets.length : 0;
|
|
26
30
|
const activeLocks = Array.isArray(locks) ? locks.filter((l) => l.status === 'locked') : [];
|
|
27
31
|
const lockedAmount = activeLocks.reduce((sum, l) => sum + (l.amount || 0), 0);
|
|
28
|
-
const
|
|
32
|
+
const userRank = levelData?.level ?? levelData?.current_level ?? null;
|
|
29
33
|
const nextRank = levelData?.next_level ?? null;
|
|
30
|
-
const
|
|
31
|
-
const
|
|
32
|
-
const
|
|
33
|
-
|
|
34
|
-
|
|
34
|
+
const progressPercent = levelData?.progress_percent ?? 0;
|
|
35
|
+
const nextLevelRequirement = levelData?.next_level_requirement ?? null;
|
|
36
|
+
const getRankColor = (rank) => {
|
|
37
|
+
if (!rank)
|
|
38
|
+
return 'text-neutral-500';
|
|
39
|
+
return RANK_COLOR[rank.toLowerCase()] || 'text-neutral-400';
|
|
40
|
+
};
|
|
41
|
+
const rankColor = accentColor ? undefined : getRankColor(userRank);
|
|
35
42
|
const rankStyle = accentColor ? { color: accentColor } : undefined;
|
|
36
43
|
const spinnerBorderColor = accentColor ? { borderColor: accentColor, borderTopColor: 'transparent' } : undefined;
|
|
37
44
|
const spinnerClass = accentColor ? 'inline-block w-5 h-5 border-2 rounded-full animate-spin' : 'inline-block w-5 h-5 border-2 border-cyan-400 border-t-transparent rounded-full animate-spin';
|
|
38
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
? (0, jsx_runtime_1.jsx)("span", { className: spinnerClass, style: spinnerBorderColor })
|
|
42
|
-
: fmt(mcdAmount) }), (0, jsx_runtime_1.jsxs)("div", { className: "text-[10px] text-neutral-500 font-mono mt-1", children: ["in: ", fmt(mcdReceived, 0), " out: ", fmt(mcdSpent, 0)] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl p-4 blockchain-card", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 mb-2", children: [(0, jsx_runtime_1.jsx)("svg", { className: "blockchain-icon w-3.5 h-3.5 text-[#5EEAD4]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" }) }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#5EEAD4] text-[10px] font-mono tracking-widest uppercase", children: "LOCKED" })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold font-mono text-white", children: fmt(lockedAmount, 0) }), (0, jsx_runtime_1.jsxs)("div", { className: "text-[10px] text-neutral-500 font-mono mt-1", children: [activeLocks.length, " lock period", activeLocks.length !== 1 ? 's' : ''] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl p-4 blockchain-card", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 mb-2", children: [(0, jsx_runtime_1.jsx)("svg", { className: "blockchain-icon w-3.5 h-3.5 text-[#5EEAD4]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z" }) }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#5EEAD4] text-[10px] font-mono tracking-widest uppercase", children: "WALLETS" })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold font-mono text-white", children: walletCount })] }), (0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl p-4 blockchain-card", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-[#5EEAD4] text-[10px] font-mono tracking-widest uppercase mb-2", children: "RANK" }), (0, jsx_runtime_1.jsx)("div", { className: `text-lg font-bold font-mono ${rankColor ?? ''}`, style: rankStyle, children: rank || 'N/A' }), nextRank && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-full bg-neutral-800 rounded-full h-1.5", children: (0, jsx_runtime_1.jsx)("div", { className: accentColor ? 'h-1.5 rounded-full transition-all' : 'bg-cyan-400 h-1.5 rounded-full transition-all', style: { width: `${Math.min(progress, 100)}%`, ...(accentColor ? { backgroundColor: accentColor } : {}) } }) }), (0, jsx_runtime_1.jsxs)("div", { className: "text-[10px] text-neutral-500 font-mono mt-1", children: [progress.toFixed(0), "% \u2192 ", nextRank] })] }))] })] }));
|
|
45
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 sm:grid-cols-3 md:grid-cols-5 gap-2 sm:gap-3", children: [(0, jsx_runtime_1.jsx)(Link, { href: resolvePath('/mcc/wallet'), className: "block group", children: (0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl p-2.5 sm:p-4 blockchain-card h-full", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 mb-2", children: [(0, jsx_runtime_1.jsxs)("svg", { className: "w-3.5 h-3.5 text-[#5EEAD4]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: [(0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z" }), (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" })] }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#5EEAD4] text-[10px] font-mono tracking-widest uppercase", children: t('mccBalance', 'MCC_BALANCE') })] }), (0, jsx_runtime_1.jsx)("div", { className: accentColor ? 'text-base sm:text-2xl font-bold font-mono' : 'text-base sm:text-2xl font-bold font-mono text-cyan-400', style: accentColor ? { color: accentColor } : undefined, children: mccLoading
|
|
46
|
+
? (0, jsx_runtime_1.jsx)("span", { className: spinnerClass, style: spinnerBorderColor })
|
|
47
|
+
: mccDisplay.toLocaleString('en-US', { minimumFractionDigits: 3, maximumFractionDigits: 3 }) }), mccUsdValue > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-500 font-mono mt-1", children: ["\u2248 $", mccUsdValue.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })] }))] }) }), (0, jsx_runtime_1.jsx)(Link, { href: resolvePath('/mcc/mcd'), className: "block group", children: (0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl p-2.5 sm:p-4 blockchain-card h-full", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 mb-2", children: [(0, jsx_runtime_1.jsx)("svg", { className: "w-3.5 h-3.5 text-[#5EEAD4]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 7h8m0 0v8m0-8l-8 8-4-4-6 6" }) }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#5EEAD4] text-[10px] font-mono tracking-widest uppercase", children: t('mcdBalance', 'MCD_BALANCE') })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-base sm:text-2xl font-bold font-mono text-white", children: mcdAmount.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 }) }), (0, jsx_runtime_1.jsxs)("div", { className: "text-[10px] text-neutral-500 font-mono mt-1", children: [t('in', 'in'), ": ", mcdTotalReceived.toLocaleString('en-US', { maximumFractionDigits: 0 }), " ", t('out', 'out'), ": ", mcdTotalSpent.toLocaleString('en-US', { maximumFractionDigits: 0 })] })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl p-2.5 sm:p-4 blockchain-card", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 mb-2", children: [(0, jsx_runtime_1.jsx)("svg", { className: "w-3.5 h-3.5 text-[#5EEAD4]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" }) }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#5EEAD4] text-[10px] font-mono tracking-widest uppercase", children: t('locked', 'LOCKED') })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-base sm:text-2xl font-bold font-mono text-white", children: lockedAmount.toLocaleString('en-US', { maximumFractionDigits: 0 }) }), (0, jsx_runtime_1.jsxs)("div", { className: "text-[10px] text-neutral-500 font-mono mt-1", children: [activeLocks.length, " ", t('lockPeriods', 'lock period'), activeLocks.length !== 1 ? 's' : ''] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl p-2.5 sm:p-4 blockchain-card", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 mb-2", children: [(0, jsx_runtime_1.jsx)("svg", { className: "w-3.5 h-3.5 text-[#5EEAD4]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z" }) }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#5EEAD4] text-[10px] font-mono tracking-widest uppercase", children: t('wallets', 'WALLETS') })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-base sm:text-2xl font-bold font-mono text-white", children: walletCount })] }), (0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl p-2.5 sm:p-4 blockchain-card", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-[#5EEAD4] text-[10px] font-mono tracking-widest uppercase mb-2", children: t('rank', 'RANK') }), (0, jsx_runtime_1.jsx)("div", { className: `text-lg font-bold font-mono ${rankColor ?? ''}`, style: rankStyle, children: userRank || t('na', 'N/A') }), nextRank && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-full bg-neutral-800 rounded-full h-1.5", children: (0, jsx_runtime_1.jsx)("div", { className: accentColor ? 'h-1.5 rounded-full transition-all' : 'bg-cyan-400 h-1.5 rounded-full transition-all', style: { width: `${Math.min(progressPercent, 100)}%`, ...(accentColor ? { backgroundColor: accentColor } : {}) } }) }), (0, jsx_runtime_1.jsxs)("div", { className: "text-[10px] text-neutral-500 font-mono mt-1", children: [nextLevelRequirement ? `${nextLevelRequirement.have}/${nextLevelRequirement.need} ${nextLevelRequirement.tier}` : `${progressPercent.toFixed(0)}%`, " \u2192 ", nextRank] })] }))] })] }));
|
|
43
48
|
}
|
|
@@ -15,6 +15,7 @@ const ecosystem_stats_1 = require("./ecosystem-stats");
|
|
|
15
15
|
const mcc_token_stats_1 = require("./mcc-token-stats");
|
|
16
16
|
const mcd_stats_1 = require("./mcd-stats");
|
|
17
17
|
const lock_periods_1 = require("./lock-periods");
|
|
18
|
+
const i18n_context_1 = require("../../i18n-context");
|
|
18
19
|
class SafeRender extends react_1.Component {
|
|
19
20
|
constructor() {
|
|
20
21
|
super(...arguments);
|
|
@@ -54,9 +55,11 @@ function hexToRgb(hex) {
|
|
|
54
55
|
const n = parseInt(h.length === 3 ? h.split('').map(c => c + c).join('') : h, 16);
|
|
55
56
|
return `${(n >> 16) & 255},${(n >> 8) & 255},${n & 255}`;
|
|
56
57
|
}
|
|
57
|
-
function MicrocosmDashboardOverview({ basePath = '', onNavigate, showHeader = true, headerText
|
|
58
|
+
function MicrocosmDashboardOverview({ basePath = '', onNavigate, showHeader = true, headerText, accentColor, }) {
|
|
59
|
+
const t = (0, i18n_context_1.useTranslations)('mccDashboard');
|
|
60
|
+
const resolvedHeader = headerText ?? t('headerText', 'SHARED NETWORK · SHARED FUTURE');
|
|
58
61
|
const rootStyle = accentColor
|
|
59
62
|
? { '--mc-accent': accentColor, '--mc-accent-rgb': hexToRgb(accentColor) }
|
|
60
63
|
: undefined;
|
|
61
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: "max-w-7xl mx-auto font-mono
|
|
64
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "max-w-7xl mx-auto font-mono px-3 py-4 space-y-3 xs:px-4 xs:space-y-4 sm:px-6 sm:py-6 sm:space-y-6", style: rootStyle, children: [showHeader && ((0, jsx_runtime_1.jsx)("div", { className: "text-center", children: (0, jsx_runtime_1.jsx)("h1", { className: accentColor ? 'text-lg 2xs:text-xl xs:text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold tracking-tight' : 'text-lg 2xs:text-xl xs:text-2xl sm:text-3xl md:text-4xl lg:text-5xl font-bold tracking-tight text-transparent bg-clip-text bg-gradient-to-r from-cyan-400 to-cyan-200', style: accentColor ? { backgroundImage: `linear-gradient(to right, ${accentColor}, ${accentColor}cc)`, WebkitBackgroundClip: 'text', backgroundClip: 'text', color: 'transparent' } : undefined, children: resolvedHeader }) })), (0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(market_overview_bar_1.MicrocosmMarketBar, { accentColor: accentColor }) }), (0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(quick_actions_1.MicrocosmQuickActions, { basePath: basePath, onNavigate: onNavigate, accentColor: accentColor }) }), (0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(assets_summary_1.MicrocosmAssetsSummary, { basePath: basePath, onNavigate: onNavigate, accentColor: accentColor }) }), (0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(price_chart_1.MicrocosmPriceChart, { accentColor: accentColor }) }), (0, jsx_runtime_1.jsx)(LazySection, { fallback: (0, jsx_runtime_1.jsxs)("div", { className: "grid lg:grid-cols-2 gap-3 sm:gap-6", children: [(0, jsx_runtime_1.jsx)(CardSkeleton, { height: "h-56" }), (0, jsx_runtime_1.jsx)(CardSkeleton, { height: "h-56" })] }), children: (0, jsx_runtime_1.jsxs)("div", { className: "grid lg:grid-cols-2 gap-3 sm:gap-6", children: [(0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(my_mining_1.MicrocosmMyMining, { detailsPath: `${basePath}/mcc/mining`, onNavigate: onNavigate, accentColor: accentColor }) }), (0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(mining_weight_1.MicrocosmMiningWeight, { accentColor: accentColor }) })] }) }), (0, jsx_runtime_1.jsx)(LazySection, { fallback: (0, jsx_runtime_1.jsxs)("div", { className: "grid lg:grid-cols-2 gap-3 sm:gap-6", children: [(0, jsx_runtime_1.jsx)(CardSkeleton, { height: "h-56" }), (0, jsx_runtime_1.jsx)(CardSkeleton, { height: "h-56" })] }), children: (0, jsx_runtime_1.jsxs)("div", { className: "grid lg:grid-cols-2 gap-3 sm:gap-6", children: [(0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(minting_stats_1.MicrocosmMintingStats, { accentColor: accentColor }) }), (0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(ecosystem_stats_1.MicrocosmEcosystemStats, { accentColor: accentColor }) })] }) }), (0, jsx_runtime_1.jsx)(LazySection, { fallback: (0, jsx_runtime_1.jsxs)("div", { className: "grid lg:grid-cols-2 gap-3 sm:gap-6", children: [(0, jsx_runtime_1.jsx)(CardSkeleton, {}), (0, jsx_runtime_1.jsx)(CardSkeleton, {})] }), children: (0, jsx_runtime_1.jsxs)("div", { className: "grid lg:grid-cols-2 gap-3 sm:gap-6", children: [(0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(mcc_token_stats_1.MicrocosmMCCTokenStats, { accentColor: accentColor }) }), (0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(mcd_stats_1.MicrocosmMCDStats, { accentColor: accentColor }) })] }) }), (0, jsx_runtime_1.jsx)(LazySection, { fallback: (0, jsx_runtime_1.jsx)(CardSkeleton, {}), children: (0, jsx_runtime_1.jsx)(SafeRender, { children: (0, jsx_runtime_1.jsx)(lock_periods_1.MicrocosmLockPeriods, { accentColor: accentColor }) }) }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center py-4 space-y-1", children: [(0, jsx_runtime_1.jsx)("div", { className: accentColor ? 'text-xs font-mono' : 'text-xs text-cyan-400/60 font-mono', style: accentColor ? { color: `rgba(${hexToRgb(accentColor)},0.6)` } : undefined, children: "Data refreshes every 4 hours \u00B7 For real-time data, please check on-chain directly" }), (0, jsx_runtime_1.jsx)("div", { className: accentColor ? 'text-xs font-mono' : 'text-xs text-cyan-400/60 font-mono', style: accentColor ? { color: `rgba(${hexToRgb(accentColor)},0.6)` } : undefined, children: "\u6570\u636E\u6BCF 4 \u5C0F\u65F6\u66F4\u65B0 \u00B7 \u5373\u65F6\u6570\u636E\u8BF7\u76F4\u63A5\u67E5\u8BE2\u94FE\u4E0A" }), (0, jsx_runtime_1.jsx)("div", { className: accentColor ? 'text-xs font-mono' : 'text-xs text-cyan-400/60 font-mono', style: accentColor ? { color: `rgba(${hexToRgb(accentColor)},0.6)` } : undefined, children: "\u30C7\u30FC\u30BF\u306F4\u6642\u9593\u3054\u3068\u306B\u66F4\u65B0 \u00B7 \u30EA\u30A2\u30EB\u30BF\u30A4\u30E0\u30C7\u30FC\u30BF\u306F\u30AA\u30F3\u30C1\u30A7\u30FC\u30F3\u3067\u78BA\u8A8D" }), (0, jsx_runtime_1.jsx)("div", { className: accentColor ? 'text-xs font-mono' : 'text-xs text-cyan-400/60 font-mono', style: accentColor ? { color: `rgba(${hexToRgb(accentColor)},0.6)` } : undefined, children: "\uB370\uC774\uD130\uB294 4\uC2DC\uAC04\uB9C8\uB2E4 \uAC31\uC2E0 \u00B7 \uC2E4\uC2DC\uAC04 \uB370\uC774\uD130\uB294 \uC628\uCCB4\uC778\uC5D0\uC11C \uD655\uC778" })] })] }));
|
|
62
65
|
}
|
|
@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
exports.MicrocosmEcosystemStats = MicrocosmEcosystemStats;
|
|
5
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
6
|
const auth_react_1 = require("@microcosmmoney/auth-react");
|
|
7
|
+
const i18n_context_1 = require("../../i18n-context");
|
|
7
8
|
/* Inline SVG icons (16x16, stroke-based) */
|
|
8
9
|
const IconUsersTotal = ({ stroke = '#22d3ee' }) => ((0, jsx_runtime_1.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: stroke, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [(0, jsx_runtime_1.jsx)("path", { d: "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }), (0, jsx_runtime_1.jsx)("circle", { cx: "9", cy: "7", r: "4" }), (0, jsx_runtime_1.jsx)("path", { d: "M22 21v-2a4 4 0 0 0-3-3.87" }), (0, jsx_runtime_1.jsx)("path", { d: "M16 3.13a4 4 0 0 1 0 7.75" })] }));
|
|
9
10
|
const IconActivity = ({ stroke = '#22d3ee' }) => ((0, jsx_runtime_1.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: stroke, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: (0, jsx_runtime_1.jsx)("path", { d: "M22 12h-4l-3 9L9 3l-3 9H2" }) }));
|
|
@@ -11,19 +12,20 @@ const IconHardHat = ({ stroke = '#22d3ee' }) => ((0, jsx_runtime_1.jsxs)("svg",
|
|
|
11
12
|
const IconMap = ({ stroke = '#22d3ee' }) => ((0, jsx_runtime_1.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: stroke, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [(0, jsx_runtime_1.jsx)("polygon", { points: "3 6 9 3 15 6 21 3 21 18 15 21 9 18 3 21" }), (0, jsx_runtime_1.jsx)("line", { x1: "9", x2: "9", y1: "3", y2: "18" }), (0, jsx_runtime_1.jsx)("line", { x1: "15", x2: "15", y1: "6", y2: "21" })] }));
|
|
12
13
|
const IconGlobe = ({ stroke = '#22d3ee' }) => ((0, jsx_runtime_1.jsxs)("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: stroke, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [(0, jsx_runtime_1.jsx)("circle", { cx: "12", cy: "12", r: "10" }), (0, jsx_runtime_1.jsx)("path", { d: "M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20" }), (0, jsx_runtime_1.jsx)("path", { d: "M2 12h20" })] }));
|
|
13
14
|
function MicrocosmEcosystemStats({ accentColor } = {}) {
|
|
15
|
+
const t = (0, i18n_context_1.useTranslations)('mccDashboard');
|
|
14
16
|
const { data: overview, loading: loadingOverview } = (0, auth_react_1.usePlatformStats)();
|
|
15
17
|
const { data: userLevels, loading: loadingUsers } = (0, auth_react_1.useDashboardUserStats)();
|
|
16
18
|
const loading = loadingOverview || loadingUsers;
|
|
17
19
|
const ac = accentColor || '#22d3ee';
|
|
18
20
|
const stats = [
|
|
19
|
-
{ label: 'total_users', value: overview?.total_users ?? userLevels?.total_users, icon: IconUsersTotal },
|
|
20
|
-
{ label: '24h_active', value: overview?.active_users_24h, icon: IconActivity },
|
|
21
|
-
{ label: 'miners', value: userLevels?.miners_and_above ?? overview?.miners_count, icon: IconHardHat },
|
|
22
|
-
{ label: 'territories', value: overview?.total_territories, icon: IconMap },
|
|
21
|
+
{ label: t('totalUsers', 'total_users'), value: overview?.total_users ?? userLevels?.total_users, icon: IconUsersTotal },
|
|
22
|
+
{ label: t('active24h', '24h_active'), value: overview?.active_users_24h, icon: IconActivity },
|
|
23
|
+
{ label: t('miners', 'miners'), value: userLevels?.miners_and_above ?? overview?.miners_count, icon: IconHardHat },
|
|
24
|
+
{ label: t('territories', 'territories'), value: overview?.total_territories, icon: IconMap },
|
|
23
25
|
];
|
|
24
26
|
const spinnerBorderColor = accentColor ? { borderColor: accentColor, borderTopColor: 'transparent' } : undefined;
|
|
25
27
|
const spinnerClass = accentColor ? 'inline-block w-5 h-5 border-2 rounded-full animate-spin' : 'inline-block w-5 h-5 border-2 border-cyan-400 border-t-transparent rounded-full animate-spin';
|
|
26
|
-
return ((0, jsx_runtime_1.jsx)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl blockchain-card h-full", children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-4", children: [(0, jsx_runtime_1.jsx)(IconGlobe, { stroke: ac }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#5EEAD4] text-xs font-mono tracking-widest uppercase", children:
|
|
28
|
+
return ((0, jsx_runtime_1.jsx)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl blockchain-card h-full", children: (0, jsx_runtime_1.jsxs)("div", { className: "p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-4", children: [(0, jsx_runtime_1.jsx)(IconGlobe, { stroke: ac }), (0, jsx_runtime_1.jsx)("span", { className: "text-[#5EEAD4] text-xs font-mono tracking-widest uppercase", children: t('ecosystem', 'ECOSYSTEM') })] }), loading ? ((0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-8", children: (0, jsx_runtime_1.jsx)("span", { className: spinnerClass, style: spinnerBorderColor }) })) : ((0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-2 gap-3", children: stats.map((s) => {
|
|
27
29
|
const Icon = s.icon;
|
|
28
30
|
return ((0, jsx_runtime_1.jsxs)("div", { className: "bg-white/5 border border-white/10 rounded-lg p-3 blockchain-sub-card", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 mb-1", children: [(0, jsx_runtime_1.jsx)(Icon, { stroke: ac }), (0, jsx_runtime_1.jsx)("span", { className: "text-[10px] text-[#5EEAD4] font-mono tracking-widest uppercase", children: s.label })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-xl font-bold font-mono text-white", children: s.value != null ? s.value.toLocaleString() : '--' })] }, s.label));
|
|
29
31
|
}) }))] }) }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export interface MicrocosmLockPeriodsProps {
|
|
2
2
|
accentColor?: string;
|
|
3
3
|
}
|
|
4
|
-
export declare function MicrocosmLockPeriods(
|
|
4
|
+
export declare function MicrocosmLockPeriods(_props?: MicrocosmLockPeriodsProps): import("react/jsx-runtime").JSX.Element | null;
|
|
@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
exports.MicrocosmLockPeriods = MicrocosmLockPeriods;
|
|
5
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
6
|
const auth_react_1 = require("@microcosmmoney/auth-react");
|
|
7
|
+
const i18n_context_1 = require("../../i18n-context");
|
|
7
8
|
function formatDateTime(dt) {
|
|
8
9
|
const d = new Date(dt);
|
|
9
10
|
return d.toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' });
|
|
@@ -17,12 +18,13 @@ function daysRemaining(endTime) {
|
|
|
17
18
|
const days = Math.ceil(diff / (1000 * 60 * 60 * 24));
|
|
18
19
|
return `${days}d`;
|
|
19
20
|
}
|
|
20
|
-
function MicrocosmLockPeriods(
|
|
21
|
+
function MicrocosmLockPeriods(_props = {}) {
|
|
22
|
+
const t = (0, i18n_context_1.useTranslations)('mccDashboard');
|
|
21
23
|
const { data } = (0, auth_react_1.useMCCLocks)();
|
|
22
24
|
const raw = data;
|
|
23
|
-
const
|
|
24
|
-
const activeLocks =
|
|
25
|
+
const lockPeriods = Array.isArray(raw) ? raw : raw?.locks ?? [];
|
|
26
|
+
const activeLocks = lockPeriods.filter((p) => p.status === 'locked');
|
|
25
27
|
if (activeLocks.length === 0)
|
|
26
28
|
return null;
|
|
27
|
-
return ((0, jsx_runtime_1.jsx)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl blockchain-card", children: (0, jsx_runtime_1.jsx)("div", { className: "p-6", children: (0, jsx_runtime_1.jsx)("div", { className: "space-y-3", children: activeLocks.map((lock) => ((0, jsx_runtime_1.jsxs)("div", { className: "bg-white/5 border border-white/10 rounded-lg p-4 blockchain-sub-card", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-start mb-2", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-[#5EEAD4] text-xs font-mono tracking-widest uppercase", children: lock.reason }), (0, jsx_runtime_1.jsxs)("div", { className:
|
|
29
|
+
return ((0, jsx_runtime_1.jsx)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl blockchain-card", children: (0, jsx_runtime_1.jsx)("div", { className: "p-3 sm:p-6", children: (0, jsx_runtime_1.jsx)("div", { className: "space-y-2 sm:space-y-3", children: activeLocks.map((lock) => ((0, jsx_runtime_1.jsxs)("div", { className: "bg-white/5 border border-white/10 rounded-lg p-2.5 sm:p-4 blockchain-sub-card", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-start mb-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "min-w-0 flex-1", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-[#5EEAD4] text-[10px] sm:text-xs font-mono tracking-widest uppercase truncate", children: lock.reason }), (0, jsx_runtime_1.jsxs)("div", { className: "text-base sm:text-xl font-bold font-mono text-cyan-400 mt-1", children: [(lock.amount ?? 0).toLocaleString(), " MCC"] })] }), (0, jsx_runtime_1.jsx)("span", { className: "px-2 py-0.5 bg-cyan-400/20 text-cyan-400 text-xs font-mono rounded", children: t('lockedStatus', 'LOCKED') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-500 space-y-1 font-mono", children: [(0, jsx_runtime_1.jsxs)("div", { children: [t('unlockAt', 'unlock_at'), ": ", formatDateTime(lock.lock_end)] }), (0, jsx_runtime_1.jsxs)("div", { children: [t('remaining', 'remaining'), ":", ' ', (0, jsx_runtime_1.jsx)("span", { className: "text-cyan-400", children: daysRemaining(lock.lock_end) })] })] })] }, lock.lock_id))) }) }) }));
|
|
28
30
|
}
|
|
@@ -4,39 +4,125 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
exports.MicrocosmMarketBar = MicrocosmMarketBar;
|
|
5
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
6
|
const auth_react_1 = require("@microcosmmoney/auth-react");
|
|
7
|
-
function formatCompact(value) {
|
|
8
|
-
if (value >= 1000000)
|
|
9
|
-
return `${(value / 1000000).toFixed(2)}M`;
|
|
10
|
-
if (value >= 1000)
|
|
11
|
-
return `${(value / 1000).toFixed(1)}K`;
|
|
12
|
-
return value.toFixed(2);
|
|
13
|
-
}
|
|
14
7
|
function MicrocosmMarketBar({ accentColor } = {}) {
|
|
15
8
|
const { data, loading } = (0, auth_react_1.useMarketData)();
|
|
16
|
-
const
|
|
9
|
+
const { data: mccPriceData } = (0, auth_react_1.useMCCPrice)();
|
|
10
|
+
const { data: ecosystemOps } = (0, auth_react_1.useEcosystemOperations)();
|
|
17
11
|
if (loading || !data) {
|
|
18
|
-
return ((0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-2
|
|
12
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-3 mb-6", children: [(0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-2 xs:grid-cols-3 lg:grid-cols-6 gap-2 sm:gap-3", children: Array.from({ length: 6 }).map((_, i) => ((0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl blockchain-card p-2.5 sm:p-4 animate-pulse", children: [(0, jsx_runtime_1.jsx)("div", { className: "h-3 bg-neutral-800 rounded w-16 mb-2" }), (0, jsx_runtime_1.jsx)("div", { className: "h-5 sm:h-6 bg-neutral-800 rounded w-20 sm:w-24" })] }, i))) }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-2 xs:grid-cols-3 lg:grid-cols-6 gap-2 sm:gap-3", children: Array.from({ length: 6 }).map((_, i) => ((0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl blockchain-card p-2.5 sm:p-4 animate-pulse", children: [(0, jsx_runtime_1.jsx)("div", { className: "h-3 bg-neutral-800 rounded w-16 mb-2" }), (0, jsx_runtime_1.jsx)("div", { className: "h-5 sm:h-6 bg-neutral-800 rounded w-20 sm:w-24" })] }, i))) })] }));
|
|
19
13
|
}
|
|
14
|
+
const displayPrice = mccPriceData?.price ?? data.price_usd ?? 0;
|
|
20
15
|
const priceChange24h = data.price_change_24h ?? 0;
|
|
21
16
|
const isPositive = priceChange24h >= 0;
|
|
17
|
+
const basePrice = mccPriceData?.base_price ?? mccPriceData?.price_usd ?? 0;
|
|
18
|
+
const miningPrice = basePrice > 0 ? basePrice * 4 : 0;
|
|
19
|
+
const epoch = ecosystemOps?.epoch;
|
|
20
|
+
const buyback = ecosystemOps?.buyback;
|
|
21
|
+
const epochYield = epoch?.epoch_yield ?? 0;
|
|
22
|
+
const epochMinted = epoch?.epoch_minted ?? 0;
|
|
23
|
+
const epochRemaining = epochYield > epochMinted ? epochYield - epochMinted : 0;
|
|
24
|
+
const miningVault = epoch?.mining_vault_mcc ?? 0;
|
|
25
|
+
const buybackPoolUsd = buyback?.pool_usd_balance ?? null;
|
|
22
26
|
const buys = data.buys_24h ?? 0;
|
|
23
27
|
const sells = data.sells_24h ?? 0;
|
|
24
|
-
const
|
|
25
|
-
const stats = [
|
|
28
|
+
const marketStats = [
|
|
26
29
|
{
|
|
27
30
|
label: 'MCC_PRICE',
|
|
28
|
-
value: `$${
|
|
31
|
+
value: `$${displayPrice.toFixed(4)}`,
|
|
29
32
|
sub: `${isPositive ? '~+' : '~'}${priceChange24h.toFixed(2)}%`,
|
|
30
|
-
subColor: isPositive ?
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
33
|
+
subColor: isPositive ? 'text-cyan-400' : 'text-red-400',
|
|
34
|
+
color: 'text-cyan-400',
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
label: 'MINING_PRICE',
|
|
38
|
+
value: miningPrice > 0 ? `$${miningPrice.toFixed(4)}` : '--',
|
|
39
|
+
sub: basePrice > 0 ? `base: $${basePrice.toFixed(4)}` : '',
|
|
40
|
+
subColor: 'text-neutral-500',
|
|
41
|
+
color: 'text-cyan-300',
|
|
42
|
+
},
|
|
43
|
+
{
|
|
44
|
+
label: '24H_VOLUME',
|
|
45
|
+
value: `$${formatCompact(data.volume_24h ?? 0)}`,
|
|
46
|
+
color: 'text-white',
|
|
47
|
+
},
|
|
48
|
+
{
|
|
49
|
+
label: 'LIQUIDITY',
|
|
50
|
+
value: (data.liquidity_usd ?? 0) > 0 ? `$${formatCompact(data.liquidity_usd)}` : '-',
|
|
51
|
+
color: 'text-white',
|
|
52
|
+
},
|
|
53
|
+
{
|
|
54
|
+
label: 'FDV',
|
|
55
|
+
value: (data.fdv ?? 0) > 0 ? `$${formatCompact(data.fdv)}` : '-',
|
|
56
|
+
color: 'text-white',
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
label: 'BUY/SELL',
|
|
60
|
+
value: `${buys}/${sells}`,
|
|
61
|
+
sub: `${buys + sells} trades`,
|
|
62
|
+
subColor: 'text-neutral-500',
|
|
63
|
+
color: 'text-white',
|
|
64
|
+
},
|
|
65
|
+
];
|
|
66
|
+
const protocolStats = [
|
|
67
|
+
{
|
|
68
|
+
label: 'EPOCH',
|
|
69
|
+
value: epoch ? `#${epoch.current_epoch}` : '--',
|
|
70
|
+
sub: '2140 Protocol',
|
|
71
|
+
subColor: 'text-neutral-500',
|
|
72
|
+
color: 'text-cyan-400',
|
|
73
|
+
},
|
|
74
|
+
{
|
|
75
|
+
label: 'EPOCH_YIELD',
|
|
76
|
+
value: epochYield > 0 ? formatMCC(epochYield) : '--',
|
|
77
|
+
sub: 'MCC / epoch',
|
|
78
|
+
subColor: 'text-neutral-500',
|
|
79
|
+
color: 'text-white',
|
|
80
|
+
},
|
|
81
|
+
{
|
|
82
|
+
label: 'EPOCH_MINTED',
|
|
83
|
+
value: epochMinted > 0 ? formatMCC(epochMinted) : '0',
|
|
84
|
+
sub: epochYield > 0 ? `${((epochMinted / epochYield) * 100).toFixed(1)}% used` : '',
|
|
85
|
+
subColor: 'text-neutral-500',
|
|
86
|
+
color: 'text-cyan-300',
|
|
87
|
+
},
|
|
88
|
+
{
|
|
89
|
+
label: 'REMAINING',
|
|
90
|
+
value: formatMCC(epochRemaining),
|
|
91
|
+
sub: 'this epoch',
|
|
92
|
+
subColor: 'text-neutral-500',
|
|
93
|
+
color: 'text-white',
|
|
94
|
+
},
|
|
95
|
+
{
|
|
96
|
+
label: 'MINING_VAULT',
|
|
97
|
+
value: miningVault > 0 ? formatCompact(miningVault) : '--',
|
|
98
|
+
sub: 'MCC reserve',
|
|
99
|
+
subColor: 'text-neutral-500',
|
|
100
|
+
color: 'text-white',
|
|
101
|
+
},
|
|
102
|
+
{
|
|
103
|
+
label: 'POOL_BALANCE',
|
|
104
|
+
value: buybackPoolUsd != null ? `$${formatCompact(buybackPoolUsd)}` : '--',
|
|
105
|
+
sub: 'USDC+USDT',
|
|
106
|
+
subColor: 'text-neutral-500',
|
|
107
|
+
color: 'text-white',
|
|
108
|
+
},
|
|
40
109
|
];
|
|
41
|
-
return ((0, jsx_runtime_1.
|
|
110
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-2 sm:space-y-3 mb-4 sm:mb-6", children: [(0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-2 xs:grid-cols-3 lg:grid-cols-6 gap-2 sm:gap-3", children: marketStats.map((stat) => ((0, jsx_runtime_1.jsx)(StatCard, { ...stat }, stat.label))) }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-2 xs:grid-cols-3 lg:grid-cols-6 gap-2 sm:gap-3", children: protocolStats.map((stat) => ((0, jsx_runtime_1.jsx)(StatCard, { ...stat }, stat.label))) })] }));
|
|
111
|
+
}
|
|
112
|
+
function StatCard({ label, value, sub, subColor, color }) {
|
|
113
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: "backdrop-blur-md bg-white/5 border border-white/10 rounded-xl blockchain-card p-2.5 sm:p-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-[#5EEAD4] text-[9px] sm:text-[10px] font-mono mb-0.5 sm:mb-1 tracking-widest uppercase", children: label }), (0, jsx_runtime_1.jsx)("div", { className: `text-sm xs:text-base sm:text-xl font-bold font-mono truncate ${color}`, children: value }), sub && ((0, jsx_runtime_1.jsx)("div", { className: `text-[10px] sm:text-xs font-mono mt-0.5 truncate ${subColor || 'text-neutral-500'}`, children: sub }))] }));
|
|
114
|
+
}
|
|
115
|
+
function formatCompact(value) {
|
|
116
|
+
if (value >= 1000000)
|
|
117
|
+
return `${(value / 1000000).toFixed(2)}M`;
|
|
118
|
+
if (value >= 1000)
|
|
119
|
+
return `${(value / 1000).toFixed(1)}K`;
|
|
120
|
+
return value.toFixed(2);
|
|
121
|
+
}
|
|
122
|
+
function formatMCC(value) {
|
|
123
|
+
if (value >= 1000000)
|
|
124
|
+
return `${(value / 1000000).toFixed(2)}M`;
|
|
125
|
+
if (value >= 1000)
|
|
126
|
+
return `${(value / 1000).toFixed(2)}K`;
|
|
127
|
+
return value.toFixed(2);
|
|
42
128
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export interface MicrocosmMCCTokenStatsProps {
|
|
2
2
|
accentColor?: string;
|
|
3
3
|
}
|
|
4
|
-
export declare function MicrocosmMCCTokenStats(
|
|
4
|
+
export declare function MicrocosmMCCTokenStats(_props?: MicrocosmMCCTokenStatsProps): import("react/jsx-runtime").JSX.Element;
|