+
+
+ Liquidation dashboard
+
+
+ Every borrower position on chain, joined to live oracle prices and the
+ market's tier parameters. Health factor uses the on-chain formula
+ (health_factor.go); close factor is dynamic by HF (close_factor.go); LIF
+ is per-tier. Executing a liquidation uses the Liquidate form on the
+ market page.
+
+
+
+
+
+
Liquidatable positions
+
+ {liquidatableCount}
+
+
+ {unpricedCount > 0 ? `${unpricedCount} unpriced (HF n/a)` : "all assessable"}
+
+
+
Monitored positions
+
+ {list.length}
+
+
{pricedCount} with oracle price
+
+
Total debt value
+
+ {fmtUsd(totalDebtUsd)}
+
+
priced positions only
+
+
Total collateral value
+
+ {fmtUsd(totalCollUsd)}
+
+
priced positions only
+
+
+ {liquidatableCount === 0 && pricedCount > 0 && (
+
+ All {pricedCount} priced positions are healthy - none are currently below the liquidation threshold (HF <= 1.0).
+
+ )}
+
+
+
+ Borrower positions
+
+ {isLoading ? (
+ Loading positions…
+ ) : list.length === 0 ? (
+
+ No borrower positions on chain.
+
+ ) : (
+
+
+
+
+ Position
+ Market
+ Debt value
+ Collateral value
+ HF
+ Close factor
+ LIF
+ Distance
+ Action
+
+
+
+ {list.map((p) => (
+
+
+
+ {unpricedCount} position(s) use assets without an oracle price, so their
+ health factor cannot be computed and they are excluded from the dollar
+ totals. Post a price for those assets (Oracle page) to assess them.
+
+ )}
+
+ Bad-debt coverage (the 4-layer waterfall: borrower collateral → R_fund →
+ backstop → loss factor) is on the{" "}
+
+
+
+
+
+
+
+ {market.marketId}
+
+
+
+
+
+
+
+
+ {(() => {
+ const utilBps = market.totalSupplied > 0n
+ ? Number((market.totalBorrowed * 10000n) / market.totalSupplied)
+ : 0;
+ const reserveFactor = Number(market.reserveFactorBps);
+ const borrowApr = (borrowRateBpsLocal(utilBps) / 100).toFixed(2);
+ const supplyApr = (supplyRateBpsLocal(utilBps, reserveFactor) / 100).toFixed(2);
+ return (
+
+
+
+
What would I earn if I lend?
+
{supplyApr}% APR
+
Current supply yield at {Math.round(utilBps / 100)}% utilization
+
+
+
What would it cost me to borrow?
+
{borrowApr}% APR
+
Current borrow cost at {Math.round(utilBps / 100)}% utilization
+
+
+
+
+
+
Total supplied
+
{formatAmount(market.totalSupplied, 0)}
+
+
+
Total borrowed
+
{formatAmount(market.totalBorrowed, 0)}
+
+
+
Reserve fund
+
{formatAmount(reserveFund, 0)}
+
+
+
+
+ Protocol internals
+
+
+
S rate
+
{formatRay(supplyIndex.sRate)}
+
+
+
B index
+
{fmtIndex(bIndex, BINDEX_BASE)}×
+
+
+
Loss factor
+
{formatRay(lossFactor)}
+
+
+
Layer4 pending
+
{market.layer4PendingCount}
+
+
+
+ );
+ })()}
+
+
+
+
+ Your position
+
+
+ {!wallet.isConnected && (
+
+ Connect a wallet to view positions.
+
+ )}
+
+ {wallet.isConnected && (
+
+
+ Lender shares
+
+ {formatAmount(lenderPosition?.shares ?? 0n, 0)}
+
+
+
+
+ Collateral
+
+ {formatAmount(
+ borrowerPosition?.collateralQuantity ?? 0n,
+ 0
+ )}
+
+
+
+
+
+ Debt
+
+
+ {formatAmount(currentDebt, 0)}
+
+
+
+
+
Health factor
+ {pricesAvailable && borrowerPosition ? (
+
+ {hf === 0n ? (
+
+ No debt
+
+ ) : (
+ <>
+
= 1_100_000n ? 'bg-emerald-500/20 text-emerald-400' :
+ hf >= 1_000_000n ? 'bg-amber-500/20 text-amber-400' :
+ 'bg-red-500/20 text-red-400'
+ }`}>
+ {hf >= 1_100_000n ? 'Safe' : hf >= 1_000_000n ? 'Caution' : 'At risk'}
+
+
+
= 1_100_000n ? 'bg-emerald-500' :
+ hf >= 1_000_000n ? 'bg-amber-500' :
+ 'bg-red-500'
+ }`}
+ style={{ width: `${Math.min(100, Number(hf * 100n / 2_000_000n))}%` }}
+ />
+
+
{formatHealthFactor(hf)}
+
+ )}
+
+ ) : (
+
--
+ )}
+
+
+ )}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/frontend/src/app/monitor/page.tsx b/frontend/src/app/monitor/page.tsx
new file mode 100644
index 0000000000..22afa45cd6
--- /dev/null
+++ b/frontend/src/app/monitor/page.tsx
@@ -0,0 +1,328 @@
+"use client";
+
+import { useCallback, useEffect, useState } from "react";
+import { useMarkets, type MarketWithIndices } from "@/lib/hooks/useMarkets";
+import { useMarketPools } from "@/lib/hooks/useMarketPools";
+import { formatAmount } from "@/lib/arbor/format";
+import { getTreasury } from "@/lib/canopy/pluginRpc";
+import { RAY } from "@/lib/arbor/constants";
+import { useAssetPrice } from "@/lib/hooks/useAssetPrice";
+
+function Flag({ bad }: { bad: boolean }) {
+ return bad ? (
+
+
+ ) : (
+
+
+ );
+}
+
+function LayerCard({
+ layer,
+ title,
+ desc,
+ value,
+ sub,
+ tone,
+}: {
+ layer: string;
+ title: string;
+ desc: string;
+ value: string;
+ sub?: string;
+ tone: "emerald" | "indigo" | "zinc" | "rose";
+}) {
+ const ring =
+ tone === "emerald"
+ ? "border-emerald-500/30 bg-emerald-500/[0.06]"
+ : tone === "indigo"
+ ? "border-indigo-500/30 bg-indigo-500/[0.06]"
+ : tone === "rose"
+ ? "border-rose-500/30 bg-rose-500/[0.06]"
+ : "border-white/10 bg-white/[0.03]";
+ return (
+
+
+ {layer}
+
+
{title}
+
+ {value}
+
+ {sub &&
{sub}
}
+
{desc}
+
+ );
+}
+
+function MarketRow({
+ entry,
+ onCollateral,
+ onUsd,
+}: {
+ entry: MarketWithIndices;
+ onCollateral: (id: string, v: bigint) => void;
+ onUsd: (id: string, suppliedUsd: number, rfUsd: number, collateralUsd: number) => void;
+}) {
+ const m = entry.market;
+ const { data: pools } = useMarketPools(m.marketId);
+ const collateral = pools?.collateral ?? 0n;
+ const supply = pools?.supply ?? 0n;
+
+ useEffect(() => {
+ onCollateral(m.marketId, collateral);
+ return () => onCollateral(m.marketId, 0n);
+ }, [onCollateral, m.marketId, collateral]);
+
+ const { data: priceData } = useAssetPrice(m.debtAssetId);
+ const unitPrice =
+ priceData?.available && priceData.price != null
+ ? Number(priceData.price) / 1e8
+ : null;
+
+ const { data: collPriceData } = useAssetPrice(m.collateralAssetId);
+ const collUnitPrice =
+ collPriceData?.available && collPriceData.price != null
+ ? Number(collPriceData.price) / 1e8
+ : null;
+
+ useEffect(() => {
+ onUsd(
+ m.marketId,
+ unitPrice !== null ? Number(m.totalSupplied) * unitPrice : 0,
+ unitPrice !== null ? Number(entry.reserveFund) * unitPrice : 0,
+ collUnitPrice !== null ? Number(collateral) * collUnitPrice : 0
+ );
+ return () => onUsd(m.marketId, 0, 0, 0);
+ }, [onUsd, m.marketId, m.totalSupplied, entry.reserveFund, unitPrice, collateral, collUnitPrice]);
+
+
+function renderLossFactor(entry: { lossFactor: bigint; lossFactorAbsent: boolean }, status: string) {
+ const RAY = 1000000000000000000n;
+ if (entry.lossFactorAbsent) {
+ return
— ;
+ }
+ if (entry.lossFactor === 0n) {
+ if (status === "INSOLVENT") {
+ return
exhausted ;
+ }
+ return
exhausted ⚠ ;
+ }
+ if (entry.lossFactor === RAY) {
+ return
1.000000 ;
+ }
+ const v = Number(entry.lossFactor) / 1e18;
+ return
{v.toFixed(6)} ;
+}
+
+ const tvl = m.totalSupplied;
+ const rfRatio = tvl > 0n ? Number((entry.reserveFund * 10000n) / tvl) / 100 : 0;
+
+ return (
+
+ {m.marketId}
+ 0} />
+ {formatAmount(supply, 0)}
+
+
+ {formatAmount(collateral, 0)}
+
+
+ {formatAmount(entry.reserveFund, 0)}
+
+ {renderLossFactor(entry, m.status)}
+
+ {rfRatio.toFixed(1)}%
+
+
+ );
+}
+
+export default function MonitorPage() {
+ const { data: markets, isLoading } = useMarkets();
+ const list = markets ?? [];
+
+ const [collateralByMarket, setCollateralByMarket] = useState<
+ Record
+ >({});
+ const onCollateral = useCallback(
+ (id: string, v: bigint) => setCollateralByMarket((p) => ({ ...p, [id]: v })),
+ []
+ );
+
+ const [usdByMarket, setUsdByMarket] = useState<
+ Record
+ >({});
+ const onUsd = useCallback(
+ (id: string, s: number, rf: number, coll: number) =>
+ setUsdByMarket((p) => ({ ...p, [id]: { s, rf, c: coll } })),
+ []
+ );
+ const totalTvlUsd = Object.values(usdByMarket).reduce((a, v) => a + v.s, 0);
+ const totalRfUsd = Object.values(usdByMarket).reduce((a, v) => a + v.rf, 0);
+ const totalCollateralUsd = Object.values(usdByMarket).reduce((a, v) => a + v.c, 0);
+ const collateralBreakdown = list
+ .map((e) => ({
+ v: collateralByMarket[e.market.marketId] ?? 0n,
+ a: e.market.collateralAssetId,
+ }))
+ .filter((x) => x.v > 0n)
+ .map((x) => `${formatAmount(x.v, 0)} ${x.a}`)
+ .join(" \u00b7 ");
+
+ const totalRf = list.reduce((a, e) => a + e.reserveFund, 0n);
+ const [treasuryArbor, setTreasuryArbor] = useState(0n);
+ useEffect(() => {
+ let alive = true;
+ getTreasury("arbor").then((t) => { if (alive) setTreasuryArbor(t.amount); });
+ return () => { alive = false; };
+ }, []);
+ const totalTvl = list.reduce((a, e) => a + e.market.totalSupplied, 0n);
+ const totalCollateral = Object.values(collateralByMarket).reduce(
+ (a, b) => a + b,
+ 0n
+ );
+ const l4PendingBacklog = list.reduce(
+ (a, e) => a + e.market.layer4PendingCount,
+ 0
+ );
+ const l4Haircuted = list.filter((e) => e.lossFactor < RAY).length;
+ const coverageRatio =
+ totalTvl > 0n ? Number((totalRf * 10000n) / totalTvl) / 100 : 0;
+
+ return (
+
+
+
+ Reserve & risk monitor
+
+
+ Bad‑debt waterfall, reserve adequacy, and per‑market risk flags — read
+ live from the ARBOR plugin's custom queries.
+
+
+
+
+
+ 4‑layer bad‑debt waterfall
+
+
+ 0n ? "indigo" : "zinc"}
+ />
+ 0 ? `${l4PendingBacklog} pending` : l4Haircuted > 0 ? `${l4Haircuted} applied` : "0"}`}
+ tone={l4PendingBacklog > 0 || l4Haircuted > 0 ? "rose" : "zinc"}
+ />
+
+
+
+
+
+
Total R_fund
+
+ ${totalRfUsd.toLocaleString(undefined, { maximumFractionDigits: 2 })}
+
+
+ {formatAmount(totalRf, 0)} native
+
+
+
Total TVL (supplied)
+
+ ${totalTvlUsd.toLocaleString(undefined, { maximumFractionDigits: 2 })}
+
+
+ {formatAmount(totalTvl, 0)} native
+
+
+
R_fund / TVL coverage
+
+ {coverageRatio.toFixed(1)}%
+
+
+
+
+
+ Per‑market risk flags & reserves
+
+ {isLoading ? (
+ Loading markets…
+ ) : list.length === 0 ? (
+
+ No markets on chain yet.
+
+ ) : (
+
+
+
+
+ Market
+ Insolvent
+ Idx overflow
+ L4
+ Paused
+ Deprecated
+ Supply pool
+ Collat. pool
+ R_fund
+ Loss factor
+ R_fund/TVL
+
+
+
+ {list.map((entry) => (
+
+
+
+ Amounts in whole units. Supply/collateral pools from
+ /v1/query/pool; R_fund from /v1/query/reservefund; loss factor from
+ /v1/query/lossfactor (RAY = 1.0, no haircut).
+
+
+
; pool: bigint }>>([]);
+ const [loading, setLoading] = useState(false);
+ const [refreshKey, setRefreshKey] = useState(0);
+ const refetch = () => setRefreshKey((k) => k + 1);
+
+ useEffect(() => {
+ if (!wallet.address) return;
+ let alive = true;
+ getAllNasmVaults(wallet.address).then(async (list) => {
+ const withPool = await Promise.all(
+ list.map(async (v) => {
+ const p = await getNasmVaultPool(String(v.vaultId ?? ""));
+ return { v, pool: p?.amount ?? 0n };
+ })
+ );
+ if (alive) { setRows(withPool); setLoading(false); }
+ });
+ return () => { alive = false; };
+ }, [wallet.address, refreshKey]);
+
+ return (
+
+ Mint & manage NUSD
+
+
+
+ Your Vaults
+
+ Vaults owned by the connected wallet, enumerated live via
+ /v1/query/all-nasm-vaults?owner=… Collateral and minted NUSD principal come
+ from each NasmVault record; escrowed collateral from nasmvaultpool.
+
+ {!wallet.address ? (
+
+ Connect a wallet to view your vaults.
+
+ ) : loading ? (
+ Loading vaults…
+ ) : rows.length === 0 ? (
+
+ No NUSD vaults found for this address.
+
+ ) : (
+
+
+
+
+ Vault
+ Collateral
+ Escrowed
+ NUSD principal
+
+
+
+ {rows.map(({ v, pool }) => (
+
+ {String(v.vaultId)}
+
+
+
+
+ {formatAmount(pool, 0)}
+ {formatAmount(BigInt(String(v.nusdPrincipal ?? "0")), 6)}
+
+ ))}
+
+
+
+ );
+}
+
+export default function NusdPage() {
+ const wallet = useWalletStore();
+ const { data: markets } = useMarkets();
+ const [supply, setSupply] = useState(null);
+ const [sfi, setSfi] = useState<{ sfIndexDecimal: bigint; lastAccrualBlock: number } | null>(null);
+ const [treasury, setTreasury] = useState(null);
+ const [balance, setBalance] = useState(null);
+ const [tiers, setTiers] = useState<
+ Record
+ >({});
+
+ useEffect(() => {
+ let alive = true;
+ getNusdSupply().then((s) => { if (alive) setSupply(s.totalSupply); });
+ getStabilityFeeIndex().then((v) => { if (alive) setSfi(v); });
+ getTreasury("nasm").then((t) => { if (alive) setTreasury(t.amount); });
+ return () => { alive = false; };
+ }, []);
+
+ useEffect(() => {
+ if (!wallet.address) return;
+ let alive = true;
+ getNusdBalance(wallet.address).then((b) => { if (alive) setBalance(b.amount); });
+ return () => { alive = false; };
+ }, [wallet.address]);
+
+ const assetIds = Array.from(
+ new Set([
+ ...(markets ?? []).flatMap((e) => [e.market.collateralAssetId, e.market.debtAssetId]),
+ "eth", "CNPY", "usdc",
+ ])
+ );
+
+ useEffect(() => {
+ let alive = true;
+ Promise.all(assetIds.map((a) => getNasmTier(a))).then((rs) => {
+ if (!alive) return;
+ const map: Record = {};
+ for (const r of rs) map[r.assetId] = r;
+ setTiers(map);
+ });
+ return () => { alive = false; };
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [JSON.stringify(assetIds)]);
+
+ const sfMult = sfi ? Number((sfi.sfIndexDecimal * 1000000n) / RAY) / 1000000 : null;
+ const feePct = sfMult != null ? (sfMult - 1) * 100 : null;
+
+ return (
+
+
+
+ Arbor stablecoin · NASM
+
+
+
+
NUSD
+
+ The ARBOR-native stablecoin, minted against NASM-tier collateral via vaults. A
+ stability fee accrues to every minted position each block; the NASM treasury is
+ fully isolated from Arbor lending's.
+
+
+
+
Total supply
+
+ {supply != null ? formatAmount(supply, 6) : "—"}
+ NUSD
+
+
+
+
+
+
+
NUSD supply
+
+ {supply != null ? formatAmount(supply, 6) : "—"}
+
+
1e6 precision
+
+
+ Stability fee index
+
+
+
+
+ {sfMult != null ? sfMult.toFixed(6) + "×" : "—"}
+
+
+ {feePct != null ? "+" + feePct.toFixed(6) + "% accrued · " : ""}
+ {sfi ? "block " + sfi.lastAccrualBlock : "accruing per block"}
+
+
+
NASM treasury {"{41}"}
+
+ {treasury != null ? formatAmount(treasury, 6) : "—"}
+
+
isolated from Arbor {"{40}"}
+
+
Your NUSD balance
+
+ {wallet.address ? (balance != null ? formatAmount(balance, 6) : "—") : "connect wallet"}
+
+
+ {wallet.address ? "held by this address" : "to view your balance"}
+
+
+
+
+ NASM tier eligibility
+
+ Which assets may back NUSD minting, at NASM's tighter LTV table (bridged from
+ ARCM's {"{29}"} registry). Tier 2/3 assets are not eligible.
+
+
+
+
+
+ Asset
+ NASM tier
+ Max LTV
+ Liq LTV
+ Eligible
+
+
+
+ {assetIds.map((a) => {
+ const t = tiers[a];
+ return (
+
+
+
+
+
+ {t ? (t.eligible ? t.nasmTier : "—") : "…"}
+ {t && t.eligible ? fmtBps(t.ltvMaxBps) : "—"}
+ {t && t.eligible ? fmtBps(t.ltvLiqBps) : "—"}
+
+ {t ? (
+ t.eligible ? (
+ eligible
+ ) : (
+ not eligible
+ )
+ ) : (
+ …
+ )}
+
+
+ );
+ })}
+
+
+
+ Vault-level detail (per-vault collateral and minted NUSD) needs a vault id; the plugin
+ exposes /v1/query/nasmvault and /v1/query/nasmvaultpool per vault, but there is no route
+ to enumerate all vaults yet. Total supply and per-address balances above are live.
+
+
+
+
+
+
+ NASM tier concentration cap
+
+ No single NASM tier may back more than {fmtBps(maxBps)} of total NUSD supply (Spec
+ Section 3.3). A mint that would push a tier over this line is rejected on-chain.
+
+
+ {rows.map((r) => {
+ const pct = Number(r.shareBps) / 100;
+ const capPct = Number(maxBps) / 100;
+ const overCap = Number(r.shareBps) >= Number(maxBps);
+ const nearCap = !overCap && Number(r.shareBps) >= Number(maxBps) * 0.9;
+ return (
+
+
+ {r.label}
+
+ {isLoading ? "…" : `${formatAmount(r.backing, 6)} NUSD · ${pct.toFixed(2)}% of ${capPct.toFixed(0)}% cap`}
+
+
+
+ {overCap && (
+
At or above cap — mints into this tier will be rejected.
+ )}
+ {nearCap && (
+
Approaching cap — headroom is limited.
+ )}
+
+ );
+ })}
+
+ );
+}
diff --git a/frontend/src/app/oracle/page.tsx b/frontend/src/app/oracle/page.tsx
new file mode 100644
index 0000000000..2a6fcac6fb
--- /dev/null
+++ b/frontend/src/app/oracle/page.tsx
@@ -0,0 +1,235 @@
+"use client";
+import { AssetIcon } from "@/components/AssetIcon";
+
+import { useState } from "react";
+import { useQuery } from "@tanstack/react-query";
+import { useMarkets } from "@/lib/hooks/useMarkets";
+import { useAssetPrice } from "@/lib/hooks/useAssetPrice";
+import { getAllPrices } from "@/lib/canopy/pluginRpc";
+import { useBlockHeight } from "@/lib/hooks/useChainStatus";
+import { UpdatePriceForm } from "@/components/forms/UpdatePriceForm";
+import { EmptyState } from "@/components/widgets/EmptyState";
+import { LoadingSkeleton } from "@/components/widgets/LoadingSkeleton";
+import { SelectInput } from "@/components/forms/FormPrimitives";
+import { formatAmount } from "@/lib/arbor/format";
+import {
+ PRICE_DECIMALS,
+ DEFAULT_STALENESS_BLOCKS,
+ MIN_REPORTERS,
+ STATE_REFRESH_INTERVAL_MS,
+} from "@/lib/arbor/constants";
+
+function statusFor(age: bigint): { label: string; cls: string } {
+ if (age <= BigInt(DEFAULT_STALENESS_BLOCKS)) {
+ return { label: "Fresh", cls: "bg-emerald-500/15 text-emerald-300" };
+ }
+ if (age <= 300n) {
+ return { label: "Stale", cls: "bg-amber-500/15 text-amber-300" };
+ }
+ return { label: "Expired", cls: "bg-rose-500/15 text-rose-300" };
+}
+
+function shortAddr(b: Uint8Array): string {
+ const hex = Array.from(b)
+ .map((x) => x.toString(16).padStart(2, "0"))
+ .join("");
+ return hex.length > 12 ? `${hex.slice(0, 6)}…${hex.slice(-4)}` : hex || "—";
+}
+
+function PriceFreshnessTable({ assetId }: { assetId: string }) {
+ const { data: height } = useBlockHeight();
+ const { data: records, isLoading } = useQuery({
+ queryKey: ["price-records", assetId],
+ queryFn: () => getAllPrices(assetId),
+ refetchInterval: STATE_REFRESH_INTERVAL_MS,
+ staleTime: 20_000,
+ });
+
+ if (isLoading) return Loading…
;
+ if (!records || records.length === 0) {
+ return No submissions for {assetId}.
;
+ }
+
+ return (
+
+
+
+
+ Submitter
+ Price
+ Age
+ Status
+
+
+
+ {records.map((r, i) => {
+ const age =
+ height != null ? BigInt(height) - r.blockHeight : 0n;
+ const st = statusFor(age < 0n ? 0n : age);
+ return (
+
+
+ {shortAddr(r.submitter)}
+
+
+ ${formatAmount(r.price, PRICE_DECIMALS)}
+
+
+ {age.toString()} blk
+
+
+
+ {st.label}
+
+
+
+ );
+ })}
+
+
+
+
+
Oracle
+
+ Permissioned ARBOR price submissions scoped to a market. Resolution
+ quorum = {MIN_REPORTERS} fresh reporter(s) within{" "}
+ {DEFAULT_STALENESS_BLOCKS} blocks (devnet override; ARCM spec = 3).
+
+
+
+
+ setMarketId(e.target.value)}
+ >
+ {markets.map(({ market }) => (
+
+ {market.marketId}
+
+ ))}
+
+
+
+ {selectedMarket && (
+ <>
+
+
+
+ {selectedMarket.collateralAssetId} price
+
+
+ Median:{" "}
+
+ {collateralPrice?.available && collateralPrice.price
+ ? `$${formatAmount(collateralPrice.price, PRICE_DECIMALS)}`
+ : "--"}
+
+
+
+ Reporters:{" "}
+
+ {collateralPrice?.reporters ?? 0}
+
+
+ {!collateralPrice?.available && collateralPrice?.reason && (
+
+ {collateralPrice.reason}
+
+ )}
+
+
+
+
+ {selectedMarket.debtAssetId} price
+
+
+ Median:{" "}
+
+ {debtPrice?.available && debtPrice.price
+ ? `$${formatAmount(debtPrice.price, PRICE_DECIMALS)}`
+ : "--"}
+
+
+
+ Reporters:{" "}
+
+ {debtPrice?.reporters ?? 0}
+
+
+ {!debtPrice?.available && debtPrice?.reason && (
+
{debtPrice.reason}
+ )}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Circuit breaker
+
+
+ Deviation check (ARCM Rule 4) is{" "}
+ not yet active on-chain —
+ the {"{20}"} circuit-breaker state has no writer (price_resolve.go
+ discloses Rules 3 & 4 as deferred). No violations are tracked.
+
+
+
+ )}
+
+ {selectedMarketId &&
}
+
= {
+ 0: "Tier 0 · CNPY",
+ 1: "Tier 1 · BTC / ETH",
+ 2: "Tier 2 · Majors",
+ 3: "Tier 3 · Restricted",
+};
+
+// Rate model — exact mirror of contract/interest_rate.go (ARCM §14).
+const U_OPT = 8000;
+const BASE = 200;
+const S1 = 800;
+const S2 = 10000;
+const BPS = 10000;
+function borrowAprBps(u: number): number {
+ if (u <= U_OPT) return BASE + (u * S1) / U_OPT;
+ return BASE + S1 + ((u - U_OPT) * S2) / (BPS - U_OPT);
+}
+function supplyAprBps(u: number, rf: number): number {
+ const br = borrowAprBps(u);
+ return (br * u * (BPS - rf)) / (BPS * BPS);
+}
+
+function fmtUsd(n: number | null): string {
+ if (n === null || !Number.isFinite(n)) return "—";
+ if (n >= 1_000_000) return `$${(n / 1_000_000).toFixed(2)}M`;
+ if (n >= 1_000) return `$${(n / 1_000).toFixed(2)}K`;
+ if (n >= 1) return `$${n.toFixed(2)}`;
+ if (n > 0) return `$${n.toFixed(6)}`;
+ return "$0.00";
+}
+
+function fmtUnitPrice(price: bigint): string {
+ const u = Number(price) / 1e8;
+ return `$${u.toLocaleString(undefined, { maximumFractionDigits: 2 })}`;
+}
+
+function fmtPct(n: number | null): string {
+ if (n === null || !Number.isFinite(n)) return "—";
+ return `${n.toFixed(1)}%`;
+}
+
+function utilBand(u: number | null): { bar: string; text: string } {
+ if (u === null) return { bar: "bg-zinc-600", text: "text-zinc-500" };
+ if (u < 70) return { bar: "bg-emerald-400", text: "text-emerald-300" };
+ if (u < 85) return { bar: "bg-amber-400", text: "text-amber-300" };
+ return { bar: "bg-rose-400", text: "text-rose-300" };
+}
+
+function Monogram({ symbol }: { symbol: string }) {
+ return
+
+
+ {label}
+
+ {coins && coins.length > 0 && (
+
+ {coins.slice(0, 4).map((s) => (
+
+ +{coins.length - 4}
+
+ )}
+
+ )}
+
+
+ {value}
+
+ {sub &&
{sub}
}
+
+
+
+
+
{m.marketId}
+
+ {m.collateralAssetId} / {m.debtAssetId}
+
+
+
+
+
+
+
Supplied
+ {suppliedUsd !== null ? (
+ <>
+
+ {fmtUsd(suppliedUsd)}
+
+
+ {formatAmount(m.totalSupplied, 0)} {m.debtAssetId}
+
+
+ ) : (
+ <>
+
+ {formatAmount(m.totalSupplied, 0)}
+
+
+ {m.debtAssetId}
+
+
+ )}
+
+
+
Borrowed
+ {borrowedUsd !== null ? (
+ <>
+
+ {fmtUsd(borrowedUsd)}
+
+
+ {formatAmount(m.totalBorrowed, 0)} {m.debtAssetId}
+
+
+ ) : (
+ <>
+
+ {formatAmount(m.totalBorrowed, 0)}
+
+
+ {m.debtAssetId}
+
+
+ )}
+
+
+
+ Utilization
+ {fmtPct(util)}
+
+
+
+
+ Borrow APR
+
{borrowApr.toFixed(2)}%
+
+
+ Supply APR
+
{supplyApr.toFixed(2)}%
+
+
+
+ Protocol internals
+
+
+
+ R_fund
+
{formatAmount(entry.reserveFund, 0)}
+
+
+ Loss factor
+
{lossFactorRatio.toFixed(6)}
+
+
+ L4 pending
+
{m.layer4PendingCount}
+
+
+
+ {price !== null ? (
+
+ {m.debtAssetId} @ {fmtUnitPrice(price)} · live oracle
+
+ ) : (
+
+ USD valuation pending oracle quorum ({m.collateralAssetId}/
+ {m.debtAssetId})
+
+ )}
+
+ );
+}
+
+export default function HomePage() {
+ const { data: markets, isLoading, error } = useMarkets();
+ const [usd, setUsd] = useState<
+ Record
+ >({});
+ const [filter, setFilter] = useState("all");
+
+ const report = useCallback(
+ (id: string, s: number, b: number, priced: boolean) => {
+ setUsd((prev) => {
+ if (prev[id]?.s === s && prev[id]?.b === b && prev[id]?.priced === priced)
+ return prev;
+ return { ...prev, [id]: { s, b, priced } };
+ });
+ },
+ []
+ );
+
+ const list = markets ?? [];
+ const count = list.length;
+
+ const totalSupplied = list.reduce((a, e) => a + e.market.totalSupplied, 0n);
+ const totalBorrowed = list.reduce((a, e) => a + e.market.totalBorrowed, 0n);
+ const util =
+ totalSupplied > 0n
+ ? (Number(totalBorrowed) / Number(totalSupplied)) * 100
+ : null;
+
+ const counts = list.reduce(
+ (acc, e) => {
+ acc[e.market.status] = (acc[e.market.status] ?? 0) + 1;
+ return acc;
+ },
+ {} as Record
+ );
+
+ const shown =
+ filter === "all" ? list : list.filter((e) => e.market.status === filter);
+
+ const empty = !isLoading && count === 0;
+ const activeLabel = TABS.find((t) => t.key === filter)?.label ?? "";
+
+ const activeCount = counts["ACTIVE"] ?? 0;
+
+ const pricedSupplied = Object.values(usd).reduce(
+ (a, v) => (v.priced ? a + v.s : a),
+ 0
+ );
+ const pricedBorrowed = Object.values(usd).reduce(
+ (a, v) => (v.priced ? a + v.b : a),
+ 0
+ );
+ const unpricedActive = list.filter(
+ (e) =>
+ !usd[e.market.marketId]?.priced &&
+ (e.market.totalSupplied > 0n || e.market.totalBorrowed > 0n)
+ ).length;
+ const unitLabel =
+ Array.from(new Set(list.map((e) => e.market.debtAssetId))).length === 1
+ ? ` ${list[0]?.market.debtAssetId ?? ""}`
+ : "";
+
+ return (
+
+
+
+
+
+
+
Arbor · Smart Lending Protocol
+
Protocol overview
+
+ Isolated lending markets with a four-layer bad-debt waterfall —
+ R_fund, T_fund, socialized lenders, and the NASM reserve.
+
+
+
+
+ e.market.collateralAssetId)))}
+ value={
+ pricedSupplied > 0
+ ? fmtUsd(pricedSupplied)
+ : formatAmount(totalSupplied, 0)
+ }
+ sub={
+ pricedSupplied > 0
+ ? `${formatAmount(totalSupplied, 0)} native${
+ unpricedActive > 0 ? ` · ${unpricedActive} unpriced` : ""
+ }`
+ : `native units${unitLabel}`
+ }
+ />
+ e.market.debtAssetId)))}
+ value={
+ pricedBorrowed > 0
+ ? fmtUsd(pricedBorrowed)
+ : formatAmount(totalBorrowed, 0)
+ }
+ sub={
+ pricedBorrowed > 0
+ ? `${formatAmount(totalBorrowed, 0)} native${
+ unpricedActive > 0 ? ` · ${unpricedActive} unpriced` : ""
+ }`
+ : `native units${unitLabel}`
+ }
+ subTone="down"
+ />
+
+
+
+ Dollar values use live oracle medians from /v1/query/prices and only
+ sum markets whose debt asset is priced (the standard TVL convention);
+ native whole-unit totals are shown alongside. Health factor and per‑card
+ APR derive from the on‑chain rate model.
+
+
+
+
+
+
+
+ All markets
+
+
+ {count} total
+
+
+
+
+ {TABS.map((t) => {
+ const n = t.key === "all" ? count : counts[t.key] ?? 0;
+ const active = filter === t.key;
+ return (
+ setFilter(t.key)}
+ className={`inline-flex items-center gap-2 whitespace-nowrap rounded-full border px-3 py-1.5 text-xs transition ${
+ active
+ ? "border-white/15 bg-white/10 text-white"
+ : "border-white/10 bg-white/[0.02] text-zinc-400 hover:bg-white/5 hover:text-zinc-200"
+ }`}
+ >
+ {t.label}
+
+ {n}
+
+
+ );
+ })}
+
+
+ {error && (
+
+ Failed to load markets. Check the ARBOR plugin RPC connection.
+
+ )}
+
+ {isLoading &&
+
+
+ No markets yet
+
+
+ ARBOR markets are created on chain by an authority. Launch your
+ first isolated market to populate the overview and portfolio.
+
+
+ Go to Admin
+
+
+ No {activeLabel.toLowerCase()} markets.
+
+ )}
+
+
+ {shown.map((entry) => (
+
+
+
+
+ Arbor Community Quests
+
+
Quests & XP
+
+ Complete real actions on Arbor — supply, borrow, repay, and more —
+ to earn XP automatically. XP is read live from the quest indexer,
+ a service separate from Arbor's core protocol.
+
+
+
+
+
Today's quests
+
Resets daily
+
+ {todayLoading ? (
+
Loading…
+ ) : today ? (
+
+ {today.quests.map((q) => (
+
+
+ {q.completed ? "✓" : ""}
+
+
+
+
+ {q.label}
+
+ +{q.xp} XP
+
+
{q.description}
+
+
+ ))}
+
+ ) : (
+
Couldn't reach the quest service.
+ )}
+ {!address && (
+
+ Connect your wallet to track which quests you've completed today.
+
+ )}
+
+
+
+
Your XP
+ {!address ? (
+
Connect your wallet to see your XP.
+ ) : myXpLoading ? (
+
Loading…
+ ) : myXp ? (
+ <>
+
{myXp.totalXp} XP
+
+ {myXp.entries.slice(0, 5).map((e) => (
+
+ {e.questId}
+ +{e.xp} XP
+
+ ))}
+ {myXp.entries.length > 5 && (
+
+ +{myXp.entries.length - 5} more
+
+ )}
+
+
+ ) : (
+
+ No XP yet — link your Discord/X account, then complete a quest action.
+
+ )}
+
+
+
+
+ Weekly leaderboard {leaderboard ? `(week ${leaderboard.weekId})` : ""}
+
+ {isError ? (
+
Couldn't reach the quest service.
+ ) : leaderboardLoading ? (
+
Loading…
+ ) : leaderboard && leaderboard.leaderboard.length > 0 ? (
+
+
+
+ #
+ Wallet
+ XP
+
+
+
+ {leaderboard.leaderboard.map((entry, i) => (
+
+ {i + 1}
+ {shortAddr(entry.address)}
+ {entry.xp}
+
+ ))}
+
+
+ ) : (
+
No activity yet this week.
+ )}
+
+
+
+
+
+
+ {amount != null ? formatAmount(amount, decimals) : "—"}
+
+ {staked != null && staked > 0n && (
+
+ +{formatAmount(staked, decimals)} staked
+
+ )}
+
+
(null);
+ const [vaults, setVaults] = useState([]);
+
+ const { data: accountData } = useAccount(addr);
+ const cnpy = accountData?.amount ?? null;
+ const staked = accountData?.stakedAmount ?? null;
+
+ useEffect(() => {
+ if (!addr) return;
+ let alive = true;
+ getNusdBalance(addr).then((b) => {
+ if (alive) setNusd(b.amount);
+ });
+ getAllNasmVaults(addr).then(async (list) => {
+ const rows = await Promise.all(
+ list.map(async (v) => {
+ const p = await getNasmVaultPool(String(v.vaultId ?? ""));
+ return {
+ id: String(v.vaultId),
+ asset: String(v.collateralAssetId ?? ""),
+ collateral: BigInt(String(v.collateralQuantity ?? "0")),
+ escrowed: p?.amount ?? 0n,
+ principal: BigInt(String(v.nusdPrincipal ?? "0")),
+ };
+ })
+ );
+ if (alive) setVaults(rows);
+ });
+ return () => {
+ alive = false;
+ };
+ }, [addr]);
+
+ return (
+
+
+
+ Wallet
+
+
+
+
+
Portfolio overview
+
+ Transferable balances and every module your wallet is active in —
+ lending, borrowing and NASM vaults.
+
+
+
+ address: {formatAddress(addr)}
+
+ )}
+
+
+
+
+
Your balances
+ {!addr ? (
+
+ Connect a wallet to view transferable balances.
+
+ ) : (
+
+ )}
+
+
+
+ Your modules
+ {addr && vaults.length > 0 && (
+
+
NASM vaults
+
+
+
+
+ Vault
+ Collateral
+ Escrowed
+ NUSD principal
+
+
+
+ {vaults.map((v) => (
+
+ {v.id}
+
+
+
+
+
+ {formatAmount(v.escrowed, 0)}
+
+
+ {formatAmount(v.principal, 6)}
+
+
+ ))}
+
+
+
+
+
— ;
+ const v = Number(hf) / 1e6;
+ const cls =
+ v < 1.0
+ ? "bg-rose-500/15 text-rose-300"
+ : v < 1.5
+ ? "bg-amber-500/15 text-amber-300"
+ : "bg-emerald-500/15 text-emerald-300";
+ return (
+
+ {formatHealthFactor(hf)}
+
+ );
+}
+
+function MarketCell({ entry }: { entry: MarketWithIndices }) {
+ const m = entry.market;
+ return (
+
+
+
+
+
{m.marketId}
+
+ {m.collateralAssetId}/{m.debtAssetId}
+
+
+
+ );
+}
+
+function LendingRow({ entry, address }: { entry: MarketWithIndices; address: string }) {
+ const m = entry.market;
+ const { data: lp } = useLenderPosition(m.marketId, address);
+ const { data: price } = useAssetPrice(m.debtAssetId);
+ const shares = lp?.shares ?? 0n;
+ const value =
+ price?.available && price.price != null
+ ? Number(shares) * (Number(price.price) / 1e8)
+ : null;
+
+ if (shares === 0n) return null;
+
+ return (
+
+
+
+ {formatAmount(shares, 0)}
+
+
+ {value != null ? `$${value.toFixed(2)}` : "—"}
+
+
+ —
+
+ );
+}
+
+function BorrowingRow({ entry, address }: { entry: MarketWithIndices; address: string }) {
+ const m = entry.market;
+ const { data: bp } = useBorrowerPosition(m.marketId, address);
+ const { data: collPrice } = useAssetPrice(m.collateralAssetId);
+ const { data: debtPrice } = useAssetPrice(m.debtAssetId);
+ const tier = TIER_PARAMS[m.assetTier];
+
+ const debt = bp?.currentDebt ?? 0n;
+ const coll = bp?.collateralQuantity ?? 0n;
+
+ if (debt === 0n && coll === 0n) return null;
+
+ const hf = tier && collPrice?.available && collPrice.price != null && debtPrice?.available && debtPrice.price != null
+ ? computeHealthFactorScaled(
+ coll,
+ collPrice.price,
+ tier.ltvLiqBps,
+ debt,
+ debtPrice.price,
+ )
+ : null;
+
+ return (
+
+
+
+ {formatAmount(coll, 0)}
+
+ {m.collateralAssetId}
+
+
+
+ {formatAmount(debt, 0)}
+
+ {m.debtAssetId}
+
+
+
+
+ );
+}
+
+
+export default function WatchPage() {
+ const params = useParams();
+ const router = useRouter();
+ const watchedAddress = (params.address as string).toLowerCase();
+ const [inputAddr, setInputAddr] = useState(watchedAddress);
+
+ const { data: markets } = useMarkets();
+ const { data: accountData } = useAccount(watchedAddress);
+ const { data: nasmVaults } = useNasmVaultsByOwner(watchedAddress);
+
+ const [lendingPresent, setLendingPresent] = useState>({});
+ const [borrowingPresent, setBorrowingPresent] = useState>({});
+
+ const trackLending = useCallback((id: string, v: boolean) => {
+ setLendingPresent((prev) => ({ ...prev, [id]: v }));
+ }, []);
+
+ const trackBorrowing = useCallback((id: string, v: boolean) => {
+ setBorrowingPresent((prev) => ({ ...prev, [id]: v }));
+ }, []);
+
+ useEffect(() => {
+ setInputAddr(watchedAddress);
+ }, [watchedAddress]);
+
+ const handleSwitch = (e: React.FormEvent) => {
+ e.preventDefault();
+ const trimmed = inputAddr.trim().toLowerCase();
+ if (trimmed && trimmed !== watchedAddress) {
+ router.push(`/watch/${trimmed}`);
+ }
+ };
+
+ const cnpy = accountData?.amount ?? null;
+ const staked = accountData?.stakedAmount ?? null;
+
+ return (
+
+
+
+ Watch mode
+
+
+ Read-only view of any wallet's positions on the Arbor protocol.
+
+
+
+ Watching: {watchedAddress}
+
+
+
+
+
Balances
+
+
+
+
+
+ {cnpy != null ? formatAmount(cnpy, 6) : "—"}
+
+ {staked != null && staked > 0n && (
+
+ Staked: {formatAmount(staked, 6)}
+
+ )}
+
+
+
+
+
+
+ {markets && markets.length > 0 && (
+
+
Lending positions
+
+
+
+ Market
+ Shares
+ Value
+
+
+
+ {markets.map((entry) => (
+
+
+ {Object.values(lendingPresent).every((v) => !v) && (
+
+ No lending positions for this address.
+
+ )}
+
+ )}
+
+ {markets && markets.length > 0 && (
+
+
Borrowing positions
+
+
+
+ Market
+ Collateral
+ Debt
+ Health
+
+
+
+ {markets.map((entry) => (
+
+
+ {Object.values(borrowingPresent).every((v) => !v) && (
+
+ No borrowing positions for this address.
+
+ )}
+
+ )}
+
+ {nasmVaults && nasmVaults.length > 0 && (
+
+
NASM vaults
+
+ {nasmVaults.map((vault: any) => (
+
+
+ Vault {String(vault.vaultId)} — {String(vault.collateralAssetId)}
+
+
+
+
Escrowed
+
{formatAmount(vault.escrowed as bigint, 0)}
+
+
+
Principal
+
{formatAmount(vault.principal as bigint, 0)}
+
+
+
+ ))}
+
+
+ )}
+
+
+
+
+
+
+
+
+
+
+ B
+
+
+ $
+
+
+
+ {k.charAt(0).toUpperCase()}
+
+ );
+ }
+}
+
+export function AssetIcon({ symbol, size = 32, className }: AssetIconProps) {
+ const uid = useId();
+ const gradId = `parchment-${uid}`;
+ const k = normalize(symbol ?? "");
+ return (
+
+
+
+
+
+
+ );
+}
diff --git a/frontend/src/components/forms/BorrowForm.tsx b/frontend/src/components/forms/BorrowForm.tsx
new file mode 100644
index 0000000000..e7741a956b
--- /dev/null
+++ b/frontend/src/components/forms/BorrowForm.tsx
@@ -0,0 +1,255 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { useMarket } from "@/lib/hooks/useMarket";
+import { useBorrowerPosition } from "@/lib/hooks/useBorrowerPosition";
+import { useAssetPrice } from "@/lib/hooks/useAssetPrice";
+import { useWalletStore } from "@/lib/wallet";
+import { useArborTx } from "@/lib/hooks/useArborTx";
+import { marketAdmissionFromMarket } from "@/lib/hooks/useMarketAdmission";
+import { getBlockedReason } from "@/lib/arbor/admission";
+import { parseAmount, formatAmount, formatHealthFactor } from "@/lib/arbor/format";
+import {
+ scaledDebt,
+ maxBorrowQty,
+ computeHealthFactorScaled,
+} from "@/lib/arbor/math";
+import {
+ TIER_PARAMS,
+ HF_LIQUIDATABLE_SCALED,
+} from "@/lib/arbor/constants";
+import { addressBytesFromHex } from "@/lib/wallet";
+import { EmptyState } from "@/components/widgets/EmptyState";
+import { LoadingSkeleton } from "@/components/widgets/LoadingSkeleton";
+import { AdmissionGateBanner } from "@/components/widgets/AdmissionGateBanner";
+import {
+ Field,
+ TextInput,
+ SubmitButton,
+ ErrorText,
+} from "@/components/forms/FormPrimitives";
+
+const MAX_UINT64 = 18446744073709551615n;
+
+export function BorrowForm({ marketId }: { marketId: string }) {
+ const { data: marketData, isLoading } = useMarket(marketId);
+ const wallet = useWalletStore();
+ const { data: borrowerPosition, refetch: refetchPosition } = useBorrowerPosition(marketId, wallet.address);
+ const { submit, phase } = useArborTx();
+
+ useEffect(() => {
+ if (phase === "confirmed") {
+ refetchPosition();
+ const t = setTimeout(() => refetchPosition(), 2500);
+ return () => clearTimeout(t);
+ }
+ }, [phase, refetchPosition]);
+
+ const { data: position } = useBorrowerPosition(marketId, wallet.address);
+
+ const [amount, setAmount] = useState("");
+ const [localError, setLocalError] = useState(null);
+
+ const collateralAssetId = marketData?.market.collateralAssetId ?? null;
+ const debtAssetId = marketData?.market.debtAssetId ?? null;
+
+ const { data: collateralPrice } = useAssetPrice(collateralAssetId);
+ const { data: debtPrice } = useAssetPrice(debtAssetId);
+
+ if (isLoading) {
+ return (null);
+
+ const { data: vaultData } = useNasmVault(vaultId.trim() || null);
+
+ const busy = phase === "signing" || phase === "submitting" || phase === "waiting";
+
+ const currentDebt = vaultData?.vault
+ ? BigInt(String((vaultData.vault as Record).nusdPrincipal ?? "0"))
+ : null;
+
+ let parseError: string | null = null;
+ let parsedNusd = 0n;
+
+ if (nusdAmount.trim()) {
+ try {
+ parsedNusd = parseAmount(nusdAmount, 6);
+ if (parsedNusd > MAX_UINT64) parseError = "NUSD amount exceeds uint64 max.";
+ } catch (err: any) {
+ parseError = err?.message || String(err);
+ }
+ }
+
+ async function onSubmit(e: React.FormEvent) {
+ e.preventDefault();
+ setLocalError(null);
+
+ try {
+ if (!vaultId.trim()) throw new Error("Vault ID is required.");
+
+ const nusd = parseAmount(nusdAmount, 6);
+ if (nusd <= 0n) throw new Error("NUSD amount must be greater than zero.");
+ if (nusd > MAX_UINT64) throw new Error("NUSD amount exceeds uint64 max.");
+
+ const sender = addressBytesFromHex(wallet.address);
+
+ await submit("burn_nusd", {
+ vaultId: vaultId.trim(),
+ sender,
+ nusdAmount: nusd,
+ });
+
+ setNusdAmount("");
+ onBurned?.();
+ } catch (err: any) {
+ setLocalError(err?.message || String(err));
+ }
+ }
+
+ return (
+
+ );
+}
diff --git a/frontend/src/components/forms/CreateMarketForm.tsx b/frontend/src/components/forms/CreateMarketForm.tsx
new file mode 100644
index 0000000000..e60d47c02a
--- /dev/null
+++ b/frontend/src/components/forms/CreateMarketForm.tsx
@@ -0,0 +1,234 @@
+"use client";
+
+import { useState } from "react";
+import { useWalletStore } from "@/lib/wallet";
+import { useArborTx } from "@/lib/hooks/useArborTx";
+import { MIN_REPORTERS } from "@/lib/arbor/constants";
+import { addressBytesFromHex } from "@/lib/wallet";
+import { hexToBytes } from "@/lib/canopy/decode";
+import {
+ Field,
+ TextInput,
+ SelectInput,
+ SubmitButton,
+ ErrorText,
+} from "@/components/forms/FormPrimitives";
+
+const MAX_UINT64 = 18446744073709551615n;
+
+function parseAddressList(input: string): Uint8Array[] {
+ const parts = input
+ .split(/[,\n]+/)
+ .map((s) => s.trim())
+ .filter(Boolean);
+
+ return parts.map((part) => {
+ const clean = part.startsWith("0x") ? part.slice(2) : part;
+
+ if (!/^[0-9a-fA-F]{40}$/.test(clean)) {
+ throw new Error(`Invalid 20-byte hex address: ${part}`);
+ }
+
+ return hexToBytes(clean);
+ });
+}
+
+export function CreateMarketForm() {
+ const wallet = useWalletStore();
+ const { submit, phase } = useArborTx();
+
+ const [marketId, setMarketId] = useState("");
+ const [collateralAssetId, setCollateralAssetId] = useState("");
+ const [debtAssetId, setDebtAssetId] = useState("");
+ const [assetTier, setAssetTier] = useState("1");
+ const [reserveFactorBps, setReserveFactorBps] = useState("1000");
+ const [authorizedSubmitters, setAuthorizedSubmitters] = useState("");
+ const [localError, setLocalError] = useState(null);
+
+ const busy =
+ phase === "signing" ||
+ phase === "submitting" ||
+ phase === "waiting";
+
+ let parseError: string | null = null;
+
+ const tier = Number(assetTier);
+ const reserveFactor = Number(reserveFactorBps);
+
+ if (!Number.isInteger(tier) || tier < 0 || tier > 3) {
+ parseError = "Asset tier must be an integer from 0 to 3.";
+ } else if (
+ !Number.isInteger(reserveFactor) ||
+ reserveFactor < 200 ||
+ reserveFactor > 3000
+ ) {
+ parseError = "Reserve factor must be between 200 and 3000 bps.";
+ } else if (authorizedSubmitters.trim()) {
+ try {
+ const submitters = parseAddressList(authorizedSubmitters);
+
+ if (submitters.length < MIN_REPORTERS) {
+ parseError = `authorized_submitters must contain at least ${MIN_REPORTERS} addresses.`;
+ }
+ } catch (err: any) {
+ parseError = err?.message || String(err);
+ }
+ } else {
+ parseError = `authorized_submitters must contain at least ${MIN_REPORTERS} addresses.`;
+ }
+
+ async function onSubmit(e: React.FormEvent) {
+ e.preventDefault();
+ setLocalError(null);
+
+ try {
+ if (!marketId.trim()) {
+ throw new Error("Market ID is required.");
+ }
+
+ if (marketId.trim().length > 64) {
+ throw new Error("Market ID must be 64 characters or less.");
+ }
+
+ if (!collateralAssetId.trim()) {
+ throw new Error("Collateral asset ID is required.");
+ }
+
+ if (!debtAssetId.trim()) {
+ throw new Error("Debt asset ID is required.");
+ }
+
+ const parsedTier = Number(assetTier);
+
+ if (!Number.isInteger(parsedTier) || parsedTier < 0 || parsedTier > 3) {
+ throw new Error("Asset tier must be an integer from 0 to 3.");
+ }
+
+ const parsedReserveFactor = BigInt(reserveFactorBps);
+
+ if (
+ parsedReserveFactor < 200n ||
+ parsedReserveFactor > 3000n ||
+ parsedReserveFactor > MAX_UINT64
+ ) {
+ throw new Error("Reserve factor must be between 200 and 3000 bps.");
+ }
+
+ const submitters = parseAddressList(authorizedSubmitters);
+
+ if (submitters.length < MIN_REPORTERS) {
+ throw new Error(
+ `authorized_submitters must contain at least ${MIN_REPORTERS} addresses.`
+ );
+ }
+
+ const creator = addressBytesFromHex(wallet.address);
+
+ await submit("create_market", {
+ marketId: marketId.trim(),
+ collateralAssetId: collateralAssetId.trim(),
+ debtAssetId: debtAssetId.trim(),
+ assetTier: parsedTier,
+ reserveFactorBps: parsedReserveFactor,
+ creator,
+ authorizedSubmitters: submitters,
+ });
+
+ setMarketId("");
+ setCollateralAssetId("");
+ setDebtAssetId("");
+ setAuthorizedSubmitters("");
+ } catch (err: any) {
+ setLocalError(err?.message || String(err));
+ }
+ }
+
+ return (
+