@microcosmmoney/portal-react 3.6.0 → 3.8.0

package/dist/components/profile/email-change-card.d.ts

@@ -0,0 +1,4 @@
+export interface MicrocosmEmailChangeCardProps {
+    onSuccess?: (newEmail: string) => void;
+}
+export declare function MicrocosmEmailChangeCard({ onSuccess }?: MicrocosmEmailChangeCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/profile/email-change-card.js

@@ -0,0 +1,49 @@
+"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MicrocosmEmailChangeCard = MicrocosmEmailChangeCard;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const auth_react_1 = require("@microcosmmoney/auth-react");
+const terminal_1 = require("../terminal");
+function MicrocosmEmailChangeCard({ onSuccess } = {}) {
+    const { requestEmailChange, verifyEmailChange, loading, error, clearError } = (0, auth_react_1.useEmailVerification)();
+    const [step, setStep] = (0, react_1.useState)('idle');
+    const [newEmail, setNewEmail] = (0, react_1.useState)('');
+    const [password, setPassword] = (0, react_1.useState)('');
+    const [code, setCode] = (0, react_1.useState)('');
+    const handleRequest = async () => {
+        if (!newEmail || !password)
+            return;
+        clearError();
+        try {
+            await requestEmailChange(newEmail, password);
+            setStep('verify');
+        }
+        catch { }
+    };
+    const handleVerify = async () => {
+        if (code.length !== 6)
+            return;
+        clearError();
+        try {
+            await verifyEmailChange(newEmail, code);
+            setStep('idle');
+            const finalEmail = newEmail;
+            setNewEmail('');
+            setPassword('');
+            setCode('');
+            onSuccess?.(finalEmail);
+        }
+        catch { }
+    };
+    if (step === 'idle') {
+        return ((0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2 mb-3", children: (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-300 font-medium tracking-wider", children: "CHANGE EMAIL" }) }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400 mb-3", children: "Update your email address. A verification code will be sent to the new email." }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setStep('form'), className: "px-3 py-1.5 border border-neutral-700 text-neutral-300 hover:bg-neutral-800 rounded text-xs", children: "Change Email" })] }));
+    }
+    return ((0, jsx_runtime_1.jsx)(terminal_1.TerminalCard, { children: (0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2", children: (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-300 font-medium tracking-wider", children: "CHANGE EMAIL" }) }), error && ((0, jsx_runtime_1.jsx)("div", { className: "p-2 bg-red-900/20 border border-red-800 rounded text-xs text-red-300", children: error })), step === 'form' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { type: "email", value: newEmail, onChange: (e) => setNewEmail(e.target.value), placeholder: "New email address", className: "w-full bg-neutral-800 border border-neutral-700 text-white p-2 rounded text-sm outline-none focus:border-cyan-500" }), (0, jsx_runtime_1.jsx)("input", { type: "password", value: password, onChange: (e) => setPassword(e.target.value), placeholder: "Current password", className: "w-full bg-neutral-800 border border-neutral-700 text-white p-2 rounded text-sm outline-none focus:border-cyan-500" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => {
+                                        setStep('idle');
+                                        setNewEmail('');
+                                        setPassword('');
+                                        clearError();
+                                    }, className: "flex-1 px-3 py-1.5 text-neutral-500 hover:text-neutral-300 text-xs", children: "Cancel" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleRequest, disabled: loading || !newEmail || !password, className: "flex-1 px-3 py-1.5 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-xs disabled:opacity-50", children: loading ? 'Sending...' : 'Send Code' })] })] })), step === 'verify' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("p", { className: "text-xs text-neutral-400", children: ["Enter the 6-digit code sent to ", (0, jsx_runtime_1.jsx)("span", { className: "text-cyan-400", children: newEmail })] }), (0, jsx_runtime_1.jsx)("input", { type: "text", value: code, onChange: (e) => setCode(e.target.value.replace(/\D/g, '').slice(0, 6)), placeholder: "000000", className: "w-full bg-neutral-800 border border-neutral-700 text-white p-2 rounded text-center text-lg font-mono tracking-[0.5em] outline-none focus:border-cyan-500", maxLength: 6 }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => { setStep('form'); setCode(''); clearError(); }, className: "flex-1 px-3 py-1.5 text-neutral-500 hover:text-neutral-300 text-xs", children: "Back" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleVerify, disabled: loading || code.length !== 6, className: "flex-1 px-3 py-1.5 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-xs disabled:opacity-50", children: loading ? 'Verifying...' : 'Verify' })] })] }))] }) }));
+}

package/dist/components/profile/profile-page.d.ts

@@ -1,6 +1,7 @@
+import { type ReactNode } from 'react';
 export interface MicrocosmProfilePageProps {
     basePath?: string;
     onNavigate?: (path: string) => void;
-    mainPortalSettingsUrl?: string;
+    walletSection?: ReactNode;
 }
