@microcosmmoney/portal-react 3.12.8 → 3.13.1

package/dist/main-portal/components/mining/MiningPage.js

@@ -0,0 +1,237 @@
+"use strict";
+// AI-generated · AI-managed · AI-maintained
+"use client";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = MCCMiningPage;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const react_1 = require("react");
+const navigation_1 = require("next/navigation");
+const lucide_react_1 = require("lucide-react");
+const card_1 = require("../ui/card");
+const badge_1 = require("../ui/badge");
+const button_1 = require("../ui/button");
+const useAuth_1 = require("../../hooks/useAuth");
+const WalletContext_1 = require("../../contexts/WalletContext");
+const wallet_adapter_react_1 = require("@solana/wallet-adapter-react");
+const wallet_adapter_react_ui_1 = require("@solana/wallet-adapter-react-ui");
+const api_1 = require("../../lib/api");
+const blockchain_1 = require("../../lib/api/blockchain");
+const MiningModal_1 = __importDefault(require("./MiningModal"));
+const utils_1 = require("../../lib/utils");
+const time_remaining_1 = require("../ui/time-remaining");
+const next_intl_1 = require("next-intl");
+const MCCPriceContext_1 = require("../../contexts/MCCPriceContext");
+const PriceChart_1 = require("../data/charts/PriceChart");
+const formatNumber = (num, decimals = 2) => {
+    const parsedNum = parseFloat(String(num));
+    return isNaN(parsedNum) ? "0.00" : parsedNum.toFixed(decimals);
+};
+const formatLargeNumber = (num, decimals = 2) => {
+    if (num === undefined || num === null || isNaN(num))
+        return "0.00";
+    return num.toLocaleString("en-US", { minimumFractionDigits: decimals, maximumFractionDigits: decimals });
+};
+function MCCMiningPage() {
+    const t = (0, next_intl_1.useTranslations)('miningDash');
+    const router = (0, navigation_1.useRouter)();
+    const ticker = (0, MCCPriceContext_1.useMCCPrice)();
+    const [userDetails, setUserDetails] = (0, react_1.useState)(null);
+    const [showMiningModal, setShowMiningModal] = (0, react_1.useState)(false);
+    const [ratioInfo, setRatioInfo] = (0, react_1.useState)(null);
+    const [ratioLoading, setRatioLoading] = (0, react_1.useState)(false);
+    const [ratioError, setRatioError] = (0, react_1.useState)("");
+    const [x402History, setX402History] = (0, react_1.useState)([]);
+    const [x402Loading, setX402Loading] = (0, react_1.useState)(false);
+    const [x402Page, setX402Page] = (0, react_1.useState)(0);
+    const [x402Total, setX402Total] = (0, react_1.useState)(0);
+    const [historyExpanded, setHistoryExpanded] = (0, react_1.useState)(false);
+    const [poolData, setPoolData] = (0, react_1.useState)(null);
+    const [poolLoading, setPoolLoading] = (0, react_1.useState)(false);
+    const X402_PAGE_SIZE = 3;
+    const [walletBalances, setWalletBalances] = (0, react_1.useState)([]);
+    const [walletsLoading, setWalletsLoading] = (0, react_1.useState)(false);
+    const [walletsExpanded, setWalletsExpanded] = (0, react_1.useState)(false);
+    const { refreshPDABalance } = (0, WalletContext_1.useWallet)();
+    const { connected, publicKey } = (0, wallet_adapter_react_1.useWallet)();
+    const { user: authUser, userInfo, loading: authLoading } = (0, useAuth_1.useAuth)();
+    // 直接从 useAuth 缓存获取 userDetails，不再重复调用 API
+    // 用 uid 做稳定性守卫：uid 不变时不重建 userDetails，避免后台刷新触发连锁重载
+    const prevUidRef = React.useRef(null);
+    (0, react_1.useEffect)(() => {
+        if (authLoading)
+            return;
+        if (!authUser) {
+            router.push("/login");
+            return;
+        }
+        if (userInfo && userInfo.uid !== prevUidRef.current) {
+            prevUidRef.current = userInfo.uid;
+            setUserDetails({
+                uid: userInfo.uid,
+                unit_level: userInfo.unit_level ?? undefined,
+                source_project_id: userInfo.source_project_id ?? undefined
+            });
+        }
+    }, [authUser, userInfo, authLoading, router]);
+    // 4 个数据加载全部并行 — 仅首次加载，手动刷新走 refreshAll()
+    const dataLoadedRef = React.useRef(false);
+    (0, react_1.useEffect)(() => {
+        if (userDetails && !dataLoadedRef.current) {
+            dataLoadedRef.current = true;
+            Promise.all([
+                loadRatioInfo(),
+                loadX402History(),
+                loadWalletBalances(),
+                loadPoolData()
+            ]);
+        }
+    }, [userDetails]);
+    const loadRatioInfo = async () => {
+        setRatioLoading(true);
+        setRatioError("");
+        try {
+            const response = await (0, api_1.getMiningRatio)();
+            if (response.success && response.data) {
+                setRatioInfo(response.data);
+            }
+            else {
+                setRatioError(response.error || t('getMintInfoFailed'));
+            }
+        }
+        catch (err) {
+            console.error("Failed to load mining ratio:", err);
+            setRatioError(err instanceof Error ? err.message : t('getMintInfoFailed'));
+        }
+        finally {
+            setRatioLoading(false);
+        }
+    };
+    const loadX402History = async (page = x402Page) => {
+        setX402Loading(true);
+        try {
+            const response = await (0, api_1.getX402MiningHistory)(X402_PAGE_SIZE, page * X402_PAGE_SIZE);
+            if (response.success && response.data) {
+                setX402History(response.data.records || []);
+                setX402Total(response.data.total || 0);
+            }
+        }
+        catch (err) {
+            console.error("Failed to load x402 history:", err);
+        }
+        finally {
+            setX402Loading(false);
+        }
+    };
+    const loadWalletBalances = async () => {
+        setWalletsLoading(true);
+        try {
+            const listRes = await (0, api_1.fetchApi)('/auth/wallet/list');
+            if (!listRes.success || !listRes.data?.wallets) {
+                setWalletsLoading(false);
+                return;
+            }
+            const wallets = listRes.data.wallets;
+            if (wallets.length === 0) {
+                setWalletsLoading(false);
+                return;
+            }
+            const initial = wallets.map(w => ({
+                address: w.wallet_address,
+                is_primary: w.is_primary,
+                mcc_balance: 0,
+                loading: true
+            }));
+            setWalletBalances(initial);
+            setWalletsLoading(false);
+            const results = await Promise.allSettled(wallets.map(w => (0, blockchain_1.getMCCBalance)(w.wallet_address)));
+            setWalletBalances(prev => prev.map((w, i) => {
+                const result = results[i];
+                const bal = result.status === 'fulfilled' && result.value ? result.value.balance : 0;
+                return { ...w, mcc_balance: bal, loading: false };
+            }));
+        }
+        catch (err) {
+            console.error("Failed to load wallet balances:", err);
+            setWalletsLoading(false);
+        }
+    };
+    const loadPoolData = async () => {
+        setPoolLoading(true);
+        try {
+            const data = await (0, blockchain_1.getPoolStatus)(true);
+            if (data)
+                setPoolData(data);
+        }
+        catch (err) {
+            console.error("Failed to load pool data:", err);
+        }
+        finally {
+            setPoolLoading(false);
+        }
+    };
+    const refreshAll = () => {
+        loadRatioInfo();
+        loadX402History();
+        loadWalletBalances();
+        loadPoolData();
+    };
+    const isLoading = !userDetails || ratioLoading;
+    if (isLoading) {
+        return ((0, jsx_runtime_1.jsxs)("div", { className: "max-w-7xl mx-auto px-3 py-4 space-y-3 xs:px-4 xs:space-y-4 sm:px-6 sm:py-6 sm:space-y-6", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-lg sm:text-2xl font-bold text-white tracking-wider", children: t('title') }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs sm:text-sm text-neutral-400 mt-1", children: t('subtitle') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-center py-12", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-6 h-6 animate-spin text-neutral-400 mr-3" }), (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400 text-sm", children: t('loadingMintData') })] })] }));
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "max-w-7xl mx-auto px-3 py-4 space-y-3 xs:px-4 xs:space-y-4 sm:px-6 sm:py-6 sm:space-y-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "min-w-0", children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-lg sm:text-2xl font-bold text-white tracking-wider", children: t('title') }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs sm:text-sm text-neutral-400 mt-1", children: t('subtitle') })] }), (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "outline", size: "sm", onClick: refreshAll, disabled: ratioLoading, className: "border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.RefreshCw, { className: (0, utils_1.cn)("w-4 h-4 mr-2", ratioLoading && "animate-spin") }), t('refresh')] })] }), !connected && ((0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-neutral-900 border-neutral-700 hover:border-cyan-400/50 dash-card", children: (0, jsx_runtime_1.jsx)(card_1.CardContent, { className: "p-3 sm:p-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col xs:flex-row items-start xs:items-center justify-between gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 sm:gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Link2, { className: "w-5 h-5 text-neutral-400 shrink-0" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs sm:text-sm font-medium text-white", children: t('connectWalletFirst') }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] sm:text-xs text-neutral-500", children: t('connectWalletDesc') })] })] }), (0, jsx_runtime_1.jsx)(wallet_adapter_react_ui_1.WalletMultiButton, { style: { backgroundColor: '#0e7490' }, className: "!h-9 !rounded-md !text-sm !text-white" })] }) }) })), connected && ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3 px-4 py-2 bg-neutral-800 rounded-lg", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Link2, { className: "w-4 h-4 text-neutral-400" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-xs text-neutral-400", children: [t('connected'), " ", (0, jsx_runtime_1.jsxs)("span", { className: "text-white font-mono", children: [publicKey?.toBase58().slice(0, 8), "...", publicKey?.toBase58().slice(-6)] })] }), (0, jsx_runtime_1.jsx)(wallet_adapter_react_ui_1.WalletMultiButton, { style: { backgroundColor: 'transparent' }, className: "!h-7 !rounded !text-xs !text-neutral-400 !px-2 !py-0 !border !border-neutral-700 ml-auto" })] })), ratioError && ((0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-neutral-900 border-neutral-700 dash-card", children: (0, jsx_runtime_1.jsx)(card_1.CardContent, { className: "p-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 text-red-400", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertCircle, { className: "w-4 h-4" }), (0, jsx_runtime_1.jsx)("span", { children: ratioError })] }) }) })), (0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-neutral-900 border-neutral-700 hover:border-cyan-400/50 dash-card", children: (0, jsx_runtime_1.jsxs)(card_1.CardContent, { className: "p-3 sm:p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col md:flex-row md:items-center md:justify-between gap-3 sm:gap-6 mb-4 sm:mb-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "space-y-2 sm:space-y-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 sm:gap-3 flex-wrap", children: [(0, jsx_runtime_1.jsx)(badge_1.Badge, { className: "bg-white/20 text-white border-transparent text-[10px] sm:text-xs", children: t('x402Protocol') }), (0, jsx_runtime_1.jsx)(badge_1.Badge, { className: "bg-cyan-400/20 text-cyan-400 border-transparent text-[10px] sm:text-xs", children: "Solana Mainnet" })] }), (ticker.basePrice || ratioInfo) && ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-[10px] sm:text-xs text-neutral-400 tracking-wider mb-1", children: t('mintPrice') }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-baseline gap-2 flex-wrap", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-xl sm:text-3xl font-bold text-white font-mono", children: ["1 MCC \u2248 ", formatNumber((ticker.basePrice ?? ratioInfo?.usdc_per_mcc ?? 0) * 4, 4), " USD"] }), (0, jsx_runtime_1.jsx)(badge_1.Badge, { className: "bg-cyan-400/20 text-cyan-400 border-transparent text-[10px] sm:text-sm", children: t('techBonus') })] })] })), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-3 sm:gap-4 text-[10px] sm:text-xs text-neutral-500", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Shield, { className: "w-3 h-3 sm:w-3.5 sm:h-3.5 text-neutral-500 shrink-0" }), (0, jsx_runtime_1.jsx)("span", { children: t('stablecoinDirectDesc') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Zap, { className: "w-3 h-3 sm:w-3.5 sm:h-3.5 text-neutral-500 shrink-0" }), (0, jsx_runtime_1.jsx)("span", { children: t('instantMintDesc') })] })] })] }), (0, jsx_runtime_1.jsxs)(button_1.Button, { onClick: () => setShowMiningModal(true), size: "lg", className: "px-6 py-3 sm:px-8 sm:py-4 text-sm sm:text-base font-medium bg-cyan-700 hover:bg-cyan-600 text-white whitespace-nowrap flex-shrink-0", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Zap, { className: "w-4 h-4 sm:w-5 sm:h-5 mr-2" }), t('startMinting')] })] }), ratioInfo && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "border-t border-neutral-700 pt-3 sm:pt-4 mb-3 sm:mb-4", children: (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] sm:text-xs text-neutral-400 tracking-wider uppercase mb-2 sm:mb-3", children: t('mintStats') }) }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-2 sm:gap-4 mb-3 sm:mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-2 sm:p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 sm:gap-2 mb-1 sm:mb-2", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.TrendingUp, { className: "w-3.5 h-3.5 sm:w-4 sm:h-4 text-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-[10px] sm:text-xs text-neutral-400 tracking-wider", children: t('basePrice') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-base sm:text-2xl font-bold text-white font-mono", children: ["$", formatNumber(ticker.basePrice ?? ratioInfo.usdc_per_mcc, 4)] }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] sm:text-xs text-neutral-500 mt-1 hidden xs:block", children: t('basePriceNote') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-2 sm:p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 sm:gap-2 mb-1 sm:mb-2", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Coins, { className: "w-3.5 h-3.5 sm:w-4 sm:h-4 text-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-[10px] sm:text-xs text-neutral-400 tracking-wider", children: t('marketPrice') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-base sm:text-2xl font-bold text-white font-mono", children: ["$", ticker.price ? formatNumber(ticker.price, 4) : '...'] }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] sm:text-xs text-neutral-500 mt-1 hidden xs:block", children: t('marketPriceNote') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-2 sm:p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-1.5 sm:gap-2 mb-1 sm:mb-2", children: (0, jsx_runtime_1.jsx)("span", { className: "text-[10px] sm:text-xs text-neutral-400 tracking-wider", children: t('totalMinted') }) }), (0, jsx_runtime_1.jsx)("div", { className: "text-base sm:text-2xl font-bold text-white font-mono truncate", children: formatLargeNumber(ratioInfo.total_minted) }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] sm:text-xs text-neutral-500 mt-1 hidden xs:block", children: t('totalMintedNote') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-2 sm:p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-1.5 sm:gap-2 mb-1 sm:mb-2", children: (0, jsx_runtime_1.jsx)("span", { className: "text-[10px] sm:text-xs text-neutral-400 tracking-wider", children: t('currentPhase') }) }), (0, jsx_runtime_1.jsxs)("div", { className: "text-base sm:text-2xl font-bold text-white font-mono", children: ["Phase ", ratioInfo.current_stage] }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] sm:text-xs text-neutral-500 mt-1 hidden xs:block", children: t('phaseNote') })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-1", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: t('halvingRemaining', { amount: formatLargeNumber(100000000 - (ratioInfo.total_minted % 100000000), 0) }) }), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-800 rounded-full h-2 overflow-hidden", children: (0, jsx_runtime_1.jsx)("div", { className: "h-2 rounded-full bg-cyan-400 transition-all", style: { width: `${((ratioInfo.total_minted % 100000000) / 100000000) * 100}%` } }) })] })] }))] }) }), (0, jsx_runtime_1.jsx)(PriceChart_1.PriceChart, {}), (0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-neutral-900 border-neutral-700 hover:border-cyan-400/50 dash-card", children: (0, jsx_runtime_1.jsxs)(card_1.CardContent, { className: "p-3 sm:p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-3 gap-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 sm:gap-3 min-w-0", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Wallet, { className: "w-4 h-4 text-white shrink-0" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs sm:text-sm text-neutral-300 tracking-wider font-medium", children: t('onChainBalance') }), walletBalances.length > 0 && walletBalances.every(w => !w.loading) && ((0, jsx_runtime_1.jsxs)(badge_1.Badge, { className: "bg-white/20 text-white border-transparent", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.CheckCircle2, { className: "w-3 h-3 mr-1 inline" }), walletBalances.length, " ", t('walletsCount')] }))] }), (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "outline", size: "sm", onClick: loadWalletBalances, disabled: walletsLoading, className: "border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.RefreshCw, { className: (0, utils_1.cn)("w-4 h-4 mr-2", walletsLoading && "animate-spin") }), t('refresh')] })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-neutral-500 text-xs mb-4", children: t('onChainBalanceDesc') }), walletsLoading && walletBalances.length === 0 ? ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-center py-8", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-5 h-5 animate-spin text-neutral-400 mr-2" }), (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400 text-sm", children: t('loadingOnChainBalance') })] })) : walletBalances.length === 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "text-center py-8 text-neutral-500 text-sm", children: t('noWalletBound') })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 xs:grid-cols-2 gap-2 sm:gap-4 mb-3 sm:mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-2 sm:p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-[10px] sm:text-xs text-neutral-400 tracking-wider mb-1 font-mono", children: t('totalOnChainBalance') }), (0, jsx_runtime_1.jsx)("div", { className: "text-base sm:text-2xl font-bold font-mono text-white", children: walletBalances.some(w => w.loading)
+                                                        ? (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-5 h-5 animate-spin" })
+                                                        : formatLargeNumber(walletBalances.reduce((sum, w) => sum + w.mcc_balance, 0)) }), (0, jsx_runtime_1.jsxs)("div", { className: "text-neutral-500 text-xs mt-1", children: ["MCC \u00B7 ", walletBalances.length, " ", t('walletsTotal')] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-2 sm:p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-[10px] sm:text-xs text-neutral-400 tracking-wider mb-1 font-mono", children: t('primaryWalletBalance') }), (0, jsx_runtime_1.jsx)("div", { className: "text-base sm:text-2xl font-bold font-mono text-white", children: (() => {
+                                                        const primary = walletBalances.find(w => w.is_primary);
+                                                        if (!primary)
+                                                            return '—';
+                                                        if (primary.loading)
+                                                            return (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-5 h-5 animate-spin" });
+                                                        return formatLargeNumber(primary.mcc_balance);
+                                                    })() }), (0, jsx_runtime_1.jsx)("div", { className: "text-neutral-500 text-xs mt-1 truncate", children: walletBalances.find(w => w.is_primary)?.address
+                                                        ? `${walletBalances.find(w => w.is_primary).address.slice(0, 6)}...${walletBalances.find(w => w.is_primary).address.slice(-4)}`
+                                                        : t('noPrimaryWallet') })] })] }), (0, jsx_runtime_1.jsxs)("button", { onClick: () => setWalletsExpanded(!walletsExpanded), className: "flex items-center gap-2 text-xs text-neutral-400 hover:text-cyan-400 transition-colors mb-2", children: [walletsExpanded ? (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronUp, { className: "w-3 h-3" }) : (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "w-3 h-3" }), walletsExpanded ? t('collapse') : t('expand'), " (", walletBalances.length, ")"] }), walletsExpanded && ((0, jsx_runtime_1.jsx)("div", { className: "space-y-2", children: walletBalances.map((w) => ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between px-3 p-2 bg-neutral-800 rounded hover:bg-neutral-700 text-xs", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 min-w-0", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Wallet, { className: "w-3 h-3 text-neutral-500 flex-shrink-0" }), (0, jsx_runtime_1.jsxs)("a", { href: `https://solscan.io/account/${w.address}`, target: "_blank", rel: "noopener noreferrer", className: "text-neutral-300 hover:text-white truncate font-mono", children: [w.address.slice(0, 8), "...", w.address.slice(-6)] }), w.is_primary && ((0, jsx_runtime_1.jsx)("span", { className: "px-1.5 py-0.5 bg-cyan-400/20 text-cyan-400 rounded text-[10px] flex-shrink-0", children: t('primaryLabel') }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 flex-shrink-0 ml-4", children: [w.loading
+                                                        ? (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-3 h-3 animate-spin text-neutral-500" })
+                                                        : (0, jsx_runtime_1.jsxs)("span", { className: "text-white font-mono font-medium", children: [formatLargeNumber(w.mcc_balance), " MCC"] }), (0, jsx_runtime_1.jsx)("a", { href: `https://solscan.io/account/${w.address}`, target: "_blank", rel: "noopener noreferrer", className: "text-neutral-600 hover:text-neutral-400", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { className: "w-3 h-3" }) })] })] }, w.address))) }))] }))] }) }), (0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-neutral-900 border-neutral-700 hover:border-cyan-400/50 dash-card", children: (0, jsx_runtime_1.jsxs)(card_1.CardContent, { className: "p-3 sm:p-6", children: [(0, jsx_runtime_1.jsxs)("button", { onClick: () => setHistoryExpanded(!historyExpanded), className: "w-full flex items-center justify-between group gap-2", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 sm:gap-3 min-w-0", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.History, { className: "w-4 h-4 text-white shrink-0" }), (0, jsx_runtime_1.jsx)("span", { className: "text-xs sm:text-sm text-neutral-300 tracking-wider font-medium", children: t('mintRecords') }), x402Total > 0 && ((0, jsx_runtime_1.jsxs)(badge_1.Badge, { className: "bg-neutral-500/20 text-neutral-300 border-transparent", children: [x402Total, " ", t('records')] }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 sm:gap-3 shrink-0", children: [x402Total > 0 && x402History.length > 0 && !historyExpanded && ((0, jsx_runtime_1.jsxs)("span", { className: "text-[10px] sm:text-xs text-neutral-500 hidden xs:inline", children: ["\u6700\u8FD1\u94F8\u9020: ", (0, jsx_runtime_1.jsx)(time_remaining_1.FormattedDateTime, { dateTime: x402History[0].created_at, className: "text-neutral-400" })] })), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-1 text-xs text-neutral-400 group-hover:text-cyan-400 transition-colors", children: historyExpanded ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [t('collapse'), " ", (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronUp, { className: "w-3.5 h-3.5" })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [t('expand'), " ", (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "w-3.5 h-3.5" })] })) })] })] }), historyExpanded && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-4 pt-4 border-t border-neutral-700", children: [(0, jsx_runtime_1.jsxs)("p", { className: "text-neutral-500 text-xs mb-4", children: ["\u60A8\u7684\u6240\u6709 x402 \u975E\u6258\u7BA1\u94F8\u9020\u4EA4\u6613\u8BB0\u5F55 \u00B7 \u7B2C ", x402Page + 1, "/", Math.max(1, Math.ceil(x402Total / X402_PAGE_SIZE)), " \u9875"] }), x402Loading ? ((0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-8", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-6 h-6 animate-spin text-neutral-400" }) })) : x402History.length === 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "text-center py-8 text-neutral-500 text-sm", children: t('noMintRecords') })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "space-y-3", children: x402History.map((record) => ((0, jsx_runtime_1.jsxs)("div", { className: "rounded-lg bg-neutral-800 p-2.5 sm:p-4 hover:bg-neutral-700 transition-colors", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-start justify-between mb-3", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mb-1", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-sm font-medium text-white font-mono", children: ["#", record.id] }), (0, jsx_runtime_1.jsx)(badge_1.Badge, { className: record.status === "completed" ? "bg-white/20 text-white border-transparent" : "bg-cyan-400/20 text-cyan-400 border-transparent", children: record.status === "completed" ? t('completed') : record.status })] }), (0, jsx_runtime_1.jsx)(time_remaining_1.FormattedDateTime, { dateTime: record.created_at, className: "text-xs text-neutral-500" })] }), (0, jsx_runtime_1.jsxs)("a", { href: `https://solscan.io/tx/${record.tx_signature}`, target: "_blank", rel: "noopener noreferrer", className: "inline-flex items-center gap-1 text-xs text-neutral-400 hover:text-cyan-400 hover:underline", children: ["Explorer ", (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { className: "w-3 h-3" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 gap-3 text-xs", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-neutral-400 mb-1", children: [record.payment_type || 'USDC', " ", t('payment')] }), (0, jsx_runtime_1.jsx)("div", { className: "text-white font-bold font-mono", children: ((record.stablecoin_amount || record.usdc_amount || 0) / 1000000).toFixed(2) })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-neutral-400 mb-1", children: t('earnedMcc') }), (0, jsx_runtime_1.jsxs)("div", { className: "text-white font-bold font-mono", children: ["+", (Math.abs(record.distribution?.user ?? 0) / 1000000000).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 6 })] })] })] })] }, record.id))) }), x402Total > X402_PAGE_SIZE && ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mt-4 pt-3 border-t border-neutral-700", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outline", size: "sm", onClick: () => { const p = x402Page - 1; setX402Page(p); loadX402History(p); }, disabled: x402Page === 0 || x402Loading, className: "border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent", children: t('prevPage') }), (0, jsx_runtime_1.jsxs)("span", { className: "text-xs text-neutral-500 font-mono", children: [x402Page + 1, " / ", Math.ceil(x402Total / X402_PAGE_SIZE)] }), (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outline", size: "sm", onClick: () => { const p = x402Page + 1; setX402Page(p); loadX402History(p); }, disabled: (x402Page + 1) * X402_PAGE_SIZE >= x402Total || x402Loading, className: "border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent", children: t('nextPage') })] }))] }))] }))] }) }), (0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-neutral-900 border-neutral-700 hover:border-cyan-400/50 dash-card", children: (0, jsx_runtime_1.jsx)(card_1.CardContent, { className: "p-3 sm:p-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-2 text-neutral-400 text-xs sm:text-sm", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Shield, { className: "w-4 h-4 text-white mt-0.5 flex-shrink-0" }), (0, jsx_runtime_1.jsx)("span", { children: t('securityNote') })] }) }) }), (0, jsx_runtime_1.jsx)(MiningModal_1.default, { isOpen: showMiningModal, onClose: () => setShowMiningModal(false), userDetails: userDetails, onSuccess: () => {
+                    loadRatioInfo();
+                    loadX402History();
+                    refreshPDABalance();
+                } })] }));
+}

