fix(admin-ui): Hide create fulfilment button when nothing left to ful…

…fil (#3515)

Previously, if an order had two fulfilments that fully satisfied the order, then only one was shipped, the status would change to `partially_shipped` and show the "Create Fulfillment" button again, which would open a buggy modal with no items to fulfil. Added another check that looks at the items in the order and compares `quantity` and `fulfilled_quantity`, so that we can hide the button based on this as well, rather than just the order's `fulfillment_status`, which can be misleading.

Also added a status icon to the Fulfillment card's title bar for the `partially_shipped` status, as this area was blank before in that state.

Resolves CORE-1262

packages/admin-ui/ui/src/domain/orders/details/index.tsx

@@ -1,4 +1,10 @@
-import { Address, ClaimOrder, Fulfillment, Swap } from "@medusajs/medusa"
+import {
+  Address,
+  ClaimOrder,
+  Fulfillment,
+  LineItem,
+  Swap,
+} from "@medusajs/medusa"
 import {
   DisplayTotal,
   FormattedAddress,
@@ -261,6 +267,10 @@ const OrderDetails = () => {
     navigate("/404")
   }
 
+  const anyItemsToFulfil = order.items.some(
+    (item: LineItem) => item.quantity > (item.fulfilled_quantity ?? 0)
+  )
+
   return (
     <div>
       <OrderEditProvider orderId={id!}>
@@ -415,9 +425,8 @@ const OrderDetails = () => {
                     />
                   }
                   customActionable={
-                    order.fulfillment_status !== "fulfilled" &&
                     order.status !== "canceled" &&
-                    order.fulfillment_status !== "shipped" && (
+                    anyItemsToFulfil && (
                       <Button
                         variant="secondary"
                         size="small"

packages/admin-ui/ui/src/domain/orders/details/templates/fulfillment-status.tsx

@@ -14,6 +14,8 @@ export const FulfillmentStatusComponent = ({ status }) => {
       return <StatusDot title="Requires Action" variant="danger" />
     case "not_fulfilled":
       return <StatusDot title="Awaiting fulfillment" variant="danger" />
+    case "partially_shipped":
+      return <StatusDot title="Partially Shipped" variant="warning" />
     default:
       return null
   }