-export declare function MicrocosmProfilePage({ mainPortalSettingsUrl, }?: MicrocosmProfilePageProps): import("react/jsx-runtime").JSX.Element;
+export declare function MicrocosmProfilePage({ walletSection, }?: MicrocosmProfilePageProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/profile/profile-page.js

@@ -6,6 +6,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const auth_react_1 = require("@microcosmmoney/auth-react");
 const terminal_1 = require("../terminal");
+const email_change_card_1 = require("./email-change-card");
+const two_factor_settings_1 = require("./two-factor-settings");
 const API_BASE = 'https://api.microcosm.money/v1';
 const LEVEL_INFO = {
     miner: { label: 'Miner', description: 'Registered user', color: 'text-white' },
@@ -14,7 +16,7 @@ const LEVEL_INFO = {
     warden: { label: 'Warden', description: 'Auto-minted Sector NFT (≥10 Matrix)', color: 'text-cyan-400' },
     admiral: { label: 'Admiral', description: 'Auto-minted System NFT (≥10 Sector)', color: 'text-red-400' },
 };
-function MicrocosmProfilePage({ mainPortalSettingsUrl = '/user-system/profile', } = {}) {
+function MicrocosmProfilePage({ walletSection, } = {}) {
     const api = (0, auth_react_1.useMicrocosmApi)();
     const { getAccessToken } = (0, auth_react_1.useMicrocosmContext)();
     const authState = (0, auth_react_1.useAuth)();
@@ -27,6 +29,8 @@ function MicrocosmProfilePage({ mainPortalSettingsUrl = '/user-system/profile',
     const [saving, setSaving] = (0, react_1.useState)(false);
     const [uploadingAvatar, setUploadingAvatar] = (0, react_1.useState)(false);
     const [error, setError] = (0, react_1.useState)(null);
+    const [resendingVerification, setResendingVerification] = (0, react_1.useState)(false);
+    const [resendMessage, setResendMessage] = (0, react_1.useState)(null);
     const fileInputRef = (0, react_1.useRef)(null);
     const loadProfile = (0, react_1.useCallback)(async () => {
         setLoading(true);
@@ -130,5 +134,20 @@ function MicrocosmProfilePage({ mainPortalSettingsUrl = '/user-system/profile',
     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 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: "Profile" }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs sm:text-sm text-neutral-400", children: "Your account information" })] }), error && ((0, jsx_runtime_1.jsx)("div", { className: "p-3 bg-red-900/20 border border-red-800 rounded text-sm text-red-300", children: error })), (0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-4 mb-6 pb-6 border-b border-neutral-700", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative group", children: [profile?.avatar_url ? ((0, jsx_runtime_1.jsx)("img", { src: profile.avatar_url, alt: "", className: "h-20 w-20 rounded bg-neutral-800 border border-neutral-700 object-cover" })) : ((0, jsx_runtime_1.jsx)("div", { className: "h-20 w-20 rounded bg-cyan-400/20 border border-cyan-400/30 flex items-center justify-center text-cyan-400 text-3xl font-bold", children: displayName.charAt(0).toUpperCase() })), (0, jsx_runtime_1.jsx)("button", { onClick: () => fileInputRef.current?.click(), disabled: uploadingAvatar, className: "absolute inset-0 bg-black/50 rounded opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center text-white text-xs disabled:opacity-30", children: uploadingAvatar ? '...' : 'edit' }), (0, jsx_runtime_1.jsx)("input", { ref: fileInputRef, type: "file", accept: "image/jpeg,image/png,image/gif,image/webp", onChange: handleAvatarChange, className: "hidden" })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex-1", children: editing ? ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", children: [(0, jsx_runtime_1.jsx)("input", { type: "text", value: editName, onChange: (e) => setEditName(e.target.value), className: "w-full bg-neutral-800 border border-neutral-600 rounded px-3 py-2 text-white text-sm focus:outline-none focus:border-cyan-400", placeholder: "Display name" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: handleSave, disabled: saving, className: "px-3 py-1.5 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-sm disabled:opacity-50", children: saving ? 'Saving...' : 'Save' }), (0, jsx_runtime_1.jsx)("button", { onClick: () => {
                                                         setEditName(profile?.display_name || '');
                                                         setEditing(false);
-                                                    }, disabled: saving, className: "px-3 py-1.5 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 rounded text-sm", children: "Cancel" })] })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-lg text-white", children: displayName }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setEditing(true), className: "text-xs text-neutral-500 hover:text-cyan-400", children: "[edit]" })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-neutral-400 mt-1", children: profile?.email || '(no email)' }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2 mt-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "px-2 py-0.5 bg-neutral-800 text-neutral-300 rounded text-xs border border-neutral-700", children: profile?.role || 'user' }), profile?.email_verified ? ((0, jsx_runtime_1.jsx)("span", { className: "px-2 py-0.5 bg-green-900/30 text-green-400 rounded text-xs border border-green-800", children: "verified" })) : ((0, jsx_runtime_1.jsx)("span", { className: "px-2 py-0.5 bg-red-900/30 text-red-400 rounded text-xs border border-red-800", children: "unverified" }))] })] })) })] }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", 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: "UID" }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-white font-mono break-all", children: profile?.uid || userInfo?.uid || '-' })] }), (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: "Short ID" }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-white font-mono", children: profile?.short_id || '-' })] }), (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: "Created" }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-white", children: formatDate(profile?.created_at) })] }), (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: "Last Login" }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-white", children: formatDate(profile?.last_login_at) })] })] })] }), levelData && ((0, jsx_runtime_1.jsx)(terminal_1.TerminalCard, { title: "Level Status", children: (0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between p-4 bg-neutral-800 rounded", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: "CURRENT LEVEL" }), (0, jsx_runtime_1.jsx)("div", { className: `text-xl font-bold ${lvlInfo.color}`, children: lvlInfo.label }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500 mt-1", children: lvlInfo.description })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-right", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: "HOLDINGS" }), (0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-white font-mono", children: ["S:", levelData.holdings?.station ?? 0, " M:", levelData.holdings?.matrix ?? 0, " Se:", levelData.holdings?.sector ?? 0, " Sy:", levelData.holdings?.system ?? 0] })] })] }), levelData.next_level_requirement && ((0, jsx_runtime_1.jsxs)("div", { className: "p-4 bg-neutral-800 rounded", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-center mb-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400 tracking-wider", children: "PROGRESS" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-white text-sm font-mono", children: [levelData.progress_percent ?? 0, "%"] })] }), (0, jsx_runtime_1.jsx)("div", { className: "w-full bg-neutral-900 rounded-full h-2", children: (0, jsx_runtime_1.jsx)("div", { className: "h-2 rounded-full bg-cyan-400 transition-all", style: { width: `${Math.min(levelData.progress_percent ?? 0, 100)}%` } }) }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500 mt-2", children: levelData.next_level_requirement.description || '' }), (0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-400 mt-1", children: [levelData.next_level_requirement.have, "/", levelData.next_level_requirement.need, ' ', levelData.next_level_requirement.tier, " \u2192 ", ' ', (0, jsx_runtime_1.jsx)("span", { className: "text-white", children: levelData.next_rank })] })] }))] }) })), (0, jsx_runtime_1.jsx)(terminal_1.TerminalCard, { title: "Advanced Settings", children: (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3 text-sm text-neutral-400", children: [(0, jsx_runtime_1.jsx)("p", { children: "Email verification, email change, two-factor authentication, and wallet management are available on the main portal:" }), (0, jsx_runtime_1.jsx)("a", { href: mainPortalSettingsUrl, className: "inline-block px-3 py-1.5 border border-cyan-800 text-cyan-400 hover:bg-cyan-950 rounded text-sm", children: "Open main portal settings \u2192" })] }) }), (0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-neutral-400 text-sm mb-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-cyan-400", children: "!" }), " Security"] }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-1 text-sm text-neutral-400", children: [(0, jsx_runtime_1.jsx)("p", { children: "- Keep your account credentials secure" }), (0, jsx_runtime_1.jsx)("p", { children: "- Change password periodically via main portal" }), (0, jsx_runtime_1.jsx)("p", { children: "- Report suspicious activity immediately" }), (0, jsx_runtime_1.jsx)("p", { children: "- Verify your email to receive important notifications" })] })] })] }));
+                                                    }, disabled: saving, className: "px-3 py-1.5 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 rounded text-sm", children: "Cancel" })] })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-lg text-white", children: displayName }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setEditing(true), className: "text-xs text-neutral-500 hover:text-cyan-400", children: "[edit]" })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-neutral-400 mt-1", children: profile?.email || '(no email)' }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2 mt-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "px-2 py-0.5 bg-neutral-800 text-neutral-300 rounded text-xs border border-neutral-700", children: profile?.role || 'user' }), profile?.email_verified ? ((0, jsx_runtime_1.jsx)("span", { className: "px-2 py-0.5 bg-green-900/30 text-green-400 rounded text-xs border border-green-800", children: "verified" })) : ((0, jsx_runtime_1.jsx)("span", { className: "px-2 py-0.5 bg-red-900/30 text-red-400 rounded text-xs border border-red-800", children: "unverified" }))] })] })) })] }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", 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: "UID" }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-white font-mono break-all", children: profile?.uid || userInfo?.uid || '-' })] }), (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: "Short ID" }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-white font-mono", children: profile?.short_id || '-' })] }), (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: "Created" }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-white", children: formatDate(profile?.created_at) })] }), (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: "Last Login" }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-white", children: formatDate(profile?.last_login_at) })] })] })] }), levelData && ((0, jsx_runtime_1.jsx)(terminal_1.TerminalCard, { title: "Level Status", children: (0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between p-4 bg-neutral-800 rounded", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: "CURRENT LEVEL" }), (0, jsx_runtime_1.jsx)("div", { className: `text-xl font-bold ${lvlInfo.color}`, children: lvlInfo.label }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500 mt-1", children: lvlInfo.description })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-right", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: "HOLDINGS" }), (0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-white font-mono", children: ["S:", levelData.holdings?.station ?? 0, " M:", levelData.holdings?.matrix ?? 0, " Se:", levelData.holdings?.sector ?? 0, " Sy:", levelData.holdings?.system ?? 0] })] })] }), levelData.next_level_requirement && ((0, jsx_runtime_1.jsxs)("div", { className: "p-4 bg-neutral-800 rounded", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-center mb-2", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400 tracking-wider", children: "PROGRESS" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-white text-sm font-mono", children: [levelData.progress_percent ?? 0, "%"] })] }), (0, jsx_runtime_1.jsx)("div", { className: "w-full bg-neutral-900 rounded-full h-2", children: (0, jsx_runtime_1.jsx)("div", { className: "h-2 rounded-full bg-cyan-400 transition-all", style: { width: `${Math.min(levelData.progress_percent ?? 0, 100)}%` } }) }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500 mt-2", children: levelData.next_level_requirement.description || '' }), (0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-400 mt-1", children: [levelData.next_level_requirement.have, "/", levelData.next_level_requirement.need, ' ', levelData.next_level_requirement.tier, " \u2192 ", ' ', (0, jsx_runtime_1.jsx)("span", { className: "text-white", children: levelData.next_rank })] })] }))] }) })), (0, jsx_runtime_1.jsx)(terminal_1.TerminalCard, { title: "Email Verification", children: (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", 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)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: "STATUS" }), profile?.email_verified ? ((0, jsx_runtime_1.jsx)("div", { className: "text-green-400 text-sm", children: "Verified" })) : ((0, jsx_runtime_1.jsx)("div", { className: "text-red-400 text-sm", children: "Unverified" }))] }), !profile?.email_verified && ((0, jsx_runtime_1.jsx)("button", { onClick: async () => {
+                                        setResendingVerification(true);
+                                        setResendMessage(null);
+                                        try {
+                                            await api.post('/users/me/resend-verification', {});
+                                            setResendMessage('Verification email sent — check your inbox');
+                                        }
+                                        catch (e) {
+                                            setResendMessage(e instanceof Error ? e.message : 'Failed to send');
+                                        }
+                                        finally {
+                                            setResendingVerification(false);
+                                        }
+                                    }, disabled: resendingVerification, className: "px-3 py-1.5 border border-cyan-800 text-cyan-400 hover:bg-cyan-950 rounded text-xs disabled:opacity-50", children: resendingVerification ? 'Sending...' : 'Resend Email' }))] }), resendMessage && ((0, jsx_runtime_1.jsx)("div", { className: "text-xs text-cyan-400", children: resendMessage }))] }) }), (0, jsx_runtime_1.jsx)(email_change_card_1.MicrocosmEmailChangeCard, { onSuccess: (newEmail) => {
+                    setProfile(prev => (prev ? { ...prev, email: newEmail, email_verified: true } : prev));
+                } }), (0, jsx_runtime_1.jsx)(two_factor_settings_1.MicrocosmTwoFactorSettings, {}), walletSection, (0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-neutral-400 text-sm mb-3", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-cyan-400", children: "!" }), " Security"] }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-1 text-sm text-neutral-400", children: [(0, jsx_runtime_1.jsx)("p", { children: "- Keep your account credentials secure" }), (0, jsx_runtime_1.jsx)("p", { children: "- Change password periodically via main portal" }), (0, jsx_runtime_1.jsx)("p", { children: "- Report suspicious activity immediately" }), (0, jsx_runtime_1.jsx)("p", { children: "- Verify your email to receive important notifications" })] })] })] }));
 }