package/dist/main-portal/components/mining/index.d.ts

@@ -0,0 +1 @@
+export { MiningDistributionHistory } from './MiningDistributionHistory';

package/dist/main-portal/components/mining/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MiningDistributionHistory = void 0;
+// AI-generated · AI-managed · AI-maintained
+var MiningDistributionHistory_1 = require("./MiningDistributionHistory");
+Object.defineProperty(exports, "MiningDistributionHistory", { enumerable: true, get: function () { return MiningDistributionHistory_1.MiningDistributionHistory; } });

package/dist/main-portal/components/notifications/NotificationsPage.d.ts

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

package/dist/main-portal/components/notifications/NotificationsPage.js

@@ -0,0 +1,13 @@
+"use strict";
+// AI-generated · AI-managed · AI-maintained
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = NotificationsPage;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const lucide_react_1 = require("lucide-react");
+const card_1 = require("../ui/card");
+const next_intl_1 = require("next-intl");
+function NotificationsPage() {
+    const t = (0, next_intl_1.useTranslations)('notificationsDash');
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "max-w-4xl mx-auto px-3 py-4 space-y-3 xs:px-4 xs:space-y-4 sm:px-6 sm:py-6 sm:space-y-6 font-mono", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-lg sm:text-2xl font-bold text-white tracking-wider", children: t('title') }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs sm:text-sm text-neutral-400", children: t('subtitle') })] }), (0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-neutral-900 border-neutral-700 dash-card", children: (0, jsx_runtime_1.jsx)(card_1.CardContent, { className: "p-3 sm:p-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "text-center py-12 text-neutral-500", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Bell, { className: "w-12 h-12 mx-auto mb-3 opacity-50" }), (0, jsx_runtime_1.jsx)("p", { className: "text-lg", children: t('noNotifications') }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm mt-1", children: t('noNotificationsHint') })] }) }) })] }));
+}

