From 5e5f628d87a78962978fe105f4c5ef41b1b4f57c Mon Sep 17 00:00:00 2001
From: docloulou <lucas.zerbib@gmail.com>
Date: Fri, 12 Sep 2025 20:15:43 +0200
Subject: [PATCH] feat(dashboard): update display of tracking/label URLs on
 order details (#11613)

### Overview

This PR updates the fulfillment label rendering by replacing the deprecated .url field with the new tracking_url and label_url fields, following the MedusaJS FulfillmentLabel model.

### Changes

- Implemented conditional rendering for both tracking_url and label_url.
- If a tracking_url exists, it is displayed as a clickable link.
- Similarly, if a label_url exists, it is displayed as a clickable link.
- If neither link is provided, only the tracking number is shown.
- Maintained existing styling for interactive elements.

![image](https://github.com/user-attachments/assets/187bd8d5-d6c2-4f06-8f61-f9bb7d02da11)

### Reference

This update is based on the MedusaJS FulfillmentLabel model:
https://docs.medusajs.com/resources/references/fulfillment/models/FulfillmentLabel

Please review the changes and provide feedback for further improvements.


Co-authored-by: William Bouchard <46496014+willbouch@users.noreply.github.com>
---
 .changeset/pink-humans-thank.md               |  5 +++
 .../order-fulfillment-section.tsx             | 43 +++++++++++++------
 2 files changed, 35 insertions(+), 13 deletions(-)
 create mode 100644 .changeset/pink-humans-thank.md

diff --git a/.changeset/pink-humans-thank.md b/.changeset/pink-humans-thank.md
new file mode 100644
index 0000000000..23ef3195d2
--- /dev/null
+++ b/.changeset/pink-humans-thank.md
@@ -0,0 +1,5 @@
+---
+"@medusajs/dashboard": patch
+---
+
+feat(dashboard): update display of tracking/label URLs on order details
diff --git a/packages/admin/dashboard/src/routes/orders/order-detail/components/order-fulfillment-section/order-fulfillment-section.tsx b/packages/admin/dashboard/src/routes/orders/order-detail/components/order-fulfillment-section/order-fulfillment-section.tsx
index 98836a30dd..82a8182e7e 100644
--- a/packages/admin/dashboard/src/routes/orders/order-detail/components/order-fulfillment-section/order-fulfillment-section.tsx
+++ b/packages/admin/dashboard/src/routes/orders/order-detail/components/order-fulfillment-section/order-fulfillment-section.tsx
@@ -320,6 +320,8 @@ const Fulfillment = ({
     throw error
   }
 
+  const isValidUrl = (url?: string) => url && url.length > 0 && url !== "#"
+
   return (
     <Container className="divide-y p-0">
       <div className="flex items-center justify-between px-6 py-4">
@@ -408,22 +410,37 @@ const Fulfillment = ({
           {fulfillment.labels && fulfillment.labels.length > 0 ? (
             <ul>
               {fulfillment.labels.map((tlink) => {
-                const hasUrl =
-                  tlink.url && tlink.url.length > 0 && tlink.url !== "#"
+                const hasTrackingUrl = isValidUrl(tlink.tracking_url)
+                const hasLabelUrl = isValidUrl(tlink.label_url)
 
-                if (hasUrl) {
+                if (hasTrackingUrl || hasLabelUrl) {
                   return (
                     <li key={tlink.tracking_number}>
-                      <a
-                        href={tlink.url}
-                        target="_blank"
-                        rel="noopener noreferrer"
-                        className="text-ui-fg-interactive hover:text-ui-fg-interactive-hover transition-fg"
-                      >
-                        <Text size="small" leading="compact">
-                          {tlink.tracking_number}
-                        </Text>
-                      </a>
+                      {hasTrackingUrl && (
+                        <a
+                          href={tlink.tracking_url}
+                          target="_blank"
+                          rel="noopener noreferrer"
+                          className="text-ui-fg-interactive hover:text-ui-fg-interactive-hover transition-fg"
+                        >
+                          <Text size="small" leading="compact" as="span">
+                            {tlink.tracking_number}
+                          </Text>
+                        </a>
+                      )}
+                      {hasTrackingUrl && hasLabelUrl && " - "}
+                      {hasLabelUrl && (
+                        <a
+                          href={tlink.label_url}
+                          target="_blank"
+                          rel="noopener noreferrer"
+                          className="text-ui-fg-interactive hover:text-ui-fg-interactive-hover transition-fg"
+                        >
+                          <Text size="small" leading="compact" as="span">
+                            Label
+                          </Text>
+                        </a>
+                      )}
                     </li>
                   )
                 }