Add +/- quantity buttons to the Add Cards "Just added" list
Lets you quickly correct duplicate-copy counts right after adding a card, instead of navigating to the Library tab. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -6,7 +6,9 @@ import { CardSearchBox } from "../components";
|
|||||||
export function CardEntry() {
|
export function CardEntry() {
|
||||||
const [query, setQuery] = useState("");
|
const [query, setQuery] = useState("");
|
||||||
const [results, setResults] = useState<CardRef[]>([]);
|
const [results, setResults] = useState<CardRef[]>([]);
|
||||||
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.
|
// Persisted so a "box" location sticks while entering a stack of cards.
|
||||||
const [location, setLocation] = useState(() => localStorage.getItem("add-location") || "");
|
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 qty = await api.addOwned(card.oracle_id, 1);
|
||||||
const loc = location.trim();
|
const loc = location.trim();
|
||||||
if (loc) await api.setLocation(card.oracle_id, loc);
|
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("");
|
setQuery("");
|
||||||
setResults([]);
|
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 (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<h2>Add Cards</h2>
|
<h2>Add Cards</h2>
|
||||||
@@ -72,7 +81,17 @@ export function CardEntry() {
|
|||||||
<span className="card-name">{r.name}</span>
|
<span className="card-name">{r.name}</span>
|
||||||
{r.location && <span className="deck-chip">{r.location}</span>}
|
{r.location && <span className="deck-chip">{r.location}</span>}
|
||||||
<span className="spacer" />
|
<span className="spacer" />
|
||||||
|
<button
|
||||||
|
onClick={() => adjust(r.oracleId, -1)}
|
||||||
|
disabled={r.qty <= 0}
|
||||||
|
title="Remove a copy"
|
||||||
|
>
|
||||||
|
−
|
||||||
|
</button>
|
||||||
<span className="badge">owned ×{r.qty}</span>
|
<span className="badge">owned ×{r.qty}</span>
|
||||||
|
<button onClick={() => adjust(r.oracleId, 1)} title="Add another copy">
|
||||||
|
+
|
||||||
|
</button>
|
||||||
</li>
|
</li>
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
|
|||||||
Reference in New Issue
Block a user