package/dist/components/profile/two-factor-settings.d.ts

@@ -0,0 +1,3 @@
+export interface MicrocosmTwoFactorSettingsProps {
+}
+export declare function MicrocosmTwoFactorSettings({}?: MicrocosmTwoFactorSettingsProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/profile/two-factor-settings.js

@@ -0,0 +1,73 @@
+"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MicrocosmTwoFactorSettings = MicrocosmTwoFactorSettings;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const auth_react_1 = require("@microcosmmoney/auth-react");
+const terminal_1 = require("../terminal");
+function MicrocosmTwoFactorSettings({} = {}) {
+    const { status, setupData, loading, error, beginSetup, verifySetup, disable, clearError, clearSetup, } = (0, auth_react_1.useTwoFactor)();
+    const [step, setStep] = (0, react_1.useState)('idle');
+    const [verifyCode, setVerifyCode] = (0, react_1.useState)('');
+    const [disablePassword, setDisablePassword] = (0, react_1.useState)('');
+    const [showSecret, setShowSecret] = (0, react_1.useState)(false);
+    const [backupCodes, setBackupCodes] = (0, react_1.useState)(null);
+    const handleBegin = async () => {
+        clearError();
+        try {
+            await beginSetup();
+            setStep('qr');
+        }
+        catch { }
+    };
+    const handleVerify = async () => {
+        if (verifyCode.length !== 6)
+            return;
+        clearError();
+        try {
+            const codes = await verifySetup(verifyCode);
+            setVerifyCode('');
+            if (codes && codes.length > 0) {
+                setBackupCodes(codes);
+                setStep('backup');
+            }
+            else {
+                setStep('idle');
+            }
+        }
+        catch { }
+    };
+    const handleDisable = async () => {
+        if (!disablePassword)
+            return;
+        clearError();
+        try {
+            await disable(disablePassword);
+            setDisablePassword('');
+            setStep('idle');
+        }
+        catch { }
+    };
+    const copyBackupCodes = async () => {
+        if (!backupCodes)
+            return;
+        try {
+            await navigator.clipboard.writeText(backupCodes.join('\n'));
+        }
+        catch { }
+    };
+    if (loading && !status)
+        return null;
+    return ((0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2", children: (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-neutral-300 font-medium tracking-wider", children: "TWO FACTOR AUTH" }) }), (0, jsx_runtime_1.jsx)("span", { className: `px-2 py-0.5 rounded text-xs ${status?.enabled ? 'bg-green-900/30 text-green-400 border border-green-800' : 'bg-neutral-800 text-neutral-400 border border-neutral-700'}`, children: status?.enabled ? 'enabled' : 'disabled' })] }), error && ((0, jsx_runtime_1.jsx)("div", { className: "p-2 bg-red-900/20 border border-red-800 rounded text-xs text-red-300 mb-3", children: error })), step === 'idle' && !status?.enabled && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "Add an extra layer of security using Google Authenticator or any TOTP app." }), (0, jsx_runtime_1.jsx)("button", { onClick: handleBegin, disabled: loading, className: "px-3 py-1.5 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-xs disabled:opacity-50", children: loading ? 'Setting up...' : 'Enable 2FA' })] })), step === 'idle' && status?.enabled && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 mb-1", children: "STATUS" }), (0, jsx_runtime_1.jsxs)("div", { className: "text-green-400 text-sm", children: ["Active ", status.created_at ? `since ${new Date(status.created_at).toLocaleDateString()}` : ''] })] }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setStep('disable'), className: "px-3 py-1.5 border border-red-900 text-red-400 hover:bg-red-950 rounded text-xs", children: "Disable 2FA" })] })), step === 'qr' && setupData && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "1. Scan this QR code with Google Authenticator or any TOTP app." }), setupData.qr_code && ((0, jsx_runtime_1.jsx)("div", { className: "flex justify-center bg-white rounded p-4", children: (0, jsx_runtime_1.jsx)("img", { src: setupData.qr_code.startsWith('data:') ? setupData.qr_code : `data:image/png;base64,${setupData.qr_code}`, alt: "2FA QR Code", className: "w-48 h-48" }) })), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-800 rounded p-3", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-1", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-xs text-neutral-400", children: "MANUAL KEY" }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setShowSecret(!showSecret), className: "text-neutral-500 hover:text-neutral-300 text-xs", children: showSecret ? 'hide' : 'show' })] }), (0, jsx_runtime_1.jsx)("code", { className: "text-xs text-cyan-400 break-all", children: showSecret ? setupData.secret : '••••••••••••••••' })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "2. Enter the 6-digit code from your app." }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("input", { type: "text", value: verifyCode, onChange: (e) => setVerifyCode(e.target.value.replace(/\D/g, '').slice(0, 6)), placeholder: "000000", className: "flex-1 bg-neutral-800 border border-neutral-700 text-white p-2 rounded text-center text-lg font-mono tracking-[0.5em] outline-none focus:border-cyan-500", maxLength: 6 }), (0, jsx_runtime_1.jsx)("button", { onClick: handleVerify, disabled: loading || verifyCode.length !== 6, className: "px-4 py-2 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-xs disabled:opacity-50", children: loading ? 'Verifying...' : 'Verify' })] }), (0, jsx_runtime_1.jsx)("button", { onClick: () => {
+                            setStep('idle');
+                            setVerifyCode('');
+                            clearSetup();
+                        }, className: "w-full py-2 text-neutral-500 hover:text-neutral-300 text-xs", children: "Cancel" })] })), step === 'backup' && backupCodes && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-yellow-950/30 border border-yellow-900/50 rounded p-3", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-xs text-yellow-400 font-medium mb-1", children: "Save your backup codes" }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-yellow-600", children: "These codes can be used to access your account if you lose your authenticator. Each code can only be used once. Store them safely." })] }), (0, jsx_runtime_1.jsx)("div", { className: "bg-neutral-800 rounded p-4 font-mono text-sm space-y-1", children: backupCodes.map((code, i) => ((0, jsx_runtime_1.jsx)("div", { className: "text-cyan-400", children: code }, i))) }), (0, jsx_runtime_1.jsx)("button", { onClick: copyBackupCodes, className: "w-full px-3 py-2 border border-neutral-700 text-neutral-300 hover:bg-neutral-800 rounded text-xs", children: "Copy codes" }), (0, jsx_runtime_1.jsx)("button", { onClick: () => {
+                            setStep('idle');
+                            setBackupCodes(null);
+                        }, className: "w-full px-3 py-2 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-xs", children: "Done" })] })), step === 'disable' && ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "Enter your password to disable two-factor authentication." }), (0, jsx_runtime_1.jsx)("input", { type: "password", value: disablePassword, onChange: (e) => setDisablePassword(e.target.value), placeholder: "Current password", className: "w-full bg-neutral-800 border border-neutral-700 text-white p-2 rounded text-sm outline-none focus:border-cyan-500" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => {
+                                    setStep('idle');
+                                    setDisablePassword('');
+                                }, className: "flex-1 px-3 py-1.5 text-neutral-500 hover:text-neutral-300 text-xs", children: "Cancel" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleDisable, disabled: loading || !disablePassword, className: "flex-1 px-3 py-1.5 bg-red-900 hover:bg-red-800 text-white rounded text-xs disabled:opacity-50", children: loading ? 'Disabling...' : 'Disable 2FA' })] })] }))] }));
+}

