diff --git a/apps/web/src/App.tsx b/apps/web/src/App.tsx index 8f54c0b..c049558 100644 --- a/apps/web/src/App.tsx +++ b/apps/web/src/App.tsx @@ -1,6 +1,6 @@ import { useState } from "react"; import type { RiskAssessment } from "@custos/core"; -import { requiresFriction, requiresHardBlock } from "@custos/core"; +import { parseDestinationAddress, requiresFriction, requiresHardBlock } from "@custos/core"; import { analyzeSendIntent } from "./compositionRoot.js"; export function App() { @@ -8,17 +8,31 @@ export function App() { const [amount, setAmount] = useState(""); const [context, setContext] = useState(""); const [assessment, setAssessment] = useState(null); + const [error, setError] = useState(null); const [busy, setBusy] = useState(false); async function handleCheck() { setBusy(true); + setError(null); + setAssessment(null); try { + const parsed = parseDestinationAddress(address); + if (!parsed.ok) { + setError( + parsed.reason === "empty" + ? "Enter a destination address." + : "That is not a Tron (T...) or Ethereum (0x...) address.", + ); + return; + } const result = await analyzeSendIntent.execute({ - destination: { value: address, network: "tron" }, + destination: parsed.address, amountUsdt: Number(amount) || 0, context: context ? { text: context } : undefined, }); setAssessment(result); + } catch (err) { + setError(err instanceof Error ? err.message : "Analysis failed."); } finally { setBusy(false); } @@ -33,11 +47,21 @@ export function App() { Destination address setAddress(e.target.value)} + onChange={(e) => { + setAddress(e.target.value); + setError(null); + }} style={{ width: "100%", padding: 8 }} placeholder="TXyz... / 0x..." + aria-invalid={error !== null} + aria-describedby={error ? "address-error" : undefined} /> + {error && ( + + )}