package/dist/main-portal/components/organization/OrganizationPage.d.ts

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

package/dist/main-portal/components/organization/OrganizationPage.js

@@ -0,0 +1,235 @@
+"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = OrganizationPage;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const card_1 = require("../ui/card");
+const button_1 = require("../ui/button");
+const input_1 = require("../ui/input");
+const select_1 = require("../ui/select");
+const lucide_react_1 = require("lucide-react");
+const utils_1 = require("../../lib/utils");
+const framer_motion_1 = require("framer-motion");
+const navigation_1 = require("../../i18n/navigation");
+const diagram_node_1 = require("./diagram-node");
+const connection_line_1 = require("./connection-line");
+const system_panel_1 = require("./system-panel");
+const services_1 = require("../../lib/api/services");
+const next_intl_1 = require("next-intl");
+function buildTree(units) {
+    const nodeMap = new Map();
+    const roots = [];
+    const orphans = [];
+    units.forEach(unit => { const uid = String(unit.unit_id); nodeMap.set(uid, { unit_id: uid, unit_name: unit.unit_name, unit_type: unit.unit_type, manager_id: unit.manager_wallet, manager_name: unit.manager_wallet ? `${unit.manager_wallet.slice(0, 6)}...` : undefined, is_team_managed: !unit.manager_wallet, member_count: unit.current_members || 0, capacity: unit.max_capacity || unit.capacity || 1000, total_funds: unit.vault_balance || 0, kpi_qualified: false, tech_bonus_lit: false, children: [] }); });
+    units.forEach(unit => { const uid = String(unit.unit_id); const node = nodeMap.get(uid); if (!node)
+        return; const pid = unit.parent_id || unit.parent_unit_id; if (pid) {
+        const parent = nodeMap.get(String(pid));
+        if (parent)
+            parent.children.push(node);
+        else if (unit.unit_type === 'station')
+            orphans.push(node);
+    }
+    else
+        roots.push(node); });
+    const order = { system: 0, sector: 1, matrix: 2, station: 3 };
+    const sortN = (ns) => { ns.sort((a, b) => order[a.unit_type] - order[b.unit_type]); ns.forEach(n => sortN(n.children)); };
+    sortN(roots);
+    return { tree: roots, orphans };
+}
+function calcStats(units, summary) {
+    const ut = { station: 0, matrix: 0, sector: 0, system: 0 };
+    let tf = 0;
+    units.forEach(u => { if (u.unit_type in ut)
+        ut[u.unit_type]++; tf += u.vault_balance || 0; });
+    const us = summary?.user_stats;
+    return { total_users: us?.total_users ?? summary?.total_members ?? 0, active_miners: us?.miners ?? 0, zombie_users: us?.unassigned_users ?? 0, commanders: us?.commanders ?? 0, pioneers: us?.pioneers ?? 0, wardens: us?.wardens ?? 0, admirals: us?.admirals ?? 0, total_funds: summary?.total_vault_mcd ?? summary?.total_vault_balance ?? tf, units_by_type: summary?.stations_by_type ? { station: summary.stations_by_type.station || ut.station, matrix: summary.stations_by_type.matrix || ut.matrix, sector: summary.stations_by_type.sector || ut.sector, system: summary.stations_by_type.system || ut.system } : ut };
+}
+const emptyStats = { total_users: 0, active_miners: 0, zombie_users: 0, commanders: 0, pioneers: 0, wardens: 0, admirals: 0, total_funds: 0, units_by_type: { station: 0, matrix: 0, sector: 0, system: 0 } };
+const fmtMCD = (v) => v >= 1e6 ? `${(v / 1e6).toFixed(1)}M` : v >= 1e3 ? `${(v / 1e3).toFixed(0)}K` : v.toLocaleString();
+function djb(s) { let h = 5381; for (let i = 0; i < s.length; i++)
+    h = ((h << 5) + h + s.charCodeAt(i)) | 0; return ((h & 0x7fffffff) % 1000) / 1000; }
+function FlipCard({ front, back }) {
+    const [flipped, setFlipped] = (0, react_1.useState)(false);
+    return ((0, jsx_runtime_1.jsx)("div", { style: { perspective: '1500px' }, children: (0, jsx_runtime_1.jsxs)(framer_motion_1.motion.div, { className: "relative w-full cursor-pointer", onClick: () => setFlipped(!flipped), animate: { rotateY: flipped ? 180 : 0, scale: flipped ? [1, 1.03, 1] : 1 }, transition: { rotateY: { duration: 0.7, ease: [0.4, 0, 0.2, 1] }, scale: { duration: 0.7, ease: [0.4, 0, 0.2, 1], times: [0, 0.5, 1] } }, style: { transformStyle: 'preserve-3d' }, children: [(0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { className: "group relative overflow-hidden rounded-lg border border-neutral-700 bg-neutral-900 dash-card", style: { backfaceVisibility: 'hidden', display: flipped ? 'none' : undefined }, animate: { opacity: flipped ? 0 : 1, filter: flipped ? 'blur(4px)' : 'blur(0px)' }, transition: { duration: 0.35, ease: 'easeInOut' }, children: (0, jsx_runtime_1.jsx)("div", { className: "relative z-10 p-6", children: front }) }), (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { className: "overflow-hidden rounded-lg border border-cyan-400/30 bg-neutral-900 dash-card", style: { backfaceVisibility: 'hidden', transform: 'rotateY(180deg)', display: flipped ? undefined : 'none' }, animate: { opacity: flipped ? 1 : 0, filter: flipped ? 'blur(0px)' : 'blur(4px)' }, transition: { duration: 0.35, ease: 'easeInOut' }, children: (0, jsx_runtime_1.jsx)("div", { className: "relative z-10 p-6", children: back }) })] }) }));
+}
+function enrichTree(nodes) {
+    return nodes.map(node => {
+        const e = { ...node, children: [...node.children] };
+        const mk = (type, pid, idx, name, cap) => ({ unit_id: `sim-${type.slice(0, 3)}-${pid}-${idx}`, unit_name: name, unit_type: type, is_team_managed: true, member_count: 0, capacity: cap, total_funds: 0, kpi_qualified: false, tech_bonus_lit: false, children: [] });
+        if (node.unit_type === 'system' && e.children.length < 3) {
+            const nm = ['Alpha', 'Beta', 'Gamma'];
+            while (e.children.length < 3) {
+                const i = e.children.length;
+                e.children.push(mk('sector', node.unit_id, i, `Sector ${nm[i]}`, 100000));
+            }
+        }
+        else if (node.unit_type === 'sector') {
+            const t = 2 + Math.floor(djb(node.unit_id + 'c') * 2);
+            while (e.children.length < t) {
+                const i = e.children.length;
+                e.children.push(mk('matrix', node.unit_id, i, `Matrix ${String.fromCharCode(65 + i)}`, 10000));
+            }
+        }
+        else if (node.unit_type === 'matrix' && e.children.length === 0 && djb(node.unit_id) > 0.35) {
+            const c = 1 + Math.floor(djb(node.unit_id + 's') * 2);
+            for (let i = 0; i < c; i++)
+                e.children.push(mk('station', node.unit_id, i, `Station ${String.fromCharCode(65 + i)}`, 1000));
+        }
+        e.children = enrichTree(e.children);
+        return e;
+    });
+}
+function treeToDiagram(roots, orphans, pal) {
+    const eRoots = enrichTree(roots);
+    const nodes = [];
+    const connections = [];
+    const NW = 130, NH = 80, HG = 22, VG = [120, 110, 100];
+    const tMap = { system: 'system', sector: 'sector', matrix: 'matrix', station: 'station' };
+    const cMap = { system: 'stream', sector: 'sdi', matrix: 'usb', station: 'hdmi' };
+    function measure(n) { return n.children.length === 0 ? NW : n.children.reduce((s, c) => s + measure(c) + HG, -HG); }
+    function layout(n, x, y, gid, lvl) {
+        const jx = (djb(n.unit_id + 'x') - 0.5) * 18, jy = (djb(n.unit_id + 'y') - 0.5) * 14, isSim = n.unit_id.startsWith('sim-');
+        const sub = isSim ? pal : n.is_team_managed ? `${n.member_count}/${n.capacity}` : `${n.manager_name || ''} · ${n.member_count}`;
+        nodes.push({ id: n.unit_id, label: n.unit_name, sublabel: sub, type: isSim ? 'empty' : (tMap[n.unit_type] || 'station'), x: x + jx, y: y + jy, system: gid });
+        if (n.children.length === 0)
+            return;
+        const tw = n.children.reduce((s, c) => s + measure(c) + HG, -HG);
+        let cx = x + NW / 2 - tw / 2;
+        const vg = VG[Math.min(lvl, VG.length - 1)];
+        n.children.forEach(child => { const cw = measure(child); layout(child, cx + cw / 2 - NW / 2, y + vg, gid, lvl + 1); connections.push({ from: n.unit_id, to: child.unit_id, type: cMap[n.unit_type] || 'hdmi', lineStyle: child.unit_id.startsWith('sim-') ? 'dotted' : undefined }); cx += cw + HG; });
+    }
+    let sx = 40;
+    eRoots.forEach((r, i) => { const w = measure(r); layout(r, sx + w / 2 - NW / 2, 40, `group-${i}`, 0); sx += w + 80; });
+    if (orphans.length > 0) {
+        const COLS = Math.min(orphans.length, 5);
+        orphans.forEach((o, idx) => { const col = idx % COLS, row = Math.floor(idx / COLS); nodes.push({ id: o.unit_id, label: o.unit_name, sublabel: `${o.member_count}/${o.capacity}`, type: o.is_team_managed ? 'team' : 'station', x: sx + 60 + col * (NW + HG) + (djb(o.unit_id + 'x') - 0.5) * 12, y: 40 + row * 100 + (djb(o.unit_id + 'y') - 0.5) * 10, system: 'orphans' }); });
+    }
+    const gMap = new Map();
+    nodes.forEach(n => { if (!gMap.has(n.system))
+        gMap.set(n.system, []); gMap.get(n.system).push(n); });
+    const subgraphs = [];
+    const PAD = 30;
+    gMap.forEach((gN, gId) => { if (gN.length === 0)
+        return; const minX = Math.min(...gN.map(n => n.x)), maxX = Math.max(...gN.map(n => n.x)), minY = Math.min(...gN.map(n => n.y)), maxY = Math.max(...gN.map(n => n.y)); const root = eRoots.find((_, i) => `group-${i}` === gId); subgraphs.push({ id: gId, title: root ? root.unit_name : gId === 'orphans' ? 'Orphan Stations' : gId, x: minX - PAD, y: minY - PAD - 20, width: maxX - minX + NW + PAD * 2, height: maxY - minY + NH + PAD * 2 + 20 }); });
+    return { nodes, connections, subgraphs };
+}
+function filterTree(nodes, search, mgmt) {
+    return nodes.reduce((acc, node) => {
+        const fc = filterTree(node.children, search, mgmt);
+        const nm = !search || node.unit_name.toLowerCase().includes(search.toLowerCase()) || node.unit_id.toLowerCase().includes(search.toLowerCase());
+        const mm = mgmt === 'all' || (mgmt === 'team' && node.is_team_managed) || (mgmt === 'user' && !node.is_team_managed);
+        if ((nm && mm) || fc.length > 0)
+            acc.push({ ...node, children: fc });
+        return acc;
+    }, []);
+}
+function OrganizationPage() {
+    const t = (0, next_intl_1.useTranslations)('userSystem');
+    const [stats, setStats] = (0, react_1.useState)(emptyStats);
+    const [orgTree, setOrgTree] = (0, react_1.useState)([]);
+    const [orphans, setOrphans] = (0, react_1.useState)([]);
+    const [loading, setLoading] = (0, react_1.useState)(true);
+    const [isRefreshing, setIsRefreshing] = (0, react_1.useState)(false);
+    const [error, setError] = (0, react_1.useState)(null);
+    const [searchTerm, setSearchTerm] = (0, react_1.useState)('');
+    const [filterMgmt, setFilterMgmt] = (0, react_1.useState)('all');
+    const loadData = (0, react_1.useCallback)(async (isRefresh = false) => {
+        try {
+            if (isRefresh)
+                setIsRefreshing(true);
+            else
+                setLoading(true);
+            setError(null);
+            let units = [], summary = null;
+            try {
+                const r = await (0, services_1.getUnits)();
+                if (r.success && r.data && Array.isArray(r.data))
+                    units = r.data;
+            }
+            catch { }
+            try {
+                const r = await (0, services_1.getUnitsSummary)();
+                if (r.success)
+                    summary = (r.data || r);
+            }
+            catch { }
+            if (units.length > 0) {
+                const { tree, orphans: o } = buildTree(units);
+                setOrgTree(tree);
+                setOrphans(o);
+            }
+            else {
+                setOrgTree([]);
+                setOrphans([]);
+            }
+            setStats(calcStats(units, summary));
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : t('loadFailed'));
+        }
+        finally {
+            setLoading(false);
+            setIsRefreshing(false);
+        }
+    }, [t]);
+    (0, react_1.useEffect)(() => { loadData(); }, [loadData]);
+    const filteredTree = (0, react_1.useMemo)(() => filterTree(orgTree, searchTerm, filterMgmt), [orgTree, searchTerm, filterMgmt]);
+    const filteredOrphans = (0, react_1.useMemo)(() => filterTree(orphans, searchTerm, filterMgmt), [orphans, searchTerm, filterMgmt]);
+    const pal = t('pendingAuction');
+    const diagData = (0, react_1.useMemo)(() => treeToDiagram(filteredTree, filteredOrphans, pal), [filteredTree, filteredOrphans, pal]);
+    const [selNode, setSelNode] = (0, react_1.useState)(null);
+    const [hovNode, setHovNode] = (0, react_1.useState)(null);
+    const [dZoom, setDZoom] = (0, react_1.useState)(1);
+    const [dPan, setDPan] = (0, react_1.useState)({ x: 0, y: 0 });
+    const [isPanning, setIsPanning] = (0, react_1.useState)(false);
+    const [panStart, setPanStart] = (0, react_1.useState)({ x: 0, y: 0 });
+    const containerRef = (0, react_1.useRef)(null);
+    const [dNodes, setDNodes] = (0, react_1.useState)(diagData.nodes);
+    const [dSubs, setDSubs] = (0, react_1.useState)(diagData.subgraphs);
+    const fitToView = (0, react_1.useCallback)((nodes) => {
+        if (nodes.length === 0 || !containerRef.current)
+            return;
+        const el = containerRef.current, cw = el.clientWidth, ch = el.clientHeight, P = 60;
+        const minX = Math.min(...nodes.map(n => n.x)), maxX = Math.max(...nodes.map(n => n.x)) + 130, minY = Math.min(...nodes.map(n => n.y)), maxY = Math.max(...nodes.map(n => n.y)) + 80;
+        const cW = maxX - minX + P * 2, cH = maxY - minY + P * 2, zoom = Math.min(cw / cW, ch / cH, 1.5);
+        setDZoom(Math.round(zoom * 100) / 100);
+        setDPan({ x: (cw - cW * zoom) / 2 - (minX - P) * zoom, y: (ch - cH * zoom) / 2 - (minY - P) * zoom });
+    }, []);
+    (0, react_1.useEffect)(() => { setDNodes(diagData.nodes); setDSubs(diagData.subgraphs); requestAnimationFrame(() => fitToView(diagData.nodes)); }, [diagData, fitToView]);
+    (0, react_1.useEffect)(() => { const el = containerRef.current; if (!el)
+        return; const ro = new ResizeObserver(() => fitToView(dNodes)); ro.observe(el); return () => ro.disconnect(); }, [dNodes, fitToView]);
+    const getConnected = (0, react_1.useCallback)((id) => { const s = new Set(); diagData.connections.forEach(c => { if (c.from === id)
+        s.add(c.to); if (c.to === id)
+        s.add(c.from); }); return s; }, [diagData.connections]);
+    const connNodes = hovNode ? getConnected(hovNode) : new Set();
+    const handleNodeDrag = (0, react_1.useCallback)((id, nx, ny) => { setDNodes(prev => prev.map(n => n.id === id ? { ...n, x: nx, y: ny } : n)); }, []);
+    const handleGroupDrag = (0, react_1.useCallback)((gid, dx, dy) => { setDNodes(prev => prev.map(n => n.system === gid ? { ...n, x: n.x + dx, y: n.y + dy } : n)); setDSubs(prev => prev.map(sg => sg.id === gid ? { ...sg, x: sg.x + dx, y: sg.y + dy } : sg)); }, []);
+    const diagBounds = (0, react_1.useMemo)(() => {
+        if (dNodes.length === 0)
+            return { minX: 0, minY: 0, maxX: 1000, maxY: 500, width: 1000, height: 500 };
+        const P = 100, minX = Math.min(...dNodes.map(n => n.x)) - P, maxX = Math.max(...dNodes.map(n => n.x)) + 140 + P, minY = Math.min(...dNodes.map(n => n.y)) - P, maxY = Math.max(...dNodes.map(n => n.y)) + 80 + P;
+        return { minX: Math.min(0, minX), minY: Math.min(0, minY), maxX, maxY, width: Math.max(1000, maxX - Math.min(0, minX)), height: Math.max(500, maxY - Math.min(0, minY)) };
+    }, [dNodes]);
+    const dynSubs = (0, react_1.useMemo)(() => dSubs.map(sg => {
+        const sn = dNodes.filter(n => n.system === sg.id);
+        if (sn.length === 0)
+            return sg;
+        const P = 30;
+        const minX = Math.min(...sn.map(n => n.x)), maxX = Math.max(...sn.map(n => n.x)), minY = Math.min(...sn.map(n => n.y)), maxY = Math.max(...sn.map(n => n.y));
+        return { ...sg, x: minX - P, y: minY - P - 20, width: maxX - minX + 140 + P * 2, height: maxY - minY + 80 + P * 2 + 20 };
+    }), [dSubs, dNodes]);
+    if (loading)
+        return (0, jsx_runtime_1.jsxs)("div", { className: "max-w-7xl mx-auto px-3 py-4 space-y-3 xs:px-4 xs:space-y-4 sm:px-6 sm:py-6 sm:space-y-6", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-lg sm:text-2xl font-bold text-white tracking-wider", children: t('title') }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs sm:text-sm text-neutral-400 mt-1", children: t('subtitle') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-center py-20", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "w-6 h-6 text-neutral-400 animate-spin" }), (0, jsx_runtime_1.jsx)("span", { className: "ml-3 text-neutral-400 text-sm", children: t('loading') })] })] });
+    const unitIcons = { station: lucide_react_1.Building2, matrix: lucide_react_1.Grid3x3, sector: lucide_react_1.Map, system: lucide_react_1.Globe };
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "max-w-7xl mx-auto px-3 py-4 space-y-3 xs:px-4 xs:space-y-4 sm:px-6 sm:py-6 sm:space-y-6", 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-lg sm:text-2xl font-bold text-white tracking-wider", children: t('title') }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs sm:text-sm text-neutral-400 mt-1", children: t('subtitle') })] }), (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "outline", size: "sm", className: "border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300 bg-transparent", onClick: () => loadData(true), disabled: isRefreshing, children: [(0, jsx_runtime_1.jsx)(lucide_react_1.RefreshCw, { className: (0, utils_1.cn)("w-4 h-4 mr-2", isRefreshing && "animate-spin") }), t('refresh')] })] }), error && (0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-red-500/10 border-red-500/20", children: (0, jsx_runtime_1.jsx)(card_1.CardContent, { className: "p-4", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 text-red-400", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertTriangle, { className: "w-4 h-4" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm", children: error })] }) }) }), (0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-neutral-900 border-neutral-700 hover:border-cyan-400/50 dash-card", children: (0, jsx_runtime_1.jsxs)(card_1.CardContent, { className: "p-3 sm:p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-4 flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Users, { className: "w-5 h-5 text-cyan-400" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-sm font-bold text-cyan-400 tracking-wide", children: t('userStats') }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] text-neutral-500 font-mono tracking-wider", children: "User Statistics" })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-2 md:grid-cols-5 gap-4", children: [{ label: t('totalUsers'), value: stats.total_users }, { label: 'Miner', value: stats.active_miners }, { label: t('unassigned'), value: stats.zombie_users }].map(({ label, value }) => ((0, jsx_runtime_1.jsxs)("div", { className: "p-3 bg-neutral-800 rounded border border-neutral-700", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-cyan-400/70 tracking-wider mb-1", children: label }), (0, jsx_runtime_1.jsx)("div", { className: "text-lg font-bold text-white font-mono", children: value.toLocaleString() })] }, label))) })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [(0, jsx_runtime_1.jsx)(FlipCard, { front: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-4 flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Network, { className: "w-5 h-5 text-cyan-400" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-sm font-bold text-cyan-400 tracking-wide", children: t('territoryDistribution') }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] text-neutral-500 font-mono tracking-wider", children: "Territory Distribution" })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-4 gap-3", children: ['station', 'matrix', 'sector', 'system'].map(k => { const Icon = unitIcons[k]; return (0, jsx_runtime_1.jsxs)("div", { className: "text-center p-3 bg-neutral-800 rounded border border-neutral-700", children: [(0, jsx_runtime_1.jsx)(Icon, { className: "w-5 h-5 text-cyan-400/70 mx-auto mb-2" }), (0, jsx_runtime_1.jsx)("div", { className: "text-lg font-bold text-white font-mono", children: stats.units_by_type[k] }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-cyan-400/70 tracking-wider", children: k.charAt(0).toUpperCase() + k.slice(1) })] }, k); }) }), (0, jsx_runtime_1.jsx)("div", { className: "mt-3 text-xs text-neutral-500", children: t('fourTierArchitecture') })] }), back: (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Network, { className: "w-5 h-5 text-cyan-400" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-sm font-bold text-cyan-400 tracking-wide", children: t('territorySystem') }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] text-neutral-500 font-mono tracking-wider", children: "Territory System" })] })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-300 leading-relaxed", children: t('territorySystemDesc') }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-neutral-400 leading-relaxed space-y-1.5", children: ['Station', 'Matrix', 'Sector', 'System'].map(k => (0, jsx_runtime_1.jsxs)("p", { children: [(0, jsx_runtime_1.jsx)("span", { className: "text-cyan-400/80 font-mono", children: k }), " \u2014 ", t(`${k.toLowerCase()}Desc`)] }, k)) }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400 leading-relaxed", children: t('magistrateDesc') }), (0, jsx_runtime_1.jsx)(navigation_1.Link, { href: "/docs", className: "inline-flex items-center gap-1.5 text-xs text-cyan-400 hover:text-cyan-300 font-mono mt-1 transition-colors", children: t('learnMore') })] }) }), (0, jsx_runtime_1.jsx)(FlipCard, { front: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-4 flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Building2, { className: "w-5 h-5 text-cyan-400" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-sm font-bold text-cyan-400 tracking-wide", children: t('vaultBalance') }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] text-neutral-500 font-mono tracking-wider", children: "Vault Balance" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "p-4 bg-neutral-800 rounded border border-neutral-700", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-3xl font-bold text-cyan-300 font-mono", children: fmtMCD(stats.total_funds) }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-cyan-400/50 mt-1", children: "MCD" })] }), (0, jsx_runtime_1.jsx)("div", { className: "mt-3 text-xs text-neutral-500", children: t('dailyDistribution') })] }), back: (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Building2, { className: "w-5 h-5 text-cyan-400" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-sm font-bold text-cyan-400 tracking-wide", children: t('vaultMechanism') }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] text-neutral-500 font-mono tracking-wider", children: "Vault Mechanism" })] })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-300 leading-relaxed", children: t('vaultMechanismDesc') }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-neutral-400 leading-relaxed space-y-1.5", children: ['source', 'distribution', 'peg', 'transparency'].map(k => (0, jsx_runtime_1.jsxs)("p", { children: [(0, jsx_runtime_1.jsx)("span", { className: "text-cyan-400/80", children: t(`${k}Label`) }), " \u2014 ", t(`${k}Desc`)] }, k)) }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400 leading-relaxed", children: t('vaultIncentive') }), (0, jsx_runtime_1.jsx)(navigation_1.Link, { href: "/docs", className: "inline-flex items-center gap-1.5 text-xs text-cyan-400 hover:text-cyan-300 font-mono mt-1 transition-colors", children: t('learnMore') })] }) })] }), (0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-neutral-900 border-neutral-700 dash-card", children: (0, jsx_runtime_1.jsxs)(card_1.CardContent, { className: "p-3 sm:p-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-4 flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Crown, { className: "w-5 h-5 text-cyan-400" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-sm font-bold text-cyan-400 tracking-wide", children: t('levelProgression') }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] text-neutral-500 font-mono tracking-wider", children: "Level Progression" })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-7 gap-3", children: ['Miner', 'Commander', 'Pioneer', 'Warden', 'Admiral'].map((level, i) => ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3 p-3 bg-neutral-800 rounded border border-neutral-700", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold text-cyan-400 font-mono leading-none", children: i + 1 }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-sm font-medium text-neutral-200", children: level }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400", children: t(level.toLowerCase()) }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: t(`${level.toLowerCase()}Condition`) })] })] }, level))) })] }) }), (0, jsx_runtime_1.jsx)(card_1.Card, { className: "bg-neutral-900 border-neutral-700 dash-card", children: (0, jsx_runtime_1.jsxs)(card_1.CardContent, { className: "p-3 sm: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-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Network, { className: "w-5 h-5 text-cyan-400" }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-sm font-bold text-cyan-400 tracking-wide", children: t('territoryStructure') }), (0, jsx_runtime_1.jsx)("div", { className: "text-[10px] text-neutral-500 font-mono tracking-wider", children: "Territory Structure" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "hidden sm:flex items-center gap-3 text-[10px] font-mono text-neutral-500", children: [{ l: 'System', c: 'bg-purple-400' }, { l: 'Sector', c: 'bg-blue-400' }, { l: 'Matrix', c: 'bg-cyan-400' }, { l: 'Station', c: 'bg-emerald-400' }].map(({ l, c }) => (0, jsx_runtime_1.jsxs)("span", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("span", { className: (0, utils_1.cn)('w-1.5 h-1.5 rounded-full', c) }), l] }, l)) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-neutral-500" }), (0, jsx_runtime_1.jsx)(input_1.Input, { placeholder: t('searchTerritory'), value: searchTerm, onChange: e => setSearchTerm(e.target.value), className: "pl-9 w-40 bg-neutral-800 border-neutral-600 text-white placeholder-neutral-400 text-sm h-8" })] }), (0, jsx_runtime_1.jsxs)(select_1.Select, { value: filterMgmt, onValueChange: setFilterMgmt, children: [(0, jsx_runtime_1.jsx)(select_1.SelectTrigger, { className: "w-28 bg-neutral-800 border-neutral-600 text-white text-sm h-8", children: (0, jsx_runtime_1.jsx)(select_1.SelectValue, { placeholder: t('managementStatus') }) }), (0, jsx_runtime_1.jsxs)(select_1.SelectContent, { className: "bg-neutral-900 border-neutral-700", children: [(0, jsx_runtime_1.jsx)(select_1.SelectItem, { value: "all", children: t('filterAll') }), (0, jsx_runtime_1.jsx)(select_1.SelectItem, { value: "user", children: t('filterUserManaged') }), (0, jsx_runtime_1.jsx)(select_1.SelectItem, { value: "team", children: t('filterTeamManaged') })] })] })] })] })] }), dNodes.length > 0 ? ((0, jsx_runtime_1.jsxs)("div", { ref: containerRef, className: "relative h-[500px] rounded-lg border border-neutral-800 overflow-hidden touch-none", onMouseDown: e => { if (e.button === 1 || (e.button === 0 && e.altKey)) {
+                                e.preventDefault();
+                                setIsPanning(true);
+                                setPanStart({ x: e.clientX - dPan.x, y: e.clientY - dPan.y });
+                            } }, onMouseMove: e => { if (isPanning)
+                                setDPan({ x: e.clientX - panStart.x, y: e.clientY - panStart.y }); }, onMouseUp: () => setIsPanning(false), onMouseLeave: () => setIsPanning(false), onWheel: e => { if (e.ctrlKey || e.metaKey) {
+                                e.preventDefault();
+                                setDZoom(prev => Math.max(0.25, Math.min(3, prev + (e.deltaY > 0 ? -0.1 : 0.1))));
+                            } }, children: [(0, jsx_runtime_1.jsx)("div", { className: "absolute inset-0 opacity-10", children: (0, jsx_runtime_1.jsxs)("svg", { className: "w-full h-full", children: [(0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsx)("pattern", { id: "territory-grid", width: "40", height: "40", patternUnits: "userSpaceOnUse", children: (0, jsx_runtime_1.jsx)("path", { d: "M 40 0 L 0 0 0 40", fill: "none", stroke: "currentColor", strokeWidth: "0.5", className: "text-cyan-400" }) }) }), (0, jsx_runtime_1.jsx)("rect", { width: "100%", height: "100%", fill: "url(#territory-grid)" })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "absolute top-2 right-2 z-20 flex items-center gap-1 px-2 py-1 rounded-lg border border-neutral-700 bg-neutral-900/80 backdrop-blur-sm", children: [(0, jsx_runtime_1.jsx)("button", { className: "p-1 hover:bg-neutral-800 rounded text-neutral-400", onClick: () => setDZoom(prev => Math.max(prev - 0.25, 0.25)), children: (0, jsx_runtime_1.jsx)("svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeWidth: "2", d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0zM13 10H7" }) }) }), (0, jsx_runtime_1.jsxs)("span", { className: "text-[10px] text-neutral-500 font-mono min-w-[36px] text-center", children: [Math.round(dZoom * 100), "%"] }), (0, jsx_runtime_1.jsx)("button", { className: "p-1 hover:bg-neutral-800 rounded text-neutral-400", onClick: () => setDZoom(prev => Math.min(prev + 0.25, 3)), children: (0, jsx_runtime_1.jsx)("svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeWidth: "2", d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0zM10 7v6m3-3H7" }) }) }), (0, jsx_runtime_1.jsx)("button", { className: "p-1 hover:bg-neutral-800 rounded text-neutral-400", onClick: () => fitToView(dNodes), children: (0, jsx_runtime_1.jsx)("svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeWidth: "2", d: "M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4" }) }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: `relative ${isPanning ? 'cursor-grabbing' : 'cursor-default'}`, style: { minWidth: `${diagBounds.width}px`, minHeight: `${diagBounds.height}px`, transform: `translate(${dPan.x}px, ${dPan.y}px) scale(${dZoom})`, transformOrigin: '0 0' }, children: [dynSubs.map(sg => (0, jsx_runtime_1.jsx)(system_panel_1.SystemPanel, { id: sg.id, title: sg.title, x: sg.x, y: sg.y, width: sg.width, height: sg.height, onDrag: handleGroupDrag }, sg.id)), (0, jsx_runtime_1.jsxs)("svg", { className: "absolute pointer-events-none", style: { left: 0, top: 0, width: `${diagBounds.width}px`, height: `${diagBounds.height}px`, overflow: 'visible' }, children: [(0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsxs)("filter", { id: "glow", children: [(0, jsx_runtime_1.jsx)("feGaussianBlur", { stdDeviation: "3", result: "coloredBlur" }), (0, jsx_runtime_1.jsxs)("feMerge", { children: [(0, jsx_runtime_1.jsx)("feMergeNode", { in: "coloredBlur" }), (0, jsx_runtime_1.jsx)("feMergeNode", { in: "SourceGraphic" })] })] }) }), diagData.connections.map((conn, i) => { const fn = dNodes.find(n => n.id === conn.from), tn = dNodes.find(n => n.id === conn.to); if (!fn || !tn)
+                                                    return null; const hl = hovNode === conn.from || hovNode === conn.to || (selNode && (selNode === conn.from || selNode === conn.to)); return (0, jsx_runtime_1.jsx)(connection_line_1.ConnectionLine, { fromX: fn.x + 60, fromY: fn.y + 50, toX: tn.x + 60, toY: tn.y + 50, label: conn.label, type: conn.type, lineStyle: conn.lineStyle, isHighlighted: !!hl }, `${conn.from}-${conn.to}-${i}`); })] }), dNodes.map(node => (0, jsx_runtime_1.jsx)(diagram_node_1.DiagramNode, { ...node, isSelected: selNode === node.id, isConnected: connNodes.has(node.id), isHovered: hovNode === node.id, onSelect: () => setSelNode(selNode === node.id ? null : node.id), onHover: h => setHovNode(h ? node.id : null), onDrag: handleNodeDrag }, node.id))] }), (0, jsx_runtime_1.jsx)("div", { className: "absolute bottom-2 left-2 z-20 text-[10px] text-neutral-600 font-mono", children: t('diagramControls', { nodes: dNodes.length, connections: diagData.connections.length }) })] })) : (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-16 text-neutral-500 text-sm", children: searchTerm || filterMgmt !== 'all' ? t('noMatchResults') : t('noStructure') })] }) })] }));
+}

package/dist/main-portal/components/organization/connection-line.d.ts

@@ -0,0 +1,12 @@
+interface ConnectionLineProps {
+    fromX: number;
+    fromY: number;
+    toX: number;
+    toY: number;
+    label?: string;
+    type: "hdmi" | "sdi" | "usb" | "wireless" | "ethernet" | "stream" | "audio";
+    lineStyle?: "solid" | "dotted" | "thick";
+    isHighlighted: boolean;
+}
+export declare function ConnectionLine({ fromX, fromY, toX, toY, label, type, lineStyle, isHighlighted }: ConnectionLineProps): import("react/jsx-runtime").JSX.Element;
+export {};