package/dist/components/queue/queue-status-page.d.ts

@@ -1,5 +1,6 @@
 export interface MicrocosmQueueStatusPageProps {
     basePath?: string;
     onNavigate?: (path: string) => void;
+    isAdmin?: boolean;
 }
-export declare function MicrocosmQueueStatusPage({}?: MicrocosmQueueStatusPageProps): import("react/jsx-runtime").JSX.Element;
+export declare function MicrocosmQueueStatusPage({ isAdmin }?: MicrocosmQueueStatusPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/queue/queue-status-page.js

@@ -13,9 +13,11 @@ const LEVEL_LABELS = {
     warden: 'Warden',
     admiral: 'Admiral',
 };
-function MicrocosmQueueStatusPage({} = {}) {
+function MicrocosmQueueStatusPage({ isAdmin = false } = {}) {
     const api = (0, auth_react_1.useMicrocosmApi)();
     const [userQueue, setUserQueue] = (0, react_1.useState)(null);
+    const [adminQueue, setAdminQueue] = (0, react_1.useState)(null);
+    const [expansion, setExpansion] = (0, react_1.useState)(null);
     const [loading, setLoading] = (0, react_1.useState)(true);
     const [submitting, setSubmitting] = (0, react_1.useState)(false);
     const [showJoinConfirm, setShowJoinConfirm] = (0, react_1.useState)(false);
@@ -34,7 +36,45 @@ function MicrocosmQueueStatusPage({} = {}) {
         finally {
             setLoading(false);
         }
-    }, [api]);
+        if (isAdmin) {
+            try {
+                const adminRes = await api.get('/territories/queue/admin');
+                setAdminQueue(adminRes?.data ?? adminRes);
+            }
+            catch { }
+            try {
+                const expRes = await api.get('/territories/expansion/check');
+                setExpansion(expRes?.data ?? expRes);
+            }
+            catch { }
+        }
+    }, [api, isAdmin]);
+    const handleProcessQueue = async () => {
+        setSubmitting(true);
+        try {
+            await api.post('/territories/queue/process', { batch_size: 50 });
+            await loadStatus();
+        }
+        catch (e) {
+            setError(e instanceof Error ? e.message : 'Failed to process queue');
+        }
+        finally {
+            setSubmitting(false);
+        }
+    };
+    const handleTriggerExpansion = async () => {
+        setSubmitting(true);
+        try {
+            await api.post('/territories/expansion/trigger', {});
+            await loadStatus();
+        }
+        catch (e) {
+            setError(e instanceof Error ? e.message : 'Failed to trigger expansion');
+        }
+        finally {
+            setSubmitting(false);
+        }
+    };
     (0, react_1.useEffect)(() => { loadStatus(); }, [loadStatus]);
     const handleJoin = async () => {
         setSubmitting(true);
@@ -69,5 +109,5 @@ function MicrocosmQueueStatusPage({} = {}) {
     }
     const level = userQueue?.user_type?.toLowerCase() || 'miner';
     const levelLabel = LEVEL_LABELS[level] || 'Miner';
-    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 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-lg sm:text-2xl font-bold text-white tracking-wider", children: "Station Queue" }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs sm:text-sm text-neutral-400", children: "Your onboarding status" })] }), (0, jsx_runtime_1.jsx)("button", { onClick: loadStatus, className: "px-3 py-1.5 text-xs border border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-white rounded transition-colors", children: "Refresh" })] }), error && ((0, jsx_runtime_1.jsx)("div", { className: "p-3 bg-red-900/20 border border-red-800 rounded text-sm text-red-300", children: error })), (0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsx)("div", { className: "p-4 bg-neutral-800 rounded mb-4", 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)("div", { className: "text-xs text-neutral-400 tracking-wider", children: "CURRENT LEVEL" }), (0, jsx_runtime_1.jsx)("div", { className: "text-lg font-bold text-cyan-300", children: levelLabel })] }), (0, jsx_runtime_1.jsxs)("span", { className: "px-3 py-1 bg-cyan-900/30 text-cyan-300 rounded border border-cyan-700 text-xs", children: ["Lv.", Object.keys(LEVEL_LABELS).indexOf(level) + 3] })] }) }), userQueue?.is_onboarded ? ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-950 rounded-lg p-6 border border-neutral-700", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-lg font-semibold text-white", children: "Onboarded" }), (0, jsx_runtime_1.jsxs)("p", { className: "text-sm text-neutral-400", children: ["Assigned to ", userQueue.station_name || userQueue.territory_id || ''] })] }), (0, jsx_runtime_1.jsx)("span", { className: "px-2 py-1 bg-white/20 text-white rounded text-xs", children: "Active" })] }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-1 gap-4", children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 rounded-lg p-4 text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-xl font-bold text-white", children: userQueue.territory_id }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: "Territory ID" })] }) })] })) : userQueue?.in_queue ? ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-950 rounded-lg p-6 border border-neutral-800", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-lg font-semibold text-white", children: "In Queue" }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: "Waiting for station assignment" })] }), userQueue.status && ((0, jsx_runtime_1.jsx)("span", { className: "px-2 py-1 bg-cyan-900/30 text-cyan-300 rounded text-xs", children: userQueue.status }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4 mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-3xl font-bold text-white", children: userQueue.position || '-' }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "Position" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-3xl font-bold text-white", children: userQueue.estimated_wait_minutes || '-' }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "Est. wait (min)" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-sm font-semibold text-white truncate", children: userQueue.preferred_territory_id || 'Auto' }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "Preferred" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-sm font-semibold text-white", children: userQueue.joined_at ? new Date(userQueue.joined_at).toLocaleString() : '-' }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "Joined at" })] })] }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setShowCancelConfirm(true), disabled: submitting, className: "w-full py-2 bg-neutral-800 hover:bg-neutral-700 text-white rounded transition-colors disabled:opacity-50", children: "Cancel Queue" })] })) : ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-950 rounded-lg p-6 border border-neutral-800", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-4", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-lg font-semibold text-white", children: "Not Onboarded" }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: "Join the queue to be assigned a station" })] }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setShowJoinConfirm(true), disabled: submitting, className: "w-full py-2 bg-white/20 hover:bg-neutral-800 text-white border border-neutral-700 rounded transition-colors disabled:opacity-50", children: "Join Queue" })] }))] }), showJoinConfirm && ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4", onClick: () => setShowJoinConfirm(false), children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg w-full max-w-md p-6 space-y-4", onClick: e => e.stopPropagation(), children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-white font-medium", children: "Confirm Join Queue" }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: "You will be added to the station queue. Auto-assignment happens when a slot opens." }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => setShowJoinConfirm(false), className: "flex-1 px-3 py-2 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 rounded text-sm", children: "Cancel" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleJoin, disabled: submitting, className: "flex-1 px-3 py-2 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-sm disabled:opacity-50", children: submitting ? 'Joining...' : 'Confirm' })] })] }) })), showCancelConfirm && ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4", onClick: () => setShowCancelConfirm(false), children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg w-full max-w-md p-6 space-y-4", onClick: e => e.stopPropagation(), children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-white font-medium", children: "Cancel Queue" }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: "Are you sure? You will lose your current queue position." }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => setShowCancelConfirm(false), className: "flex-1 px-3 py-2 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 rounded text-sm", children: "Keep Waiting" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleCancel, disabled: submitting, className: "flex-1 px-3 py-2 bg-red-700 hover:bg-red-600 text-white rounded text-sm disabled:opacity-50", children: submitting ? 'Cancelling...' : 'Confirm Cancel' })] })] }) }))] }));
+    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 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-lg sm:text-2xl font-bold text-white tracking-wider", children: "Station Queue" }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs sm:text-sm text-neutral-400", children: "Your onboarding status" })] }), (0, jsx_runtime_1.jsx)("button", { onClick: loadStatus, className: "px-3 py-1.5 text-xs border border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-white rounded transition-colors", children: "Refresh" })] }), error && ((0, jsx_runtime_1.jsx)("div", { className: "p-3 bg-red-900/20 border border-red-800 rounded text-sm text-red-300", children: error })), (0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsx)("div", { className: "p-4 bg-neutral-800 rounded mb-4", 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)("div", { className: "text-xs text-neutral-400 tracking-wider", children: "CURRENT LEVEL" }), (0, jsx_runtime_1.jsx)("div", { className: "text-lg font-bold text-cyan-300", children: levelLabel })] }), (0, jsx_runtime_1.jsxs)("span", { className: "px-3 py-1 bg-cyan-900/30 text-cyan-300 rounded border border-cyan-700 text-xs", children: ["Lv.", Object.keys(LEVEL_LABELS).indexOf(level) + 3] })] }) }), userQueue?.is_onboarded ? ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-950 rounded-lg p-6 border border-neutral-700", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-lg font-semibold text-white", children: "Onboarded" }), (0, jsx_runtime_1.jsxs)("p", { className: "text-sm text-neutral-400", children: ["Assigned to ", userQueue.station_name || userQueue.territory_id || ''] })] }), (0, jsx_runtime_1.jsx)("span", { className: "px-2 py-1 bg-white/20 text-white rounded text-xs", children: "Active" })] }), (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-1 gap-4", children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 rounded-lg p-4 text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-xl font-bold text-white", children: userQueue.territory_id }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: "Territory ID" })] }) })] })) : userQueue?.in_queue ? ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-950 rounded-lg p-6 border border-neutral-800", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-lg font-semibold text-white", children: "In Queue" }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: "Waiting for station assignment" })] }), userQueue.status && ((0, jsx_runtime_1.jsx)("span", { className: "px-2 py-1 bg-cyan-900/30 text-cyan-300 rounded text-xs", children: userQueue.status }))] }), (0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4 mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-3xl font-bold text-white", children: userQueue.position || '-' }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "Position" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-3xl font-bold text-white", children: userQueue.estimated_wait_minutes || '-' }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "Est. wait (min)" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-sm font-semibold text-white truncate", children: userQueue.preferred_territory_id || 'Auto' }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "Preferred" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-sm font-semibold text-white", children: userQueue.joined_at ? new Date(userQueue.joined_at).toLocaleString() : '-' }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400", children: "Joined at" })] })] }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setShowCancelConfirm(true), disabled: submitting, className: "w-full py-2 bg-neutral-800 hover:bg-neutral-700 text-white rounded transition-colors disabled:opacity-50", children: "Cancel Queue" })] })) : ((0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-950 rounded-lg p-6 border border-neutral-800", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-4", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-lg font-semibold text-white", children: "Not Onboarded" }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: "Join the queue to be assigned a station" })] }), (0, jsx_runtime_1.jsx)("button", { onClick: () => setShowJoinConfirm(true), disabled: submitting, className: "w-full py-2 bg-white/20 hover:bg-neutral-800 text-white border border-neutral-700 rounded transition-colors disabled:opacity-50", children: "Join Queue" })] }))] }), isAdmin && adminQueue && ((0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { title: "Queue Management (Admin)", children: [(0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4 mb-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-950 rounded p-4 text-center border border-neutral-800", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-3xl font-bold text-white", children: adminQueue.pending_count ?? 0 }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400 mt-1", children: "Pending" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-950 rounded p-4 text-center border border-neutral-800", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-3xl font-bold text-white", children: adminQueue.processing_count ?? 0 }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400 mt-1", children: "Processing" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-950 rounded p-4 text-center border border-neutral-800", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-3xl font-bold text-white", children: adminQueue.total_in_queue ?? 0 }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400 mt-1", children: "Total in queue" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-950 rounded p-4 text-center border border-neutral-800", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-sm text-white", children: adminQueue.oldest_pending ? new Date(adminQueue.oldest_pending).toLocaleString() : '-' }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-400 mt-1", children: "Oldest pending" })] })] }), (0, jsx_runtime_1.jsx)("button", { onClick: handleProcessQueue, disabled: submitting, className: "w-full px-4 py-2 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-sm disabled:opacity-50", children: submitting ? 'Processing...' : 'Process Queue (batch 50)' })] })), isAdmin && expansion && ((0, jsx_runtime_1.jsx)(terminal_1.TerminalCard, { title: "Station Expansion (Admin)", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between mb-3", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-sm text-neutral-300", children: ["Needs expansion: ", expansion.needs_expansion ? 'YES' : 'NO'] }), expansion.reason && ((0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-500 mt-1", children: ["Reason: ", expansion.reason] }))] }), (0, jsx_runtime_1.jsx)("button", { onClick: handleTriggerExpansion, disabled: submitting || !expansion.needs_expansion, className: "px-4 py-2 bg-red-900/30 text-red-300 border border-red-800 hover:bg-red-900/50 rounded text-sm disabled:opacity-50", children: submitting ? 'Expanding...' : 'Trigger Expansion' })] }) })), showJoinConfirm && ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4", onClick: () => setShowJoinConfirm(false), children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg w-full max-w-md p-6 space-y-4", onClick: e => e.stopPropagation(), children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-white font-medium", children: "Confirm Join Queue" }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: "You will be added to the station queue. Auto-assignment happens when a slot opens." }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => setShowJoinConfirm(false), className: "flex-1 px-3 py-2 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 rounded text-sm", children: "Cancel" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleJoin, disabled: submitting, className: "flex-1 px-3 py-2 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-sm disabled:opacity-50", children: submitting ? 'Joining...' : 'Confirm' })] })] }) })), showCancelConfirm && ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4", onClick: () => setShowCancelConfirm(false), children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg w-full max-w-md p-6 space-y-4", onClick: e => e.stopPropagation(), children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-white font-medium", children: "Cancel Queue" }), (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-neutral-400", children: "Are you sure? You will lose your current queue position." }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => setShowCancelConfirm(false), className: "flex-1 px-3 py-2 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 rounded text-sm", children: "Keep Waiting" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleCancel, disabled: submitting, className: "flex-1 px-3 py-2 bg-red-700 hover:bg-red-600 text-white rounded text-sm disabled:opacity-50", children: submitting ? 'Cancelling...' : 'Confirm Cancel' })] })] }) }))] }));
 }

