From 979f7704eeb20bc5d79bd5011d1a2b2d61928b93 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Frane=20Poli=C4=87?=
 <16856471+fPolic@users.noreply.github.com>
Date: Tue, 27 Aug 2024 08:53:13 +0200
Subject: [PATCH] fix(dashboard): summary section return fixes (#8770)

**What**
- open receive Return if only one exists
- fix double dashed divider

---

FIXES CC-287 CC-361
---
 .../order-summary-section.tsx                 | 51 ++++++++++++-------
 1 file changed, 32 insertions(+), 19 deletions(-)

diff --git a/packages/admin-next/dashboard/src/routes/orders/order-detail/components/order-summary-section/order-summary-section.tsx b/packages/admin-next/dashboard/src/routes/orders/order-detail/components/order-summary-section/order-summary-section.tsx
index abd26f1fe5..526c9cca94 100644
--- a/packages/admin-next/dashboard/src/routes/orders/order-detail/components/order-summary-section/order-summary-section.tsx
+++ b/packages/admin-next/dashboard/src/routes/orders/order-detail/components/order-summary-section/order-summary-section.tsx
@@ -168,26 +168,39 @@ export const OrderSummarySection = ({ order }: OrderSummarySectionProps) => {
       <Total order={order} />
 
       {(showAllocateButton || showReturns || showPayment || showRefund) && (
-        <div className="bg-ui-bg-subtle flex items-center justify-end rounded-b-xl px-4 py-4 gap-x-2">
-          {showReturns && (
-            <ButtonMenu
-              groups={[
-                {
-                  actions: returns.map((r) => ({
-                    label: t("orders.returns.receive.receive", {
-                      label: `#${r.id.slice(-7)}`,
-                    }),
-                    icon: <ArrowLongRight />,
-                    to: `/orders/${order.id}/returns/${r.id}/receive`,
-                  })),
-                },
-              ]}
-            >
-              <Button variant="secondary" size="small">
+        <div className="bg-ui-bg-subtle flex items-center justify-end gap-x-2 rounded-b-xl px-4 py-4">
+          {showReturns &&
+            (returns.length === 1 ? (
+              <Button
+                onClick={() =>
+                  navigate(
+                    `/orders/${order.id}/returns/${returns[0].id}/receive`
+                  )
+                }
+                variant="secondary"
+                size="small"
+              >
                 {t("orders.returns.receive.action")}
               </Button>
-            </ButtonMenu>
-          )}
+            ) : (
+              <ButtonMenu
+                groups={[
+                  {
+                    actions: returns.map((r) => ({
+                      label: t("orders.returns.receive.receive", {
+                        label: `#${r.id.slice(-7)}`,
+                      }),
+                      icon: <ArrowLongRight />,
+                      to: `/orders/${order.id}/returns/${r.id}/receive`,
+                    })),
+                  },
+                ]}
+              >
+                <Button variant="secondary" size="small">
+                  {t("orders.returns.receive.action")}
+                </Button>
+              </ButtonMenu>
+            ))}
 
           {showAllocateButton && (
             <Button
@@ -550,7 +563,7 @@ const ReturnBreakdown = ({
     item && (
       <div
         key={orderReturn.id}
-        className="txt-compact-small-plus text-ui-fg-subtle bg-ui-bg-subtle flex flex-row justify-between gap-y-2 border-b-2 border-t-2 border-dotted px-6 py-4"
+        className="txt-compact-small-plus text-ui-fg-subtle bg-ui-bg-subtle flex flex-row justify-between gap-y-2 border-t-2 border-dotted px-6 py-4"
       >
         <div className="flex items-center gap-2">
           <ArrowDownRightMini className="text-ui-fg-muted" />