Design

Charts

The product’s figures drawn as the product shows them — each use of a chart on its screen or card, in the palette, in both themes.

How the charts are drawn

The product draws its charts with Recharts (SC-008): React components on SVG, coloured by the CSS variables of the tokens. This page draws each chart as inline SVG on the same tokens, in the shapes Recharts gives: a bar chart, a line chart, a bar chart laid on its side. Both themes read from the same variables.

Three uses, one screen

The documentation prices basic reports only: sales, commission and order status, all on the administrator’s Reports screen. There is no seller dashboard chart in the first release, so there is none here.

Currencies are never summed

Each currency has its own chart and its own scale, picked with the switch above the card. There is no total across currencies: the reporting currency is still open (Q-030).

The period and the rate are the sample’s

The last 6 months, month by month, is the sample’s own choice (Q-030 is open), and so is the commission rate of 12% (Q-001). The real period and the real rates are set by the client.

Colour is never alone

One series wears the brand colour. A month in progress is hatched, not paler. Dispute and cancelled use the feedback tones and each carries an icon and its label. Text stays in the text colours.

Axes

Columns, lines and bars start at zero. The unit is in the axis title (thousands of the currency), values are written in full on the mark that matters, and there are at most five gridlines, quiet and horizontal for columns and lines.

Labels and tooltip

One series needs no legend box; the title names it, and a small key explains the hatching. The value stands on the last mark. Hovering or focusing a mark opens a tooltip with the month and the amount; the arrow keys move between marks, and Escape closes it. A table of the same figures sits under every chart.

Empty and loading

Empty: the sealed box, a heading and one sentence, with the period selector kept. Loading: the places of the columns in the muted surface. A chart that draws itself stands finished when the device asks for reduced motion.

The series: the brand colour Hatching: a month in progress Danger tone and icon: in dispute Warning tone and icon: cancelled

Sales by month

How much the marketplace sold each month, one currency at a time.

ADM-C14 · ADM-C15 · FR-15

Who looks at it	Administrator
Where it stands	Reports screen, first card, in the admin shell on a desktop, under a currency switch (EUR, USD, GBP). On a tablet the sidebar starts folded and the cards stack.
The question it answers	How much did the marketplace sell each month, in this currency?
The data	Gross sales per month for the last 6 months, one chart per currency; the figures are the sample’s own.
When there is nothing to show	A sealed box and “No sales in this currency for this period yet”; the period selector stays. While loading, the places of the columns are held.
Stage	MVP Basic reports; analytics beyond them is staged next.

The card

Sales by month

Gross sales in EUR, never added to another currency

Closed monthMonth in progress, to date

Show the figures as a table

Month	Gross sales EUR	Gross sales USD	Gross sales GBP
May	€184,200	$21,400	£15,800
Jun	€212,600	$26,900	£18,300
Jul	€236,900	$30,200	£22,700
Aug	€251,300	$28,800	£24,100
Sep	€298,400	$35,600	£27,900
Oct (to date)	€147,800	$17,100	£12,600

The other currencies: each its own chart, its own scale

Sales by month

Gross sales in USD, never added to another currency

Closed monthMonth in progress, to date

Sales by month

Gross sales in GBP, never added to another currency

Closed monthMonth in progress, to date

Empty and loading

Sales by month

Gross sales in GBP, never added to another currency

No sales in GBP for this period yet

Choose another period or currency. Sales appear here as soon as the marketplace records them.

Sales by month

Gross sales in EUR, never added to another currency

On the Reports screen

ManageReports

Search orders, users, listings

Reports

Basic reports; every currency on its own, never added together

Sales by month

Gross sales in EUR, never added to another currency

Closed monthMonth in progress, to date

Commission by month

Commission collected in EUR, worked from the sales

Commission, May – Oct 2026€159,744At the sample rate of 12% of gross sales; October to date

Closed monthMonth in progress, to date

Orders by status