package/dist/components/stations/station-list-page.d.ts

@@ -2,5 +2,6 @@ export interface MicrocosmStationListPageProps {
     basePath?: string;
     onNavigate?: (path: string) => void;
     currentUid?: string;
+    isAdmin?: boolean;
 }
-export declare function MicrocosmStationListPage({ currentUid }?: MicrocosmStationListPageProps): import("react/jsx-runtime").JSX.Element;
+export declare function MicrocosmStationListPage({ currentUid, isAdmin }?: MicrocosmStationListPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/stations/station-list-page.js

@@ -6,10 +6,40 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const auth_react_1 = require("@microcosmmoney/auth-react");
 const terminal_1 = require("../terminal");
+const API_BASE = 'https://api.microcosm.money/v1';
+const cropToSquare = (file, size) => {
+    return new Promise((resolve, reject) => {
+        const img = new Image();
+        img.onload = () => {
+            const canvas = document.createElement('canvas');
+            canvas.width = size;
+            canvas.height = size;
+            const ctx = canvas.getContext('2d');
+            if (!ctx) {
+                reject(new Error('Canvas not supported'));
+                return;
+            }
+            const side = Math.min(img.width, img.height);
+            const sx = (img.width - side) / 2;
+            const sy = (img.height - side) / 2;
+            ctx.drawImage(img, sx, sy, side, side, 0, 0, size, size);
+            canvas.toBlob((blob) => {
+                if (!blob) {
+                    reject(new Error('Blob creation failed'));
+                    return;
+                }
+                resolve(new File([blob], file.name, { type: 'image/jpeg' }));
+            }, 'image/jpeg', 0.85);
+        };
+        img.onerror = () => reject(new Error('Image load failed'));
+        img.src = URL.createObjectURL(file);
+    });
+};
 const UNIT_LABELS = { station: 'Station', matrix: 'Matrix', sector: 'Sector', system: 'System' };
 const MAGISTRATE_TITLES = { station: 'Commander', matrix: 'Pioneer', sector: 'Warden', system: 'Admiral' };
-function MicrocosmStationListPage({ currentUid } = {}) {
+function MicrocosmStationListPage({ currentUid, isAdmin = false } = {}) {
     const api = (0, auth_react_1.useMicrocosmApi)();
+    const { getAccessToken } = (0, auth_react_1.useMicrocosmContext)();
     const [units, setUnits] = (0, react_1.useState)([]);
     const [summary, setSummary] = (0, react_1.useState)(null);
     const [loading, setLoading] = (0, react_1.useState)(true);
@@ -20,6 +50,10 @@ function MicrocosmStationListPage({ currentUid } = {}) {
     const [editFormData, setEditFormData] = (0, react_1.useState)({ unit_name: '', description: '' });
     const [submitting, setSubmitting] = (0, react_1.useState)(false);
     const [error, setError] = (0, react_1.useState)(null);
+    const [imageFile, setImageFile] = (0, react_1.useState)(null);
+    const [imagePreview, setImagePreview] = (0, react_1.useState)(null);
+    const [uploadingImage, setUploadingImage] = (0, react_1.useState)(false);
+    const fileInputRef = (0, react_1.useRef)(null);
     const loadSummary = (0, react_1.useCallback)(async () => {
         try {
             const res = await api.get('/territories/summary');
@@ -75,17 +109,91 @@ function MicrocosmStationListPage({ currentUid } = {}) {
     const openEditDialog = (unit) => {
         setEditingUnit(unit);
         setEditFormData({ unit_name: unit.unit_name, description: unit.description || '' });
+        setImageFile(null);
+        setImagePreview(null);
+    };
+    const handleFileSelect = (e) => {
+        const file = e.target.files?.[0];
+        if (!file)
+            return;
+        if (!file.type.startsWith('image/')) {
+            setError('Please select an image file');
+            return;
+        }
+        if (file.size > 2 * 1024 * 1024) {
+            setError('Image must be under 2MB');
+            return;
+        }
+        cropToSquare(file, 512)
+            .then(cropped => {
+            setImageFile(cropped);
+            const reader = new FileReader();
+            reader.onload = (ev) => setImagePreview(ev.target?.result);
+            reader.readAsDataURL(cropped);
+        })
+            .catch(() => setError('Image processing failed'));
+    };
+    const uploadImage = async (unitId) => {
+        if (!imageFile)
+            return true;
+        setUploadingImage(true);
+        try {
+            const token = await getAccessToken();
+            if (!token)
+                throw new Error('Not authenticated');
+            const formData = new FormData();
+            formData.append('image', imageFile, imageFile.name);
+            const response = await fetch(`${API_BASE}/territories/${unitId}/image`, {
+                method: 'POST',
+                headers: { Authorization: `Bearer ${token}` },
+                body: formData,
+            });
+            if (!response.ok) {
+                const err = await response.json().catch(() => ({}));
+                throw new Error(err.detail || err.error || 'Image upload failed');
+            }
+            return true;
+        }
+        catch (e) {
+            setError(e instanceof Error ? e.message : 'Image upload failed');
+            return false;
+        }
+        finally {
+            setUploadingImage(false);
+        }
+    };
+    const handleImageReview = async (unitId, status) => {
+        try {
+            await api.put(`/territories/${unitId}/image/review`, { status });
+            await loadUnits();
+            if (editingUnit && editingUnit.unit_id === unitId) {
+                setEditingUnit({ ...editingUnit, image_status: status });
+            }
+        }
+        catch (e) {
+            setError(e instanceof Error ? e.message : 'Review failed');
+        }
     };
     const handleEdit = async () => {
         if (!editingUnit || !editFormData.unit_name.trim())
             return;
         setSubmitting(true);
+        setError(null);
         try {
+            if (imageFile) {
+                const ok = await uploadImage(editingUnit.unit_id);
+                if (!ok) {
+                    setSubmitting(false);
+                    return;
+                }
+            }
             await api.put(`/territories/${editingUnit.unit_id}`, {
                 unit_name: editFormData.unit_name,
                 description: editFormData.description,
             });
             setEditingUnit(null);
+            setImageFile(null);
+            setImagePreview(null);
             await loadUnits();
         }
         catch (e) {
@@ -98,5 +206,13 @@ function MicrocosmStationListPage({ currentUid } = {}) {
     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 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: "Station List" }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs sm:text-sm text-neutral-400", children: "All territories (Station / Matrix / Sector / System)" })] }), error && ((0, jsx_runtime_1.jsx)("div", { className: "p-3 bg-red-900/20 border border-red-800 rounded text-sm text-red-300", children: error })), summary && ((0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4", children: [(0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: "TOTAL STATIONS" }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold text-white", children: summary.total_stations ?? 0 })] }), (0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: "TOTAL MEMBERS" }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold text-cyan-400", children: summary.total_members ?? 0 })] }), (0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: "VAULT MCD" }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold text-cyan-400", children: (summary.total_vault_mcd ?? 0).toLocaleString(undefined, { maximumFractionDigits: 0 }) })] }), (0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 tracking-wider mb-1", children: "AVG KPI" }), (0, jsx_runtime_1.jsx)("div", { className: "text-2xl font-bold text-white", children: (summary.avg_kpi_score ?? 0).toFixed(1) })] })] })), (0, jsx_runtime_1.jsx)(terminal_1.TerminalCard, { children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col md:flex-row gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex gap-2 flex-wrap", children: ['all', 'station', 'matrix', 'sector', 'system'].map(f => ((0, jsx_runtime_1.jsx)("button", { onClick: () => setFilter(f), className: `px-3 py-1.5 text-sm rounded transition-colors ${filter === f ? 'bg-cyan-700 text-white' : 'bg-neutral-800 text-neutral-400 hover:bg-neutral-700 hover:text-white'}`, children: f === 'all' ? 'All' : UNIT_LABELS[f] }, f))) }), (0, jsx_runtime_1.jsx)("input", { type: "text", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), placeholder: "Search by name / location / short_id...", className: "flex-1 bg-neutral-800 border border-neutral-600 text-white rounded px-3 py-1.5 text-sm focus:outline-none focus:border-cyan-400" })] }) }), loading ? ((0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center py-20", children: (0, jsx_runtime_1.jsx)("span", { className: "text-neutral-400", children: "Loading units..." }) })) : filteredUnits.length === 0 ? ((0, jsx_runtime_1.jsx)(terminal_1.TerminalCard, { children: (0, jsx_runtime_1.jsx)("div", { className: "text-center py-8 text-neutral-500", children: "No units match your filter" }) })) : ((0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4", children: filteredUnits.map(unit => {
                     const metrics = unitDataCache[unit.unit_id];
                     return ((0, jsx_runtime_1.jsxs)(terminal_1.TerminalCard, { 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.jsx)("div", { className: "text-white font-semibold", children: unit.unit_name }), (0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-500", children: [UNIT_LABELS[unit.unit_type], " \u00B7 ", MAGISTRATE_TITLES[unit.unit_type]] }), unit.short_id && ((0, jsx_runtime_1.jsx)("div", { className: "text-xs font-mono text-cyan-400 mt-1", children: unit.short_id }))] }), canEditUnit(unit) && ((0, jsx_runtime_1.jsx)("button", { onClick: () => openEditDialog(unit), className: "text-xs px-2 py-1 border border-neutral-700 text-neutral-400 hover:text-white hover:bg-neutral-800 rounded", children: "Edit" }))] }), unit.description && ((0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-400 mb-3 line-clamp-2", children: unit.description })), metrics && ((0, jsx_runtime_1.jsxs)("div", { className: "grid grid-cols-2 gap-2 pt-3 border-t border-neutral-700", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: "Members" }), (0, jsx_runtime_1.jsxs)("div", { className: "text-sm text-white", children: [metrics.member_count, "/", metrics.max_capacity] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: "Occupancy" }), (0, jsx_runtime_1.jsxs)("div", { className: "text-sm text-cyan-400", children: [(metrics.occupancy_rate * 100).toFixed(0), "%"] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "col-span-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: "Vault MCD" }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm text-white", children: (metrics.vault_mcd ?? 0).toLocaleString(undefined, { maximumFractionDigits: 0 }) })] })] })), unit.image_status === 'pending' && ((0, jsx_runtime_1.jsx)("div", { className: "mt-2 text-xs text-yellow-400", children: "Image pending review" }))] }, unit.unit_id));
