Reorder Center component sketches

HTML sketches for the frontend components used in the Airgoods low-inventory reorder case study.

Page shell

ReorderCenterPage

Owns page-level data fetching, selected filters, selected recommendation IDs, and layout.

Reorder Center
Products from connected inventory sources that may need replenishment.
2 sources active
Square synced 18m ago · Shopify synced 42m ago
Out of stock
4
Low inventory
18
Reorder value
$1.2k
Needs review
6

Source and status components

InventorySourceManager

Shows connected sources, sync status, enabled/paused state, manual refresh buttons, and source selection.

2 inventory sources active
Source systems remain the inventory truth.
Square POS
Main Store · synced 18m ago
Shopify Online
Online Store · synced 42m ago
Toast Cafe
Disconnected 2d ago

SyncStatusBanner

Communicates freshness and stale/error states so users trust the inventory data.

Square synced 18 minutes ago
428 products checked across Main Store.
Healthy
Toast sync failed
Showing last successful sync from 2 days ago.
Stale

Recommendation components

ReorderSummaryCards + ReorderFilters

Gives a quick overview and lets retailers narrow recommendations by product, source, urgency, supplier, and location.

Out of stock
4
Urgent
Low inventory
18
Below threshold
Recommended reorder
$1,284
3 suppliers
Needs review
6
Similar items
Search products
All sources
All urgency
Main Store

LowInventoryTable + ReorderRecommendationRow + RecommendedQuantityControl

Displays only confirmed Airgoods mappings that are safe to reorder, with adjustable suggested quantities.

ProductSourceStockThresholdSuggestedStatusAction
✓
ZaZa
ZaZa Za'atar Pita Chips
ZaZa Snacks
Square012−48+Out
✓
St Agrestis
St. Agrestis Phony Negroni
Phony Negroni x St. Agrestis
Square38−24+Low

SimilarItemsReviewPanel

Keeps similar/unconfirmed products out of the reorder table until the mapping is confirmed.

Umma's Mix
POS item: Gochujang Snack Mix
Suggested: Umma's Mix by Gochiso

BulkReorderActionBar

Lets the retailer add selected recommendations to cart in one action.

3 items selected · Estimated total $412
Selected quantities will be added to cart.