/* simple/tabs.jsx — the three surfaces.
HOME: your money at Yoshi. 7 elements, no scrolling required.
YOSHI: the interface. Research, trades, moves, automations, docs,
support — all conversation, rendered as inline cards.
ACTIVITY: the audit trail. Everything that touched money, one feed,
tagged with who acted. */
/* ============================================================
HOME
============================================================ */
const HOME_RANGES = ["1D", "1W", "1M", "6M", "YTD", "1Y", "ALL"];
const HOME_RETS = { "1D": DAY_PCT, "1W": 1.2, "1M": 3.1, "6M": 9.4, "YTD": 11.2, "1Y": 18.9, "ALL": 64.0 };
const homeSeries = (range) => series(101 + HOME_RANGES.indexOf(range) * 31, 36, NET_WORTH / (1 + HOME_RETS[range] / 100), NET_WORTH, range === "1D" ? 0.0016 : 0.006);
const AllocStrip = ({ nav }) => {
const segs = [
["Cash", CASH_TOTAL, "var(--alloc-cash)"],
["Stocks", INVEST_TOTAL, "var(--alloc-invest)"],
["Crypto", CRYPTO_TOTAL, "var(--alloc-crypto)"],
];
const total = CASH_TOTAL + INVEST_TOTAL + CRYPTO_TOTAL;
// display-only: sits just above Move/Trade, so no tap target to avoid mis-taps
return (
{segs.map(([l, v, c]) => )}
{segs.map(([l, v, c]) => (
{((v / total) * 100).toFixed(2)}%{l}
{usd(v)}
))}
);
};
/* the pulse — where external context is allowed to speak, in Yoshi's voice.
Section label sits above the card, matching "Needs you" and "Holdings". */
const PulseCard = ({ nav }) => {
// the pulse IS the day's brief — register it so clicking opens the full read
// in the Briefs UI (as the "Today's read" brief), like the other briefs
const read = "Up " + perf(DAY_ABS, DAY_PCT) + " today, led by NVDA and BTC. Your weekly VTI buy ran this morning as scheduled, and your Yoshi cash keeps earning 3.30% APY across Cash and Reserve. One thing on my radar: your Chase Sapphire statement of $2,340.18 is due Friday — I can pay it in full so you owe zero interest. Beyond that, nothing needs your approval right now.";
window.MORNING_BRIEF = { body: read, ask: ["Give me the full read", "Markets closed higher and you're up " + perf(DAY_ABS, DAY_PCT) + " — NVDA and BTC did most of the lifting. Your weekly VTI buy ran this morning and the cash sweep is on schedule. Your Chase Sapphire statement ($2,340.18) is due Friday — I can pay it from your Cash and keep you at zero interest. Want that?"] };
return (
The pulseAs of 9:41 AM
);
};
/* holdings — what you hold, with live day moves. Below the pulse so the
number up top is the summary and this is the detail beneath it. */
const HoldingRow = ({ h, nav, first }) => (
);
const HoldingsList = ({ nav }) => {
// GROUPS.*.items is snapshotted in data.jsx before accounts.jsx pushes its
// EXTRA_HOLDINGS into the shared HOLDINGS array — so this stays the user's
// actual held positions, not the wider tradeable universe.
const rows = [...GROUPS.investments.items, ...GROUPS.crypto.items].sort((a, b) => b.value - a.value);
return (
{rows.map((h, i) => )}
);
};
/* Manual fast paths — same centered icon + label as before, just more
presence: a hairline border, a touch more height, and an accent-lit icon. */
const FastBtn = ({ icon, label, onClick }) => (
);
const HomeTab = ({ nav, proposals, onReview, hideFastPaths }) => {
const [range, setRange] = useState("1D");
const [scrub, setScrub] = useState(null);
const data = useMemo(() => homeSeries(range), [range]);
const ret = HOME_RETS[range];
const abs = NET_WORTH - NET_WORTH / (1 + ret / 100);
const shown = proposals.slice(0, 1);
const chartColor = ret >= 0 ? "var(--accent-pos)" : "var(--signal-neg)";
// drag across the chart → read the value + change at that point in time
const scrubbing = scrub != null && data[scrub] != null;
const dispVal = scrubbing ? data[scrub] : NET_WORTH;
const dispAbs = scrubbing ? data[scrub] - data[0] : abs;
const dispPct = scrubbing ? ((data[scrub] - data[0]) / data[0]) * 100 : ret;
return (
{/* header: hamburger (settings) · bell (briefs) — logo lives in the Yoshi tab */}
{/* 1+2 · the number and the day — tap to see the accounts behind it
(isolated up here, away from Move/Trade, so no mis-taps) */}
{/* 3 · sparkline — drag across to scrub the value over time */}
{/* 4 · allocation strip — one account, three rails */}
{/* 5 · manual fast paths — the two doors, above the fold.
Original TransferFlow / TradeSheet, unchanged. On web these live
in the top bar instead, so the shell hides them here. */}
{!hideFastPaths && (
)}
{/* 6 · needs you — the hero when present, absent when not */}
{proposals.length > 0 && (
Needs you
{proposals.length > 1 && (
)}
{shown.map((p) => onReview(p)} />)}
)}
{/* 7 · the pulse */}
{/* 8 · holdings — what you hold, live day moves, below the pulse */}
);
};
/* ============================================================
YOSHI · the interface. The reply engine renders capability
cards inline — each one a screen this redesign deleted.
============================================================ */
const YOSHI_QUICK = ["What's my full net worth?", "How am I doing vs the S&P?", "Move $2,000 to savings", "Show my automations"];
const yoshiReply = (t, ctx) => {
const s = t.toLowerCase();
if (/net worth|everything|total|full picture|external/.test(s)) return {
t: `Everything together: ${usd(NET_WORTH + 8210.32 + 186400 + 12840 - LIAB_TOTAL)}. That's ${usd(NET_WORTH)} here at Yoshi, plus ${usd(8210.32 + 186400 + 12840)} across Chase, Schwab, and Coinbase, minus ${usd(LIAB_TOTAL)} of debt (the mortgage and two cards). Your biggest lever: the Schwab account is earning almost nothing in its cash sweep — want me to draft a consolidation?`,
};
if (/s&p|compare|vs |versus|how am i doing|performance/.test(s)) return {
t: "You're ahead of the index this year — concentration in NVDA did most of that, which cuts both ways.",
card: { type: "compare" },
};
if (/nvda|nvidia/.test(s)) return { t: securityTake("nvda").take, card: { type: "quote", id: "nvda" } };
if (/bitcoin|btc/.test(s)) return { t: securityTake("btc").take, card: { type: "quote", id: "btc" } };
if (/tsla|tesla/.test(s)) return { t: securityTake("tsla").take, card: { type: "quote", id: "tsla" } };
if (/move|transfer|send/.test(s)) {
const amt = parseFloat((s.match(/\$?([\d,]+(?:\.\d+)?)/) || [])[1]?.replace(/,/g, "")) || 2000;
return {
t: `Drafted. ${usd(amt)} from Cash to Reserve, instant, no fee. Approve when ready.`,
proposal: {
id: "pm_" + Date.now(), agent: "Yoshi agent", title: `Move ${usd(amt)} to Reserve`,
why: `One-time instant transfer from Yoshi Cash ••8841 to Yoshi Reserve ••2207. Both earn 3.30% APY. This will not repeat.`,
net: 0, settles: "In seconds", settlesVerb: "arrives", kind: "transfer",
legs: [["FROM", "Yoshi Cash ••8841", `Balance ${usd(18420.55)}`, "−" + usd(amt)], ["TO", "Yoshi Reserve ••2207", `Balance ${usd(64000)}`, "+" + usd(amt)], ["TIMING", "Instant transfer", "Arrives in seconds", "$0.00 fee"]],
activity: { icon: "swap", title: "Reserve", detail: `${usd(amt)} · Instant`, category: "Transfer", by: "Yoshi agent", net: 0, amount: amt },
},
};
}
if (/automat|rules|recurring/.test(s)) return { t: "Six rules running, all inside your limits. They've earned you $841.00 this quarter between interest, the VTI streak, and harvested losses.", card: { type: "autos" } };
if (/spend|dining|budget/.test(s)) return { t: "Good news, actually:", card: { type: "insight", i: 0 } };
if (/1099|tax|statement|document|doc/.test(s)) return { t: "Here you go — I can also send these straight to your accountant.", card: { type: "doc", name: "1099-B · 2025", sub: "Yoshi Securities · consolidated" } };
if (/pay|sapphire|card|debt/.test(s)) return { t: "Your Sapphire statement is $2,340.18, due Friday at 21.99% APR. Paying in full from your Cash keeps you at zero interest — it's ready below.", proposal: PROPOSALS.find((p) => p.id === "p2") };
if (/cash|idle|savings rate|yield/.test(s)) return { t: "Your cash is working: every Yoshi cash account earns 3.30% APY, and the buffer rule keeps your spendable Cash lean while the excess sits in your Reserve. One idea — $15,000.00 has sat past your buffer for 9 days; short-term Treasuries would add about $760.00 a year and stay liquid. Want the proposal?" };
return { t: "On it. I can research anything you hold, move money, place trades, set up rules, pull documents, or just explain what's happening — all from right here. What do you want to do?" };
};
const YoshiCardFor = ({ card, nav, flash }) => {
if (!card) return null;
if (card.type === "quote") return ;
if (card.type === "compare") return ;
if (card.type === "autos") return ;
if (card.type === "insight") { const ins = BRIEF_INSIGHTS[card.i || 0]; return ; }
if (card.type === "doc") return ;
return null;
};
const YOSHI_SEED = [
{ from: "agent", t: "Morning. You're up " + perf(DAY_ABS, DAY_PCT) + " today — NVDA and BTC did most of it. One thing needs you: your stocks drifted past the mix you set, so I'd like to even things out.", time: "9:24" },
{ from: "user", t: "what would that do", time: "9:25" },
{ from: "agent", t: "Three trades: trim NVDA and BTC, add VOO. You'd come out about $1,153.00 ahead, done by tomorrow. Approve whenever you're ready.", time: "9:25", proposal: "p1" },
];
const YoshiTab = ({ nav, proposals, onReview, inject, onInjected, flash }) => {
const [msgs, setMsgs] = useState(YOSHI_SEED);
const [input, setInput] = useState("");
const [typing, setTyping] = useState(false);
const endRef = useRef(null);
useEffect(() => { endRef.current && endRef.current.scrollIntoView({ behavior: "smooth" }); }, [msgs, typing]);
useEffect(() => {
if (!inject) return;
setMsgs((m) => [...m, ...(inject.note ? [{ from: "user", t: inject.note, time: "now" }] : []), { from: "agent", t: inject.reply, time: "now" }]);
onInjected();
}, [inject]);
const send = (text) => {
const t = (text != null ? text : input).trim();
if (!t) return;
setInput("");
setMsgs((m) => [...m, { from: "user", t, time: "now" }]);
setTyping(true);
setTimeout(() => {
const r = yoshiReply(t);
setTyping(false);
setMsgs((m) => [...m, { from: "agent", t: r.t, time: "now", card: r.card, proposalObj: r.proposal }]);
}, 700);
};
const findP = (idOrObj) => typeof idOrObj === "string" ? proposals.find((p) => p.id === idOrObj) || PROPOSALS.find((p) => p.id === idOrObj) : idOrObj;
return (