-                }) })), editingUnit && ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4", onClick: () => setEditingUnit(null), children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg w-full max-w-lg p-6 space-y-4", onClick: e => e.stopPropagation(), children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-medium", children: ["Edit ", editingUnit.unit_name] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "text-xs text-neutral-400 tracking-wider block mb-1", children: "Name" }), (0, jsx_runtime_1.jsx)("input", { type: "text", value: editFormData.unit_name, onChange: (e) => setEditFormData({ ...editFormData, unit_name: e.target.value }), className: "w-full bg-neutral-800 border border-neutral-600 text-white rounded px-3 py-2 text-sm" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "text-xs text-neutral-400 tracking-wider block mb-1", children: "Description" }), (0, jsx_runtime_1.jsx)("textarea", { value: editFormData.description, onChange: (e) => setEditFormData({ ...editFormData, description: e.target.value }), rows: 4, className: "w-full bg-neutral-800 border border-neutral-600 text-white rounded px-3 py-2 text-sm" })] }), (0, jsx_runtime_1.jsx)("div", { className: "text-xs text-neutral-500", children: "Note: image upload available on main portal only" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => setEditingUnit(null), className: "flex-1 px-3 py-2 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 rounded text-sm", children: "Cancel" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleEdit, disabled: submitting || !editFormData.unit_name.trim(), className: "flex-1 px-3 py-2 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-sm disabled:opacity-50", children: submitting ? 'Saving...' : 'Save' })] })] }) }))] }));
+                }) })), editingUnit && ((0, jsx_runtime_1.jsx)("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4", onClick: () => setEditingUnit(null), children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-neutral-900 border border-neutral-700 rounded-lg w-full max-w-lg p-6 space-y-4 max-h-[90vh] overflow-y-auto", onClick: e => e.stopPropagation(), children: [(0, jsx_runtime_1.jsxs)("h3", { className: "text-white font-medium", children: ["Edit ", editingUnit.unit_name] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "text-xs text-neutral-400 tracking-wider block mb-1", children: "Name" }), (0, jsx_runtime_1.jsx)("input", { type: "text", value: editFormData.unit_name, onChange: (e) => setEditFormData({ ...editFormData, unit_name: e.target.value }), className: "w-full bg-neutral-800 border border-neutral-600 text-white rounded px-3 py-2 text-sm" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "text-xs text-neutral-400 tracking-wider block mb-1", children: "Description" }), (0, jsx_runtime_1.jsx)("textarea", { value: editFormData.description, onChange: (e) => setEditFormData({ ...editFormData, description: e.target.value }), rows: 4, className: "w-full bg-neutral-800 border border-neutral-600 text-white rounded px-3 py-2 text-sm" })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", { className: "text-xs text-neutral-400 tracking-wider block mb-1", children: "Image" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-3", children: [(imagePreview || editingUnit.image_url) ? ((0, jsx_runtime_1.jsx)("img", { src: imagePreview || editingUnit.image_url, alt: "", className: "w-24 h-24 rounded object-cover border border-neutral-700" })) : ((0, jsx_runtime_1.jsx)("div", { className: "w-24 h-24 rounded bg-neutral-800 border border-neutral-700 flex items-center justify-center text-xs text-neutral-500", children: "No image" })), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 space-y-2", children: [(0, jsx_runtime_1.jsx)("input", { ref: fileInputRef, type: "file", accept: "image/jpeg,image/png,image/webp", onChange: handleFileSelect, className: "hidden" }), (0, jsx_runtime_1.jsx)("button", { onClick: () => fileInputRef.current?.click(), disabled: uploadingImage, className: "w-full px-3 py-1.5 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 hover:text-white rounded text-sm", children: imageFile ? 'Change' : 'Select image' }), imageFile && ((0, jsx_runtime_1.jsxs)("div", { className: "text-xs text-neutral-500", children: [imageFile.name, " (", (imageFile.size / 1024).toFixed(1), "KB)"] })), editingUnit.image_status && ((0, jsx_runtime_1.jsx)("div", { className: `text-xs px-2 py-0.5 rounded inline-block ${editingUnit.image_status === 'approved'
+                                                        ? 'bg-green-900/30 text-green-400'
+                                                        : editingUnit.image_status === 'rejected'
+                                                            ? 'bg-red-900/30 text-red-400'
+                                                            : 'bg-yellow-900/30 text-yellow-400'}`, children: editingUnit.image_status }))] })] }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-neutral-500 mt-2", children: "Max 2MB. Auto-cropped to square (512\u00D7512). JPG/PNG/WebP." })] }), isAdmin && editingUnit.image_url && editingUnit.image_status === 'pending' && ((0, jsx_runtime_1.jsxs)("div", { className: "pt-3 border-t border-neutral-700 space-y-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xs text-cyan-400 tracking-wider", children: "ADMIN REVIEW" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => handleImageReview(editingUnit.unit_id, 'approved'), className: "flex-1 px-3 py-1.5 bg-green-900/30 text-green-400 hover:bg-green-900/50 border border-green-800 rounded text-sm", children: "Approve" }), (0, jsx_runtime_1.jsx)("button", { onClick: () => handleImageReview(editingUnit.unit_id, 'rejected'), className: "flex-1 px-3 py-1.5 bg-red-900/30 text-red-400 hover:bg-red-900/50 border border-red-800 rounded text-sm", children: "Reject" })] })] })), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2 pt-2", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => {
+                                        setEditingUnit(null);
+                                        setImageFile(null);
+                                        setImagePreview(null);
+                                    }, className: "flex-1 px-3 py-2 border border-neutral-700 text-neutral-400 hover:bg-neutral-800 rounded text-sm", children: "Cancel" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleEdit, disabled: submitting || uploadingImage || !editFormData.unit_name.trim(), className: "flex-1 px-3 py-2 bg-cyan-700 hover:bg-cyan-600 text-white rounded text-sm disabled:opacity-50", children: uploadingImage ? 'Uploading...' : submitting ? 'Saving...' : 'Save' })] })] }) }))] }));
 }

