fix: align order dashboard sidebar badge count

Author: KaiUweCZE

apps/medusa-be/src/api/admin/order-expedition/summary/route.ts

@@ -9,6 +9,7 @@ import {
   ACTION_REQUIRED_ORDER_BUSINESS_STATUS_IDS,
   ORDER_BUSINESS_STATUS_IDS,
   type OrderBusinessStatusId,
+  isPendingUnpaidOrder,
   resolveOrderBusinessStatus,
 } from "../../../../utils/order-business-status"
 import {
@@ -22,6 +23,7 @@ const ORDER_EXPEDITION_SUMMARY_BATCH_SIZE = 500
 
 type OrderExpeditionSummaryResponse = {
   action_required_count: number
+  pending_unpaid_count: number
   scanned_count: number
   status_counts: Record<OrderBusinessStatusId, number>
   total_count: number
@@ -40,6 +42,7 @@ export async function GET(req: MedusaRequest, res: MedusaResponse) {
   const query = req.scope.resolve<Query>(ContainerRegistrationKeys.QUERY)
   let offset = 0
   let totalCount: number | null = null
+  let pendingUnpaidCount = 0
   let scannedCount = 0
   const statusCounts = createEmptyStatusCounts()
 
@@ -59,6 +62,7 @@ export async function GET(req: MedusaRequest, res: MedusaResponse) {
     for (const order of orders) {
       const statusId = resolveOrderBusinessStatus(order).id
       statusCounts[statusId] += 1
+      pendingUnpaidCount += isPendingUnpaidOrder(order) ? 1 : 0
     }
 
     offset += orders.length
@@ -70,6 +74,7 @@ export async function GET(req: MedusaRequest, res: MedusaResponse) {
 
   const summary: OrderExpeditionSummaryResponse = {
     action_required_count: getActionRequiredCount(statusCounts),
+    pending_unpaid_count: pendingUnpaidCount,
     scanned_count: scannedCount,
     status_counts: statusCounts,
     total_count: totalCount ?? scannedCount,
@@ -130,6 +135,7 @@ function isOrderExpeditionSummaryResponse(
 
   return (
     typeof summary.action_required_count === "number" &&
+    typeof summary.pending_unpaid_count === "number" &&
     typeof summary.scanned_count === "number" &&
     typeof summary.total_count === "number" &&
     typeof summary.unhandled_count === "number" &&

apps/medusa-be/src/utils/order-business-status.ts

@@ -123,6 +123,13 @@ const AWAITING_PAYMENT_STATUSES = new Set([
 ])
 
 const PAID_PAYMENT_STATUSES = new Set(["captured", "completed"])
+const PENDING_UNPAID_PAYMENT_STATUSES = new Set([
+  "authorized",
+  "awaiting",
+  "not_paid",
+  "partially_authorized",
+  "requires_action",
+])
 
 const SHIPPED_FULFILLMENT_STATUSES = new Set([
   "partially_delivered",
@@ -224,6 +231,16 @@ export function getOrderBusinessPaymentStatus(order: OrderBusinessStatusInput) {
   )
 }
 
+export function isPendingUnpaidOrder(order: OrderBusinessStatusInput) {
+  if (order.status !== "pending") {
+    return false
+  }
+
+  return PENDING_UNPAID_PAYMENT_STATUSES.has(
+    getOrderBusinessPaymentStatus(order) ?? ""
+  )
+}
+
 function hasPaidPaymentSignal(order: OrderBusinessStatusInput) {
   const paymentStatus = order.payment_status
 

apps/medusa-be/tests/unit/src/utils/order-business-status.unit.spec.ts

@@ -1,6 +1,7 @@
 import { describe, expect, it } from "vitest"
 import {
   getOrderBusinessManualStatusUpdateBlockReason,
+  isPendingUnpaidOrder,
   isManualOrderBusinessStatusId,
   ORDER_BUSINESS_STATUS_METADATA_KEY,
   ORDER_BUSINESS_STATUSES,
@@ -116,6 +117,55 @@ describe("order business status", () => {
     ).not.toBe("paid")
   })
 
+  it.each([
+    {
+      name: "there are no payment collections",
+      overrides: { payment_collections: [] },
+    },
+    {
+      name: "payment requires action",
+      overrides: { payment_status: "requires_action" },
+    },
+    {
+      name: "payment is only authorized",
+      overrides: { payment_status: "authorized" },
+    },
+    {
+      name: "payment is partially authorized",
+      overrides: { payment_status: "partially_authorized" },
+    },
+  ] satisfies {
+    name: string
+    overrides: Partial<OrderBusinessStatusInput>
+  }[])("counts pending unpaid orders when $name", ({ overrides }) => {
+    expect(isPendingUnpaidOrder(createOrder({ status: "pending", ...overrides })))
+      .toBe(true)
+  })
+
+  it.each([
+    {
+      name: "the order is not pending",
+      overrides: { payment_status: "authorized", status: "completed" },
+    },
+    {
+      name: "payment is captured",
+      overrides: { payment_status: "captured", status: "pending" },
+    },
+    {
+      name: "payment is completed",
+      overrides: { payment_status: "completed", status: "pending" },
+    },
+    {
+      name: "payment is partially captured",
+      overrides: { payment_status: "partially_captured", status: "pending" },
+    },
+  ] satisfies {
+    name: string
+    overrides: Partial<OrderBusinessStatusInput>
+  }[])("does not count pending unpaid orders when $name", ({ overrides }) => {
+    expect(isPendingUnpaidOrder(createOrder(overrides))).toBe(false)
+  })
+
   it("lets manual processing states override paid orders", () => {
     expect(
       resolveOrderBusinessStatus(

apps/medusa-order-dashboard-plugin/src/admin/routes/order-dashboard/i18n.ts

@@ -330,7 +330,8 @@ const englishOrderDashboardAdminI18n = {
     all: "All",
   },
   sidebar: {
-    actionRequiredOrders: "{{count}} action required orders",
+    actionRequiredOrders:
+      "{{count}} orders waiting for admin confirmation without captured payment",
   },
   statuses: {
     awaiting_payment: "Awaiting payment",

apps/medusa-order-dashboard-plugin/src/admin/routes/order-dashboard/page.tsx

@@ -699,13 +699,13 @@ const OrderDashboardPage = () => {
   const errorMessage = ordersQuery.error
     ? getErrorMessage(ordersQuery.error, t("toast.requestFailed"))
     : null
-  const actionRequiredCount = summaryQuery.data?.action_required_count ?? 0
+  const pendingUnpaidCount = summaryQuery.data?.pending_unpaid_count ?? 0
 
   useEffect(() => {
     setOrderDashboardSidebarBadgeCount(
-      summaryQuery.isLoading ? null : actionRequiredCount
+      summaryQuery.isLoading ? null : pendingUnpaidCount
     )
-  }, [actionRequiredCount, summaryQuery.isLoading])
+  }, [pendingUnpaidCount, summaryQuery.isLoading])
 
   useEffect(() => {
     if (selectedCount > 0) {

apps/medusa-order-dashboard-plugin/src/admin/routes/order-dashboard/types.ts

@@ -201,6 +201,7 @@ export type OrderDashboardOrdersResponse = {
 
 export type OrderDashboardSummaryResponse = {
   action_required_count: number
+  pending_unpaid_count: number
   scanned_count: number
   status_counts: Record<OrderDashboardBusinessStatusId, number>
   total_count: number

apps/medusa-order-dashboard-plugin/src/admin/sidebar-badge.ts

@@ -55,8 +55,10 @@ export function startOrderDashboardSidebarBadge() {
   )
 }
 
-export function setOrderDashboardSidebarBadgeCount(count: number | null) {
-  currentCount = count
+export function setOrderDashboardSidebarBadgeCount(
+  count: number | null | undefined
+) {
+  currentCount = normalizeOrderDashboardSidebarBadgeCount(count)
   renderOrderDashboardSidebarBadge(currentCount)
 }
 
@@ -73,7 +75,7 @@ async function refreshOrderDashboardSidebarBadge() {
     const summary = await sdk.client.fetch<OrderDashboardSummaryResponse>(
       "/admin/order-expedition/summary"
     )
-    setOrderDashboardSidebarBadgeCount(summary.action_required_count)
+    setOrderDashboardSidebarBadgeCount(summary.pending_unpaid_count)
   } catch {
     renderOrderDashboardSidebarBadge(currentCount)
   } finally {
@@ -88,14 +90,15 @@ function canRefreshOrderDashboardSidebarBadge() {
   )
 }
 
-function renderOrderDashboardSidebarBadge(count: number | null) {
+function renderOrderDashboardSidebarBadge(count: number | null | undefined) {
   if (typeof document === "undefined") {
     return
   }
 
   const link = getOrderDashboardSidebarLink()
+  const normalizedCount = normalizeOrderDashboardSidebarBadgeCount(count)
 
-  if (!link || count === null || count <= 0) {
+  if (!link || normalizedCount === null || normalizedCount <= 0) {
     removeOrderDashboardSidebarBadge()
     return
   }
@@ -124,8 +127,8 @@ function renderOrderDashboardSidebarBadge(count: number | null) {
     link.appendChild(badge)
   }
 
-  const countText = String(count)
-  const label = getOrderDashboardSidebarBadgeLabel(count)
+  const countText = String(normalizedCount)
+  const label = getOrderDashboardSidebarBadgeLabel(normalizedCount)
 
   if (badge.textContent !== countText) {
     badge.textContent = countText
@@ -140,6 +143,12 @@ function renderOrderDashboardSidebarBadge(count: number | null) {
   }
 }
 
+function normalizeOrderDashboardSidebarBadgeCount(
+  count: number | null | undefined
+) {
+  return typeof count === "number" && Number.isFinite(count) ? count : null
+}
+
 function removeOrderDashboardSidebarBadge() {
   document.getElementById(ORDER_DASHBOARD_SIDEBAR_BADGE_ID)?.remove()
 }