Something went wrong. Try again.
An atproto AppView for tracking a Magic: The Gathering collection github.com/eth0net/manaweb
appview atproto mtg rust typescript
Something went wrong. Try again.
3.0 kB · 104 lines
TSX
at main
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105import { type Catalog, words } from "../catalog";import { EXPORT } from "../export/Export";import { IMPORT } from "../import/Import";import { useWaiting } from "../import/runner";import { rkey } from "../oauth/repo";import { Link } from "../router";import type { Holdings } from "./cards";import { type Containers, UNFILED } from "./containers";import { Place } from "./Place";
const UNDER = "/collection/";
// What you own and where it sits, and one level down, what one place holds.export function Collection({ catalog, containers, owning, path,}: { catalog: Catalog | null; containers: Containers; owning: Holdings; path: string;}) { const key = path.startsWith(UNDER) ? path.slice(UNDER.length) : ""; // The total takes `waiting` in too, because those copies are owned. What // they are not is editable, so it says so. const left = useWaiting().reduce((sum, one) => sum + one.quantity, 0);
if (key) { const here = containers.held.find((one) => rkey(one.uri) === key); // An unknown key is a container this account no longer has, which reads // as an empty place rather than an error. return ( <Place catalog={catalog} containers={containers} owning={owning} place={here?.uri ?? null} name={here?.value.name ?? UNFILED.name} /> ); }
const unfiled = owning.copies(null); const empty = owning.total === 0 && containers.held.length === 0;
return ( <> <p className="tally"> {owning.total.toLocaleString()} card{owning.total === 1 ? "" : "s"} {left > 0 && ( <span className="quiet"> {" "} · {left.toLocaleString()} still landing </span> )} </p>
<p className="quiet"> <Link className="link" to={IMPORT}> Import a CSV </Link> {owning.total > 0 && ( <> {" · "} <Link className="link" to={EXPORT}> Export one </Link> </> )} </p>
{empty ? ( <p className="quiet"> Nothing yet. Search for a card and press the plus beside a printing. </p> ) : ( <ul className="breakdown"> {unfiled > 0 && ( <li> <Link className="link" to={UNDER + UNFILED.key}> {UNFILED.name} </Link> <span className="quiet">unfiled</span> <span>{unfiled.toLocaleString()}</span> </li> )} {containers.held.map((one) => ( <li key={one.uri}> <Link className="link" to={UNDER + rkey(one.uri)}> {one.value.name} </Link> <span className="quiet"> {one.value.kind ? words(one.value.kind) : ""} </span> <span>{owning.copies(one.uri).toLocaleString()}</span> </li> ))} </ul> )} </> );}