package/dist/index.d.ts

@@ -79,3 +79,7 @@ export { MicrocosmRewardsPage } from './components/rewards/rewards-page';
 export type { MicrocosmRewardsPageProps } from './components/rewards/rewards-page';
 export { MicrocosmProfilePage } from './components/profile/profile-page';
 export type { MicrocosmProfilePageProps } from './components/profile/profile-page';
+export { MicrocosmEmailChangeCard } from './components/profile/email-change-card';
+export type { MicrocosmEmailChangeCardProps } from './components/profile/email-change-card';
+export { MicrocosmTwoFactorSettings } from './components/profile/two-factor-settings';
+export type { MicrocosmTwoFactorSettingsProps } from './components/profile/two-factor-settings';

package/dist/index.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MicrocosmTerritoryPage = exports.MicrocosmAuctionPage = exports.MicrocosmMCDPage = exports.MicrocosmMiningPage = exports.MicrocosmWalletPage = exports.MicrocosmLendingPage = exports.MicrocosmFragmentPage = exports.MicrocosmLockPeriods = exports.MicrocosmMCDStats = exports.MicrocosmMCCTokenStats = exports.MicrocosmEcosystemStats = exports.MicrocosmMyMining = exports.MicrocosmMiningWeight = exports.MicrocosmMintingStats = exports.MicrocosmPriceChart = exports.MicrocosmAssetsSummary = exports.MicrocosmQuickActions = exports.MicrocosmMarketBar = exports.MicrocosmDashboardOverview = exports.KPIRadialChart = exports.VoteResultBar = exports.MiningProgressBar = exports.TerritoryCard = exports.TerminalTooltip = exports.TerminalInput = exports.TerminalCountdown = exports.TerminalDialog = exports.TerminalTabs = exports.TerminalTable = exports.TerminalProgress = exports.TerminalDataRow = exports.TerminalBadge = exports.TerminalEmpty = exports.TerminalError = exports.TerminalLoading = exports.TerminalPageHeader = exports.TerminalCommand = exports.StatBox = exports.TerminalCard = exports.getMenuDescription = exports.getMenuTitle = exports.resolveMenuPath = exports.getAllMenuItems = exports.microcosmMenuGroups = exports.dashboardMenu = exports.web3OsMenu = exports.blockchainMenu = exports.useLinkComponent = exports.LinkProvider = exports.MicrocosmMenuSection = void 0;
-exports.MicrocosmProfilePage = exports.MicrocosmRewardsPage = exports.MicrocosmStationListPage = exports.MicrocosmQueueStatusPage = exports.MicrocosmManagerIncomePage = exports.MicrocosmReincarnationPage = exports.MicrocosmVotingPage = exports.MicrocosmOrganizationPage = void 0;
+exports.MicrocosmTwoFactorSettings = exports.MicrocosmEmailChangeCard = exports.MicrocosmProfilePage = exports.MicrocosmRewardsPage = exports.MicrocosmStationListPage = exports.MicrocosmQueueStatusPage = exports.MicrocosmManagerIncomePage = exports.MicrocosmReincarnationPage = exports.MicrocosmVotingPage = exports.MicrocosmOrganizationPage = void 0;
 var menu_section_1 = require("./components/menu-section");
 Object.defineProperty(exports, "MicrocosmMenuSection", { enumerable: true, get: function () { return menu_section_1.MicrocosmMenuSection; } });
 var link_context_1 = require("./link-context");
