@tallyui/components 3.9.0 → 3.9.1

package/dist/index.d.ts

@@ -1456,16 +1456,29 @@ declare function SyncStatus({ state, registerState, pluginName, pullNotice }: {
     pullNotice?: SyncNotice;
 }): react_jsx_runtime.JSX.Element;
 
+/** One order from the store's own history (ADR-052 amendment 1), mapped by the app from its platform. */
+type OrderHistoryRow = {
+    id: string;
+    clientOrderId?: string;
+    reference: string;
+    placedAt: string;
+    totalMinor: number;
+    currency: string;
+    itemCount: number;
+    stateLabel: string;
+};
 /** The "Needs attention" (when not empty) and "Recent" orders, lifted from medusapos/app's orders screen (ADR-052).
  * `onRetry` is the outbox's `requeue`; `formatDate` replaces the app's date util; `footer` is the app's own content
  * (medusapos: the feedback link). The router and session redirect stay in the app. `stuck` is the outbox's
- * `state.stuck` (`useOrderOutbox`): those pending orders need attention too, each with its own entry's reason and since. */
-declare function OrdersList({ orders, onRetry, formatDate, footer, stuck }: {
+ * `state.stuck` (`useOrderOutbox`): those pending orders need attention too, each with its own entry's reason and since.
+ * `history` adds read-only store order rows to Recent (ADR-052 amendment 1). */
+declare function OrdersList({ orders, onRetry, formatDate, footer, stuck, history }: {
     orders: PosOrder[];
     onRetry(orderIds: string[]): Promise<number>;
     formatDate?: (iso: string) => string;
     footer?: ReactNode;
     stuck?: OutboxState['stuck'];
+    history?: OrderHistoryRow[];
 }): react_jsx_runtime.JSX.Element;
 
 /** Pass `useParkedSales(drafts)`'s `parked` and `discard`, or your own parked store's list and handlers (`onPark`, `onResume`, `onDiscard`) with the same results. */
@@ -1560,4 +1573,4 @@ interface StoreSettingsChoiceScreenProps extends Omit<ViewProps, 'children'> {
  */
 declare function StoreSettingsChoiceScreen({ choices, initial, onSubmit, countryName, locale, title, body, regionLabel, countryLabel, channelLabel, submitLabel, className, ...viewProps }: StoreSettingsChoiceScreenProps): react_jsx_runtime.JSX.Element;
 
-export { APPROVAL_REQUIRED_TEXT, Accordion, AccordionContent, AccordionItem, AccordionTrigger, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, Avatar, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Cart, type CartAction, CartBar, CartLine, CartLineActions, type CartLineActionsProps, type CartLineProps, CartNoteInput, type CartNoteInputProps, CartPanel, type CartPanelProps, CartTotal, type CartTotalProps, CashCountInput, type CashCountInputProps, CashTendered, type CashTenderedProps, Catalogue, type CategoryItem, CategoryNav, type CategoryNavProps, ChangeDisplay, type ChangeDisplayProps, ChargeForm, type ChargeFormProps, Checkbox, CheckoutLayout, type CheckoutLayoutProps, type ChipItem, ClosureSheet, type ClosureSheetProps, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxTrigger, type ConnectionStatus, ConnectorStatus, type ConnectorStatusProps, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CustomerCard, type CustomerCardProps, CustomerForm, type CustomerFormProps, type CustomerFormValues, CustomerOrderHistory, type CustomerOrderHistoryProps, CustomerPicker, type CustomerPickerProps, CustomerSelect, type CustomerSelectProps, type Denomination, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DiscountBadge, type DiscountBadgeProps, DiscountChips, DiscountForm, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FilterChip, FilterChipGroup, type FilterChipGroupProps, type FilterChipProps, HStack, type HStackProps, HoverCard, HoverCardContent, HoverCardTrigger, Icon, IconButton, type IconButtonProps, type IconProps, Input, InputField, InputRoot, type InputRootProps, InputSlot, Label, type LabelProps, LiveTabScreen, type LiveTabScreenProps, type LiveTabScreenState, Loader, type LoaderProps, MovementSheet, type MovementSheetProps, OpenRegisterCard, type OpenRegisterCardProps, OrderCard, type OrderCardProps, OrderDetail, type OrderDetailLineItem, type OrderDetailProps, OrderList, type OrderListProps, type OrderStatus, OrderStatusBadge, type OrderStatusBadgeProps, OrderSummary, OrderSummaryLine, type OrderSummaryLineProps, type OrderSummaryPayment, type OrderSummaryProps, OrdersList, POSLayout, type POSLayoutProps, ParkedSales, type ParkedSalesProps, type PaymentMethod, PaymentMethodCard, type PaymentMethodCardProps, PaymentSelector, type PaymentSelectorProps, Popover, PopoverContent, PopoverTrigger, PriceForm, ProductCard, type ProductCardProps, ProductGrid, type ProductGridProps, ProductImage, type ProductImageProps, ProductList, type ProductListProps, ProductPrice, type ProductPriceProps, ProductSku, type ProductSkuProps, ProductStockBadge, type ProductStockBadgeProps, ProductTable, type ProductTableColumn, type ProductTableProps, ProductTitle, type ProductTitleProps, ProductVariantPicker, type ProductVariantPickerProps, Progress, type ProgressProps, QuantityStepper, type QuantityStepperProps, RadioGroup, RadioGroupItem, Receipt, type ReceiptItem, ReceiptPreview, type ReceiptPreviewProps, RegisterBar, type RegisterBarPill, type RegisterBarProps, RegisterColumn, type RegisterColumnProps, RegisterCount, type RegisterCountProps, RegisterOpenClose, type RegisterOpenCloseProps, RegisterPanel, type RegisterPanelProps, RegisterPicker, type RegisterPickerProps, type RegisterPickerRegister, RegisterSummary, type RegisterSummaryProps, SearchIcon, SearchInput, type SearchInputProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeparatorProps, SettingsGroup, type SettingsGroupProps, SettingsLayout, type SettingsLayoutProps, SettingsRow, type SettingsRowProps, Slider, type SliderProps, SplitTender, StoreSettingsChoiceScreen, type StoreSettingsChoiceScreenProps, type SvgIconProps, Switch, SyncStatus, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tender, Text, type TextProps, Textarea, type TextareaProps, Toast, ToastClose, ToastDescription, type ToastProps, ToastTitle, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipContent, TooltipTrigger, type TransactionSummary, VStack, type VStackProps, type VariantOption, ViewToggle, type ViewToggleProps, XIcon, avatarVariants, badgeTextVariants, badgeVariants, buttonTextVariants, buttonVariants, createSvgIcon, defaultProductColumns, describeRegisterBarPill, discountLabel, formatStockSyncTime, hstackVariants, iconButtonVariants, iconVariants, injectPrintStyle, loaderVariants, orderReference, parseDiscount, parsePrice, textVariants, toastVariants, toggleTextVariants, toggleVariants, useDefaultProductColumns, useInputContext, vstackVariants };
+export { APPROVAL_REQUIRED_TEXT, Accordion, AccordionContent, AccordionItem, AccordionTrigger, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, Avatar, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Cart, type CartAction, CartBar, CartLine, CartLineActions, type CartLineActionsProps, type CartLineProps, CartNoteInput, type CartNoteInputProps, CartPanel, type CartPanelProps, CartTotal, type CartTotalProps, CashCountInput, type CashCountInputProps, CashTendered, type CashTenderedProps, Catalogue, type CategoryItem, CategoryNav, type CategoryNavProps, ChangeDisplay, type ChangeDisplayProps, ChargeForm, type ChargeFormProps, Checkbox, CheckoutLayout, type CheckoutLayoutProps, type ChipItem, ClosureSheet, type ClosureSheetProps, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxContent, ComboboxEmpty, ComboboxInput, ComboboxItem, ComboboxTrigger, type ConnectionStatus, ConnectorStatus, type ConnectorStatusProps, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CustomerCard, type CustomerCardProps, CustomerForm, type CustomerFormProps, type CustomerFormValues, CustomerOrderHistory, type CustomerOrderHistoryProps, CustomerPicker, type CustomerPickerProps, CustomerSelect, type CustomerSelectProps, type Denomination, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DiscountBadge, type DiscountBadgeProps, DiscountChips, DiscountForm, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FilterChip, FilterChipGroup, type FilterChipGroupProps, type FilterChipProps, HStack, type HStackProps, HoverCard, HoverCardContent, HoverCardTrigger, Icon, IconButton, type IconButtonProps, type IconProps, Input, InputField, InputRoot, type InputRootProps, InputSlot, Label, type LabelProps, LiveTabScreen, type LiveTabScreenProps, type LiveTabScreenState, Loader, type LoaderProps, MovementSheet, type MovementSheetProps, OpenRegisterCard, type OpenRegisterCardProps, OrderCard, type OrderCardProps, OrderDetail, type OrderDetailLineItem, type OrderDetailProps, type OrderHistoryRow, OrderList, type OrderListProps, type OrderStatus, OrderStatusBadge, type OrderStatusBadgeProps, OrderSummary, OrderSummaryLine, type OrderSummaryLineProps, type OrderSummaryPayment, type OrderSummaryProps, OrdersList, POSLayout, type POSLayoutProps, ParkedSales, type ParkedSalesProps, type PaymentMethod, PaymentMethodCard, type PaymentMethodCardProps, PaymentSelector, type PaymentSelectorProps, Popover, PopoverContent, PopoverTrigger, PriceForm, ProductCard, type ProductCardProps, ProductGrid, type ProductGridProps, ProductImage, type ProductImageProps, ProductList, type ProductListProps, ProductPrice, type ProductPriceProps, ProductSku, type ProductSkuProps, ProductStockBadge, type ProductStockBadgeProps, ProductTable, type ProductTableColumn, type ProductTableProps, ProductTitle, type ProductTitleProps, ProductVariantPicker, type ProductVariantPickerProps, Progress, type ProgressProps, QuantityStepper, type QuantityStepperProps, RadioGroup, RadioGroupItem, Receipt, type ReceiptItem, ReceiptPreview, type ReceiptPreviewProps, RegisterBar, type RegisterBarPill, type RegisterBarProps, RegisterColumn, type RegisterColumnProps, RegisterCount, type RegisterCountProps, RegisterOpenClose, type RegisterOpenCloseProps, RegisterPanel, type RegisterPanelProps, RegisterPicker, type RegisterPickerProps, type RegisterPickerRegister, RegisterSummary, type RegisterSummaryProps, SearchIcon, SearchInput, type SearchInputProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeparatorProps, SettingsGroup, type SettingsGroupProps, SettingsLayout, type SettingsLayoutProps, SettingsRow, type SettingsRowProps, Slider, type SliderProps, SplitTender, StoreSettingsChoiceScreen, type StoreSettingsChoiceScreenProps, type SvgIconProps, Switch, SyncStatus, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tender, Text, type TextProps, Textarea, type TextareaProps, Toast, ToastClose, ToastDescription, type ToastProps, ToastTitle, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipContent, TooltipTrigger, type TransactionSummary, VStack, type VStackProps, type VariantOption, ViewToggle, type ViewToggleProps, XIcon, avatarVariants, badgeTextVariants, badgeVariants, buttonTextVariants, buttonVariants, createSvgIcon, defaultProductColumns, describeRegisterBarPill, discountLabel, formatStockSyncTime, hstackVariants, iconButtonVariants, iconVariants, injectPrintStyle, loaderVariants, orderReference, parseDiscount, parsePrice, textVariants, toastVariants, toggleTextVariants, toggleVariants, useDefaultProductColumns, useInputContext, vstackVariants };

package/dist/index.js

@@ -5226,7 +5226,7 @@ function defaultFormatDate2(iso) {
   const date = new Date(iso);
   return Number.isNaN(date.getTime()) ? iso : new Intl.DateTimeFormat(void 0, { dateStyle: "medium", timeStyle: "short" }).format(date);
 }
-function OrdersList({ orders, onRetry, formatDate = defaultFormatDate2, footer, stuck }) {
+function OrdersList({ orders, onRetry, formatDate = defaultFormatDate2, footer, stuck, history }) {
   const retrying = useRef8(/* @__PURE__ */ new Set());
   const [retryingIds, setRetryingIds] = useState24(/* @__PURE__ */ new Set());
   const [expanded, setExpanded] = useState24(/* @__PURE__ */ new Set());
@@ -5236,11 +5236,32 @@ function OrdersList({ orders, onRetry, formatDate = defaultFormatDate2, footer,
     }
     setRetryingIds(new Set(retrying.current));
   }, [orders]);
+  const shown = (history ?? []).filter((row) => row.clientOrderId === void 0 || !orders.some((order) => order.id === row.clientOrderId));
+  const recent = shown.length === 0 ? orders : [...orders, ...shown].sort((a, b) => {
+    const aTime = Date.parse("placedAt" in a ? a.placedAt : a.createdAt);
+    const bTime = Date.parse("placedAt" in b ? b.placedAt : b.createdAt);
+    if (Number.isNaN(aTime)) return Number.isNaN(bTime) ? 0 : 1;
+    if (Number.isNaN(bTime)) return -1;
+    return bTime - aTime;
+  });
   return /* @__PURE__ */ jsxs58(ScrollView13, { className: "flex-1 bg-background p-4", children: [
-    [{ title: "Needs attention", orders: needsAttention(orders, { stuckCommandIds: stuck?.commandIds }) }, { title: "Recent", orders }].filter((section) => section.title === "Recent" || section.orders.length > 0).map((section) => /* @__PURE__ */ jsxs58(View65, { className: "mb-6 gap-3", children: [
+    [{ title: "Needs attention", orders: needsAttention(orders, { stuckCommandIds: stuck?.commandIds }) }, { title: "Recent", orders: recent }].filter((section) => section.title === "Recent" || section.orders.length > 0).map((section) => /* @__PURE__ */ jsxs58(View65, { className: "mb-6 gap-3", children: [
       /* @__PURE__ */ jsx100(Text43, { accessibilityRole: "header", className: "text-xl font-semibold text-foreground", children: section.title }),
-      section.title === "Recent" && orders.length === 0 ? /* @__PURE__ */ jsx100(Text43, { testID: "orders-empty", className: "text-muted-foreground", children: "No sales yet. Completed sales appear here." }) : null,
+      section.title === "Recent" && orders.length === 0 && shown.length === 0 ? /* @__PURE__ */ jsx100(Text43, { testID: "orders-empty", className: "text-muted-foreground", children: "No sales yet. Completed sales appear here." }) : null,
       section.orders.map((order) => {
+        if ("placedAt" in order) {
+          const row = order;
+          return /* @__PURE__ */ jsxs58(View65, { testID: `history-row-${row.id}`, className: "gap-1 rounded-md border border-border bg-card p-3", children: [
+            /* @__PURE__ */ jsx100(Text43, { className: "text-foreground", children: `Order ${row.reference} \xB7 ${row.itemCount} ${row.itemCount === 1 ? "item" : "items"}` }),
+            /* @__PURE__ */ jsxs58(Text43, { className: "text-muted-foreground", children: [
+              formatDate(row.placedAt),
+              " \xB7 ",
+              formatMoney17({ amount: row.totalMinor, currency: row.currency }),
+              " \xB7 ",
+              row.stateLabel
+            ] })
+          ] }, `history:${row.id}`);
+        }
         const count2 = order.lines.reduce((sum, line) => sum + line.quantity, 0);
         const key = `${section.title}:${order.id}`;
         const isExpanded = expanded.has(key);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tallyui/components",
-  "version": "3.9.0",
+  "version": "3.9.1",
   "type": "module",
   "description": "Universal POS UI components for Tally UI",
   "main": "./dist/index.js",
@@ -28,22 +28,22 @@
     "directory": "packages/components"
   },
   "peerDependencies": {
-    "@tallyui/core": "^3.9.0",
-    "@tallyui/primitives": "^3.9.0",
-    "@tallyui/theme": "^3.9.0",
+    "@tallyui/core": "^3.9.1",
+    "@tallyui/primitives": "^3.9.1",
+    "@tallyui/theme": "^3.9.1",
     "react": ">=18",
     "react-native": ">=0.74",
     "react-native-svg": ">=15"
   },
   "dependencies": {
     "class-variance-authority": "^0.7.1",
-    "@tallyui/pos": "3.9.0"
+    "@tallyui/pos": "3.9.1"
   },
   "devDependencies": {
-    "@tallyui/connector-medusa": "3.9.0",
-    "@tallyui/connector-vendure": "3.9.0",
-    "@tallyui/connector-woocommerce": "3.9.0",
-    "@tallyui/mock-api": "3.9.0",
+    "@tallyui/connector-medusa": "3.9.1",
+    "@tallyui/connector-vendure": "3.9.1",
+    "@tallyui/connector-woocommerce": "3.9.1",
+    "@tallyui/mock-api": "3.9.1",
     "@types/react": ">=18",
     "react": "^19.2.4",
     "react-native-svg": "15.12.1",

package/src/index.ts

@@ -164,7 +164,7 @@ export {
   Cart, CartBar, Tender, SplitTender, DiscountForm, DiscountChips, parseDiscount, discountLabel,
   PriceForm, parsePrice,
   ChargeForm, type ChargeFormProps,
-  Catalogue, formatStockSyncTime, Receipt, injectPrintStyle, SyncStatus, OrdersList, orderReference,
+  Catalogue, formatStockSyncTime, Receipt, injectPrintStyle, SyncStatus, OrdersList, type OrderHistoryRow, orderReference,
   ParkedSales, type ParkedSalesProps,
 } from './sale';
 

package/src/sale/index.ts

@@ -10,5 +10,5 @@ export { Receipt } from './receipt';
 export { orderReference } from './order-reference';
 export { injectPrintStyle } from './print-style';
 export { SyncStatus } from './sync-status';
-export { OrdersList } from './orders-list';
+export { OrdersList, type OrderHistoryRow } from './orders-list';
 export { ParkedSales, type ParkedSalesProps } from './parked-sales';

package/src/sale/orders-list.tsx

@@ -5,6 +5,12 @@ import { needsAttention, type OutboxState, type PosOrder } from '@tallyui/pos';
 import { orderReference } from './order-reference';
 import { sinceText } from './since-text';
 
+/** One order from the store's own history (ADR-052 amendment 1), mapped by the app from its platform. */
+export type OrderHistoryRow = {
+  id: string; clientOrderId?: string; reference: string; placedAt: string;
+  totalMinor: number; currency: string; itemCount: number; stateLabel: string;
+};
+
 const STATUS_LABEL = { pending: 'Waiting to sync', applied: 'Synced', rejected: 'Not accepted' };
 /** `figures_mismatch`'s labels; a field a newer store sends that isn't here is shown by its raw name. */
 const FIGURE_LABELS = new Map([['subtotalMinor', 'Subtotal'], ['taxMinor', 'Tax'], ['discountMinor', 'Discount']]);
@@ -36,10 +42,12 @@ function defaultFormatDate(iso: string) {
 /** The "Needs attention" (when not empty) and "Recent" orders, lifted from medusapos/app's orders screen (ADR-052).
  * `onRetry` is the outbox's `requeue`; `formatDate` replaces the app's date util; `footer` is the app's own content
  * (medusapos: the feedback link). The router and session redirect stay in the app. `stuck` is the outbox's
- * `state.stuck` (`useOrderOutbox`): those pending orders need attention too, each with its own entry's reason and since. */
-export function OrdersList({ orders, onRetry, formatDate = defaultFormatDate, footer, stuck }: {
+ * `state.stuck` (`useOrderOutbox`): those pending orders need attention too, each with its own entry's reason and since.
+ * `history` adds read-only store order rows to Recent (ADR-052 amendment 1). */
+export function OrdersList({ orders, onRetry, formatDate = defaultFormatDate, footer, stuck, history }: {
   orders: PosOrder[]; onRetry(orderIds: string[]): Promise<number>; formatDate?: (iso: string) => string; footer?: ReactNode;
   stuck?: OutboxState['stuck'];
+  history?: OrderHistoryRow[];
 }) {
   const retrying = useRef(new Set<string>());
   const [retryingIds, setRetryingIds] = useState(new Set<string>());
@@ -50,12 +58,27 @@ export function OrdersList({ orders, onRetry, formatDate = defaultFormatDate, fo
     }
     setRetryingIds(new Set(retrying.current));
   }, [orders]);
+  const shown = (history ?? []).filter((row) => row.clientOrderId === undefined || !orders.some((order) => order.id === row.clientOrderId));
+  const recent = shown.length === 0 ? orders : [...orders, ...shown].sort((a, b) => {
+    const aTime = Date.parse('placedAt' in a ? a.placedAt : a.createdAt);
+    const bTime = Date.parse('placedAt' in b ? b.placedAt : b.createdAt);
+    if (Number.isNaN(aTime)) return Number.isNaN(bTime) ? 0 : 1;
+    if (Number.isNaN(bTime)) return -1;
+    return bTime - aTime;
+  });
   return <ScrollView className="flex-1 bg-background p-4">
-    {[{ title: 'Needs attention', orders: needsAttention(orders, { stuckCommandIds: stuck?.commandIds }) }, { title: 'Recent', orders }].filter((section) => section.title === 'Recent' || section.orders.length > 0).map((section) => (
+    {[{ title: 'Needs attention', orders: needsAttention(orders, { stuckCommandIds: stuck?.commandIds }) }, { title: 'Recent', orders: recent }].filter((section) => section.title === 'Recent' || section.orders.length > 0).map((section) => (
       <View key={section.title} className="mb-6 gap-3">
         <Text accessibilityRole="header" className="text-xl font-semibold text-foreground">{section.title}</Text>
-        {section.title === 'Recent' && orders.length === 0 ? <Text testID="orders-empty" className="text-muted-foreground">No sales yet. Completed sales appear here.</Text> : null}
+        {section.title === 'Recent' && orders.length === 0 && shown.length === 0 ? <Text testID="orders-empty" className="text-muted-foreground">No sales yet. Completed sales appear here.</Text> : null}
         {section.orders.map((order) => {
+          if ('placedAt' in order) {
+            const row = order;
+            return <View key={`history:${row.id}`} testID={`history-row-${row.id}`} className="gap-1 rounded-md border border-border bg-card p-3">
+              <Text className="text-foreground">{`Order ${row.reference} · ${row.itemCount} ${row.itemCount === 1 ? 'item' : 'items'}`}</Text>
+              <Text className="text-muted-foreground">{formatDate(row.placedAt)} · {formatMoney({ amount: row.totalMinor, currency: row.currency })} · {row.stateLabel}</Text>
+            </View>;
+          }
           const count = order.lines.reduce((sum, line) => sum + line.quantity, 0);
           const key = `${section.title}:${order.id}`;
           const isExpanded = expanded.has(key);