TypeScript · local-first

SwapBench

A client-side TypeScript application that treats hardware flipping as a graph problem: typed nodes for inventory and cash, directed edges for swaps and sales, and a scoring function over two-sided deals. State lives in the browser—no API, no account, no server-side store.

Open SwapBench

Canvas

Deployed at owengalaxy.xyz.

Architecture

SwapBench is a TypeScript SPA, compiled with Vite and rendered in React. The domain layer is typed independently of the UI: items, bundles, components, and cash are node kinds; swaps, sales, and keep-decisions are directed edges. CSV ingest, JSON export, and localStorage serialization all round-trip that same schema, so the canvas is a view over a structured graph rather than a pile of ad-hoc form state.

React owns three coordinated surfaces: a sidebar of journey documents, a spatial canvas for the selected graph, and an inspector bound to the current node or edge. Selection, layout, and derived totals (cash realized, items kept, estimated profit) are computed from the graph instead of being stored as duplicate UI fields.

Persistence is local-first. Saves write JSON under browser storage; an export dumps the full library. Storage keys still use a tradebench-* prefix so older client-side saves keep loading after the rebrand.

Systems

Deal scorer Two-pane valuation: each side is a bag of cards whose adjusted values feed a comparator. Haircuts cover confidence, liquidity, part-out, repair, and fees. Output is a discrete Take / Counter / Decline plus a live margin.
Journey graph A directed graph, not a list. Chains like 3DS → bike → laptop → gaming PC can branch into sold vs kept terminals and still reduce to cash realized, items kept, and estimated profit.
Document library Completed journeys are first-class records: search, filter, sort, rename, duplicate, archive. The sidebar is an index over that collection, not a single global timeline.
CSV → graph ingest A parser maps rows into nodes and edges. One paste can be a single timeline, or partitioned on every start row, trade_name, or [Bracket prefix] into independent journeys.

Stack

TypeScript Primary language — domain types, scoring, CSV partitioner, JSON codecs
React Canvas, sidebar, inspector, and selection state
Vite Dev server and production bundle
Browser APIs localStorage, clipboard, and file export — no backend