Antoha — UI Functional Documentation
Project Overview
The Antoha buys items where they are cheapest, moves them between accounts if needed, and sells them where prices are higher.
It orchestrates Steam and third‑party marketplace accounts, evaluates arbitrage profitability via dynamic rules, and automates orders while giving operators transparency and control.
Common UI Component — Item Card
- Always shows game icon, item name, rarity colour, and stickers (if any) as overlay thumbnails.
- Hover pop‑over (universal): displays asset ID, float, pattern seeds,(if the item is owned) and quick links:
- Price‑history sparkline (last 30 days) on each marketplace.
- Live order‑book snapshot (HBO / LSO stacks) on source and destination markets.
- Click opens the full Item drawer (price chart, historical order books, trades, etc.).
Table of Contents
1. Dashboard
1.1 Page Purpose
Provide a real‑time, filterable overview of platform performance—profitability, volume, order flow, and account health—so stakeholders can quickly assess how arbitrage operations are trending and drill down by account, rule, source market, and destination market.
| Goal | Actor |
|---|---|
| Snapshot of overall profit & ROI | Management, Analyst |
| Identify top‑/bottom‑performing rules | Analyst |
| Spot under‑utilised balances | Ops |
| Compare markets or accounts | Trader, Admin |
| Export metrics for reporting | Finance |
1.2 Global Filters (sticky top‑bar)
- Date Range 📅 (Today, 7 D, 30 D, Custom)
- Account ⌄ (multi‑select; All by default)
- Rule ⌄ (multi‑select)
- Source Market ⌄ (multi‑select)
- Destination Market ⌄ (multi‑select)
- Refresh 🔄 (auto every 60 s toggle)
All widgets react to the same filter set.
1.3 KPI Cards (first row)
| Card | Formula / Source | Notes |
|---|---|---|
| Total Realised Profit (USD) | Σ(sellPriceUsd − buyPriceUsd) where status = SOLD_ON_DESTINATION | Large green number, ↑/↓ vs previous period |
| Unrealised Profit | Σ(potentialSellPriceUsd − buyPriceUsd) for active arbitrages | Tooltip: counts BUYING, BOUGHT, SELLING |
| Average ROI % | Avg of realised ROI per arbitrage | Bar sparkline inside card |
| Active Arbitrages | Count where status ∈ {BUYING, BOUGHT, SELLING} | Grey pill |
| Orders in NEW / SEND_ITEM / RECIEVE_ITEM | Count grouped | Red if > threshold |
| Utilised Balance % | Σ funds locked in buy orders ÷ Σ available balance | Hover shows per‑account split |
1.4 Core Charts & Tables
| # | Widget | Type | Interactions |
|---|---|---|---|
| 1 | Profit Over Time | Line chart (daily bucket) | Hover daily realised & unrealised; click point → filter date |
| 2 | Rule Performance | Horizontal bar chart | Click bar → isolates that rule |
| 3 | Account Leaderboard | Table: Account, Realised $, Unrealised $, ROI % | Sortable; click row → open Accounts drawer |
| 4 | Market Pair Matrix | Heat‑map (src ↔ dest) by realised profit | Tooltip with count & avg ROI |
| 5 | Volume & Spread | Scatter: 7‑day volume vs avg spread % | Point size = avg profit %; click → Analyzer pre‑filtered |
| 6 | Order Status Breakdown | Donut chart | Legend click hides segment |
1.5 Drill‑Down Panel
Selecting any datapoint opens a side panel with:
- Snapshot filters applied
- Mini KPI row specific to selection
- Arbitrages tab — table (re‑uses Arbitrages page with frozen filter)
- Orders tab — table (re‑uses Orders widget)
1.6 APIs & Backend Contracts
TODO
1.7 Performance & Caching
- Metrics cached in Redis per filter hash for 30 s.
- Heavy charts (>90 d span) computed async; UI shows skeleton + “Computing…” badge.
- Live updates throttle to one per 5 s per widget.
1.8 Edge Cases & UX States
| Case | UX |
|---|---|
| No data for selected filters | Empty‑state illustration + “Broaden your filters” CTA |
| Partial outage (one widget fails) | Widget shows error card with retry 🔄; rest render normally |
| Very large data (heat‑map > 400 cells) | Auto‑switch to paged table view |
1.9 Open Questions
- Should Unrealised Profit include arbitrages with status DROPPED but not sold?
- Need support for time‑zone toggling (UTC vs local)?
- Required export formats besides CSV (e.g., XLSX, PDF snapshot)?
2. Analyzer
2.1 Page Purpose
Provide a sandbox for crafting or loading Arbitrage Rules and instantly previewing which items qualify.
| Goal | Actor |
|---|---|
| Test profitability hypotheses by tweaking filters | Analyst |
| Inspect eligible items for an existing rule | Trader |
| Persist a new rule | Admin |
| One‑click map rule → accounts | Admin |
2.2 High‑Level Layout
Top‑bar: Select Existing Rule ▼ • Rule Name (editable) • Save • Map to Accounts
Body: ┌──────────────┐ ┌─────────────────────────────┐
│ Rule Builder │ │ Eligible Items Table │
│ (35 % w) │ │ (65 % w) │
└──────────────┘ └─────────────────────────────┘
Footer: Result count • Last evaluated at …
2.3 Rule Builder Form
| Field | Control | Notes |
|---|---|---|
| Source Market | Select | default BUFF163 |
| Destination Market | Select | default STEAM |
| Price Range | Min + Max numeric | USD, nullable open‑ended |
| Min Profit % | Numeric | Required |
| Max Profit % | Numeric | Optional guard |
| priceOnSourceMarketForProfitCalculation | Enum select | Values per entity |
| priceOnDestMarketForProfitCalculation | Enum select | — |
| purchaseStrategy | Enum select | FROM_SELL_ORDER / SMART_BUY_ORDER |
| sellStrategy | Enum select | TO_BUY_ORDER / SMART_SELL_ORDER / MARKET_SELL_ORDER |
| sourceMarketBuyToSellPriceOffsetCoef | Numeric | Visible only if priceOnSourceMarketForProfitCalculation = BUY_TO_SELL_OFFSET_COEF |
| destMarketBuyToSellPriceOffsetCoef | Numeric | Visible only if priceOnDestMarketForProfitCalculation = BUY_TO_SELL_OFFSET_COEF |
| Volume & OB Filters | Repeater | Add MarketVolumeAndOrderBookFilter rows |
| Smart‑Buy / Smart‑Sell Tweaks | Collapsible | Advanced fields |
Interaction rules:
- Debounced evaluation (500 ms) on change.
- Offset‑coef fields auto‑show/hide.
- Save disabled until rule validates.
2.4 Eligible Items Table
| # | Column | Description |
|---|---|---|
| 1 | Item | Name + rarity + stickers + hover popup |
| 2 | Buy @ Source (calc) | Price we would pay |
| 3 | Current LSO (SRC) | Live lowest sell order |
| 4 | Current HBO (SRC) | Live highest buy order |
| 5 | Sell @ Destination (calc) | Target sell price |
| 6 | Current HBO (DEST) | Live highest buy order |
| 7 | Current LSO (DEST) | Live lowest sell order |
| 8 | Profit % | (sellCalc − buyCalc) / buyCalc |
| 9 | 7‑day Volume | From chosen market |
| 10 | Spread % (SRC) | (LSO−HBO)/LSO |
| 11 | Actions | View history • Add to watchlist |
Features: sortable, export CSV, row click opens Item drawer.
2.5 APIs & Data Flow
TODO
2.6 Interactivity & Performance
- Skeleton while fetching; if >2 s, show progress bar.
- Evaluation cancellable (“Running… Cancel”).
- Virtual scroll for >5 k rows.
2.7 Edge Cases & Error States
| Case | UX |
|---|---|
| Invalid rule (min > max) | Red banner + field highlight |
| Evaluation timeout | Toast + retry |
| Zero eligible items | Empty‑state illo |
2.8 Open Questions
- Evaluation to respect isActive flag?
- Max items per eval (paging)?
- Allow editing of active rules or enforce copy‑as‑new?
3. Arbitrages
3.1 Page Purpose
Provide an operational view of every Arbitrage lifecycle—from initial buy order to final sale—so traders and operators can monitor progress, intervene, and analyse realised vs projected profit.
| Goal | Actor |
|---|---|
| Track live arbitrages & profitability | Trader, Analyst |
| Filter by state | Ops |
| Move arbitrage to another account | Ops, Admin |
| Cancel / drop arbitrage | Ops |
| Drill‑down into history | Analyst |
3.2 High‑Level Layout
Top‑bar: Status ☐Active ☐Bought ☐Selling ☐Sold ☐Dropped • Account ▼ • Rule ▼ • Date 📅 • Search 🔍
Body: Arbitrages Data‑Table
Footer: n results • Last refreshed … • Auto‑refresh toggle
3.3 Status Definitions
| Code | Label | Badge |
|---|---|---|
| BUYING_ON_SOURCE | Buying | grey |
| BOUGHT_ON_SOURCE | Bought | blue |
| SELLING_ON_DESTINATION | Selling | amber |
| SOLD_ON_DESTINATION | Sold | green |
| DROPPED | Dropped | red |
3.4 Table Columns
| # | Column | Description |
|---|---|---|
| 1 | ☐ | Multi‑select |
| 2 | Item | Name + stickers |
| 3 | Account | Login |
| 4 | Rule | Snapshot name |
| 5 | Status | Badge (see 3.3) |
| 6 | Buy Price USD | Stored buy price |
| 7 | Potential Sell USD | Stored target |
| 8 | Current Dest HBO | Live price |
| 9 | Current Profit % | (currentDestBuy − buyPrice)/buyPrice |
| 10 | Created | Timestamp |
| 11 | Updated | Timestamp |
| 12 | ⋮ | View • Move • Cancel |
3.5 Row Drawer
| Section | Content |
|---|---|
| Timeline | State transitions with timestamp & note |
| Price History | Chart of buy, potential, current prices |
| Rule Snapshot | Pretty JSON diff |
| Orders | Related BUY/SELL orders list (links to Orders page) |
| Account Info | Quick link to Accounts drawer |
| Owned Item | Asset ID & inspect link |
3.6 Actions & Modals
| Action | Flow |
|---|---|
| Move | Select target account → POST /arbitrages/{id}/move |
| Cancel/Drop | Reason textarea → POST /arbitrages/{id}/cancel |
| Bulk Move | Same modal supports many IDs |
| Export CSV | Top‑bar |
3.7 Filtering & Query Params
| Filter | Param |
|---|---|
| Status | status[] |
| Account | accountId[] |
| Rule | ruleId[] |
| Date range | createdFrom, createdTo |
| Search | q |
3.8 APIs & Data Contracts
TODO
3.9 Interactivity & Performance
- Virtual scroll for big sets.
- Auto‑refresh 30 s; pause on heavy filter edits.
- Profit cell flashes on change.
3.10 Edge Cases & Error States
| Case | UX |
|---|---|
| Item not in expected inventory | Warning banner |
| Move fails (cooldown) | Modal error |
| Negative profit | Cell text red + tooltip |
3.11 Open Questions
- Use highest buy or lowest sell for Current Profit %?
- Bulk move rate‑limit?
- Show order IDs in table?
4. Accounts
4.1 Page Purpose
Compact control‑panel for creating, viewing, and maintaining every Steam account used in arbitrage trading.
| Goal | Actor |
|---|---|
| View balances & health | Trader, Analyst |
| Copy login/password/TOTP | Ops |
| Refresh balances or confirmations | Ops |
| Create / import account | Admin |
| Edit limited settings | Admin |
4.2 Key Layout
Top‑bar : Selected Accounts • Search • Bulk‑Jobs ▼ • + New Account
Table : Compact data‑table (min‑info)
Row click → inline details panel
Footer : Paging • "Last sync at …"
4.3 Visible Table Columns
| # | Column | UX |
|---|---|---|
| 1 | ☐ | Multi‑select |
| 2 | Login | Copy‑to‑clipboard |
| 3 | Password | Masked + eye‑reveal |
| 4 | TOTP | Rolling code |
| 5 | Confirmations | Badge (#) |
| 6 | Balance USD | Hover split |
| 7 | Inventory USD | "—" if none |
| 8 | Marketplace API | Icon strip |
| 9 | State | Pill |
| 10 | ⋮ | Row menu |
4.4 Row‑Expand / Details Panel
| Section | Fields |
|---|---|
| Account Meta | SteamID64, creation, level, proxy, last update |
| Trade URL | Copy / open |
| Per‑Marketplace | Table of balances, API status, sync time |
| Health Alerts | Bans, guard, escrow |
4.5 Bulk‑Jobs Menu
Refresh balances, refresh confirmations, export inventories, mass disable, etc.
4.6 Modals & Drawers
- Create Account wizard (Credentials → Marketplaces → Review)
- Edit Account (TBD fields)
- Inventory Drawer (items + arbitrage tags)
4.7 Hover‑Split Balance Popover
┌─────────────────────┐
│ Steam $12.45 │
│ Bitskins 40.00 │
│ Skinport 8.13 │
│ ------------------- │
│ Total $60.58 │
└─────────────────────┘
4.8 APIs & Data Contracts
TODO
4.9 Edge Cases & Error States
Missing API key, rate‑limit spinner, role‑restricted password copying, etc.
4.10 Open Questions
Editable‑field list, confirmation refresh cadence, marketplace limit per account.
5. Orders
5.1 Page Purpose
Display all BUY and SELL orders across every market account for full operational visibility.
| Goal | Actor |
|---|---|
| Monitor order states | Trader |
| Filter by type, market, account | Ops |
| Cancel/refresh stale orders | Ops |
| Export history | Analyst |
5.2 High‑Level Layout
Top‑bar: Type ☐Buy ☐Sell • Status ▼ • Market ▼ • Account ▼ • Date 📅 • Search 🔍 • Bulk Actions ▼
Body : Orders Data‑Table
Footer : n results • Last refreshed … • Auto‑refresh toggle
5.3 Status Definitions (badge colours)
| Status | Colour |
|---|---|
| NEW | grey |
| SEND_ITEM | amber |
| RECIEVE_ITEM | amber |
| PARTIALLY_FILLED | blue |
| FULFILLED | green |
| CANCELLED | red |
| CANCELLED_PARTIALLY_FILLED | red‑outline |
| BUFF_AWAITING_PAYMENT | purple |
| BUFF_AWAITING_CONFIRMATION | purple |
| BUFF_CONFIRMATION_COMPLETED | teal |
| BUFF_CONFIRMATION_FAILED | red |
5.4 Table Columns
| # | Column | Description |
|---|---|---|
| 1 | ☐ | Multi‑select |
| 2 | Item | Name + stickers |
| 3 | Type | BUY / SELL pill |
| 4 | Market | BUFF163, STEAM, etc. |
| 5 | Account | Login |
| 6 | Price (native) | price + currency |
| 7 | Price USD | Net price |
| 8 | Qty | qty |
| 9 | Filled | filledQty |
| 10 | Status | Badge (see 5.3) |
| 11 | Arbitrage | ID link / — |
| 12 | TradeOffer | Link if present |
| 13 | Created | Timestamp |
| 14 | Updated | Timestamp |
| 15 | ⋮ | Cancel • Refresh |
5.5 Row Drawer
| Section | Details |
|---|---|
| Timeline | Status changes + fill Qty |
| Owned Items | Asset IDs list |
| Raw Payload | Collapsible JSON |
| Arbitrage Context | Badge + link |
5.6 Bulk Actions & Modals
Cancel orders, refresh status, export CSV.
5.7 Filtering & Query Params
Type, status, market, account, date range, search.
5.8 APIs
TODO
5.9 Interactivity & Performance
Virtual scroll, auto‑refresh 15 s, status flash on change.
5.10 Edge Cases
Missing TradeOffer, Buff confirmation failed, cancel rejected by API.
5.11 Open Questions
Price per item column? Edit open BUY order price? Bulk SEND_ITEM helper?