diff --git a/src/views/CardEntry.tsx b/src/views/CardEntry.tsx index 026ba9e..569166e 100644 --- a/src/views/CardEntry.tsx +++ b/src/views/CardEntry.tsx @@ -6,7 +6,9 @@ import { CardSearchBox } from "../components"; export function CardEntry() { const [query, setQuery] = useState(""); const [results, setResults] = useState([]); - const [recent, setRecent] = useState<{ name: string; qty: number; location: string }[]>([]); + const [recent, setRecent] = useState< + { oracleId: string; name: string; qty: number; location: string }[] + >([]); // Persisted so a "box" location sticks while entering a stack of cards. const [location, setLocation] = useState(() => localStorage.getItem("add-location") || ""); @@ -35,11 +37,18 @@ export function CardEntry() { const qty = await api.addOwned(card.oracle_id, 1); const loc = location.trim(); if (loc) await api.setLocation(card.oracle_id, loc); - setRecent((r) => [{ name: card.name, qty, location: loc }, ...r].slice(0, 12)); + setRecent((r) => + [{ oracleId: card.oracle_id, name: card.name, qty, location: loc }, ...r].slice(0, 12), + ); setQuery(""); setResults([]); } + async function adjust(oracleId: string, delta: number) { + const qty = await api.addOwned(oracleId, delta); + setRecent((r) => r.map((e) => (e.oracleId === oracleId ? { ...e, qty } : e))); + } + return (

Add Cards

@@ -72,7 +81,17 @@ export function CardEntry() { {r.name} {r.location && {r.location}} + owned ×{r.qty} + ))}