diff --git a/src/components.tsx b/src/components.tsx index 5325b9b..e444975 100644 --- a/src/components.tsx +++ b/src/components.tsx @@ -1018,6 +1018,14 @@ function PrintingsSection({ setCopies(await api.listLibraryCopies(card.oracle_id)); }); + // Copy groups that no longer fit are trimmed when the total drops, so + // refetch them along with it. + const adjustOwned = (delta: number) => + run(async () => { + setOwned(await api.addOwned(card.oracle_id, delta)); + setCopies(await api.listLibraryCopies(card.oracle_id)); + }); + const showPrinting = (scryfallId: string | null) => run(async () => { const entry = await api.setDeckCardPrinting(ctx.deckId!, card.oracle_id, scryfallId); @@ -1057,14 +1065,17 @@ function PrintingsSection({ )}
Owned - - {owned} cop{owned === 1 ? "y" : "ies"} - {tracked > 0 && ( - - {" "} - · {tracked} by printing · {Math.max(0, owned - tracked)} unspecified - - )} + + adjustOwned(-1)} onIncrement={() => adjustOwned(1)} /> + + cop{owned === 1 ? "y" : "ies"} + {tracked > 0 && ( + + {" "} + · {tracked} by printing · {Math.max(0, owned - tracked)} unspecified + + )} + {copies.map((c) => (
diff --git a/src/views/CardSearch.tsx b/src/views/CardSearch.tsx index 91a2c9b..a4fdfa6 100644 --- a/src/views/CardSearch.tsx +++ b/src/views/CardSearch.tsx @@ -1,5 +1,5 @@ import { useEffect, useRef, useState } from "react"; -import { api, Deck, LibraryCard, LibraryFacets, LibraryFilter } from "../api"; +import { api, Deck, LibraryCard, LibraryFacets, LibraryFilter, PreviewContext } from "../api"; import { CardThumb, CardTile, @@ -231,6 +231,9 @@ export function CardSearch({ } } + // Lets the click preview adjust ownership and printings, refetching after. + const preview: PreviewContext = { onChanged: () => setRefreshKey((k) => k + 1) }; + async function adjust(oracleId: string, delta: number) { const qty = await api.addOwned(oracleId, delta); setRows((rs) => rs.map((c) => (c.oracle_id === oracleId ? { ...c, quantity_owned: qty } : c))); @@ -298,7 +301,7 @@ export function CardSearch({ /> - + @@ -343,6 +346,7 @@ export function CardSearch({