@@ -101,3 +101,7 @@ var rewards_page_1 = require("./components/rewards/rewards-page");
 Object.defineProperty(exports, "MicrocosmRewardsPage", { enumerable: true, get: function () { return rewards_page_1.MicrocosmRewardsPage; } });
 var profile_page_1 = require("./components/profile/profile-page");
 Object.defineProperty(exports, "MicrocosmProfilePage", { enumerable: true, get: function () { return profile_page_1.MicrocosmProfilePage; } });
+var email_change_card_1 = require("./components/profile/email-change-card");
+Object.defineProperty(exports, "MicrocosmEmailChangeCard", { enumerable: true, get: function () { return email_change_card_1.MicrocosmEmailChangeCard; } });
+var two_factor_settings_1 = require("./components/profile/two-factor-settings");
+Object.defineProperty(exports, "MicrocosmTwoFactorSettings", { enumerable: true, get: function () { return two_factor_settings_1.MicrocosmTwoFactorSettings; } });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@microcosmmoney/portal-react",
-  "version": "3.6.0",
+  "version": "3.8.0",
   "description": "Microcosm Portal UI components for React/Next.js",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -19,7 +19,7 @@
   },
   "dependencies": {
     "@microcosmmoney/auth-core": "^2.3.2",
-    "@microcosmmoney/auth-react": "^2.4.0"
+    "@microcosmmoney/auth-react": "^2.5.0"
   },
   "devDependencies": {
     "@types/react": "^18.0.0",