141 orders in October to date; a count, so no currency

In dispute: a case is openCancelled: the order did not go ahead

Desktop · Reports, the sales card in view

Commission by month

What the commission brought in each month, beside the sales.

ADM-C14 · PAY-C08 · PAY-C10 · FR-15

Who looks at it	Administrator
Where it stands	Reports screen, second card beside the sales card, with the same currency switch and the same period.
The question it answers	What did the commission bring in each month, and how does it track the sales?
The data	Commission per month per currency, worked from the sales at one sample rate (12%); the real rates are still open. The total of the period stands in a tile above the line.
When there is nothing to show	A sealed box and “No commission collected in this currency for this period”.
Stage	MVP Basic reports.

The card

Commission by month

Commission collected in EUR, worked from the sales

Commission, May – Oct 2026€159,744At the sample rate of 12% of gross sales; October to date

Closed monthMonth in progress, to date

Show the figures as a table

Month	Commission EUR	Commission USD	Commission GBP
May	€22,104	$2,568	£1,896
Jun	€25,512	$3,228	£2,196
Jul	€28,428	$3,624	£2,724
Aug	€30,156	$3,456	£2,892
Sep	€35,808	$4,272	£3,348
Oct (to date)	€17,736	$2,052	£1,512

The other currencies: each its own chart, its own scale

Commission by month

Commission collected in USD, worked from the sales

Commission, May – Oct 2026$19,200At the sample rate of 12% of gross sales; October to date

Closed monthMonth in progress, to date

Commission by month

Commission collected in GBP, worked from the sales

Commission, May – Oct 2026£14,568At the sample rate of 12% of gross sales; October to date

Closed monthMonth in progress, to date

Empty and loading

Commission by month

Commission collected in GBP, worked from the sales

No commission collected in GBP for this period

Choose another period or currency. Commission appears here once sales are recorded.

On the Reports screen

ManageReports

Search orders, users, listings

Reports

Basic reports; every currency on its own, never added together

Sales by month

Gross sales in EUR, never added to another currency

Closed monthMonth in progress, to date

Commission by month

Commission collected in EUR, worked from the sales

Commission, May – Oct 2026€159,744At the sample rate of 12% of gross sales; October to date

Closed monthMonth in progress, to date

Orders by status

141 orders in October to date; a count, so no currency

In dispute: a case is openCancelled: the order did not go ahead

Desktop · Reports, the commission card in view

Orders by status

Where the orders of the period stand, in the order of their lifecycle.

ADM-C14 · ORD-C06 · FR-15

Who looks at it	Administrator
Where it stands	Reports screen, third card at full width under the two, in the admin shell on a desktop.
The question it answers	Where do the orders of the period stand?
The data	Order counts per status for the period, in the order of the lifecycle; in dispute and cancelled follow, in feedback tones with an icon and a label. A count, so no currency.
When there is nothing to show	A sealed box and “No orders in this period”.
Stage	MVP Basic reports.

The card

Orders by status

141 orders in October to date; a count, so no currency

In dispute: a case is openCancelled: the order did not go ahead

Show the figures as a table

Status	Orders
Paid	14
Awaiting shipment	18
In transit	22
At hub	9
Inspected	6
Delivered	27
Completed	38
In dispute	3
Cancelled	4

Empty

Orders by status

No orders in this period

Choose another period. Orders appear here as soon as the first one is placed.

On the Reports screen

ManageReports

Search orders, users, listings

Reports

Basic reports; every currency on its own, never added together

Sales by month

Gross sales in EUR, never added to another currency

Closed monthMonth in progress, to date

Commission by month

Commission collected in EUR, worked from the sales

Commission, May – Oct 2026€159,744At the sample rate of 12% of gross sales; October to date

Closed monthMonth in progress, to date

Orders by status

141 orders in October to date; a count, so no currency

In dispute: a case is openCancelled: the order did not go ahead

Desktop · Reports, scrolled to the orders card