fix: qa returns

getlago · Feb 4, 2025 · 4e31c7b · 4e31c7b
1 parent c245f57
commit 4e31c7b
Showing 1 changed file with 30 additions and 24 deletions.
diff --git a/src/pages/PaymentDetails.tsx b/src/pages/PaymentDetails.tsx
@@ -1,6 +1,6 @@
 import { gql } from '@apollo/client'
-import { ReactNode } from 'react'
-import { generatePath, Link, useNavigate, useParams } from 'react-router-dom'
+import { ReactNode, useCallback } from 'react'
+import { generatePath, Link, useParams } from 'react-router-dom'
 
 import { ConditionalWrapper } from '~/components/ConditionalWrapper'
 import {
@@ -26,6 +26,8 @@ import {
 } from '~/core/constants/statusInvoiceMapping'
 import { intlFormatNumber } from '~/core/formats/intlFormatNumber'
 import {
+  CREATE_INVOICE_PAYMENT_ROUTE,
+  CREATE_PAYMENT_ROUTE,
   CUSTOMER_DETAILS_ROUTE,
   CUSTOMER_DETAILS_TAB_ROUTE,
   CUSTOMER_INVOICE_DETAILS_ROUTE,
@@ -43,6 +45,7 @@ import {
   useGetPaymentDetailsQuery,
 } from '~/generated/graphql'
 import { useInternationalization } from '~/hooks/core/useInternationalization'
+import { useLocationHistory } from '~/hooks/core/useLocationHistory'
 import { useOrganizationInfos } from '~/hooks/useOrganizationInfos'
 import { usePermissions } from '~/hooks/usePermissions'
 import { MenuPopper, PageHeader } from '~/styles'
@@ -148,9 +151,9 @@ const InfoLine = ({
 const PaymentDetails = () => {
   const { hasPermissions } = usePermissions()
   const { translate } = useInternationalization()
-  const navigate = useNavigate()
   const { timezone } = useOrganizationInfos()
   const { customerId, paymentId } = useParams()
+  const { goBack } = useLocationHistory()
 
   const { data = {}, loading } = useGetPaymentDetailsQuery({
     variables: {
@@ -160,31 +163,34 @@ const PaymentDetails = () => {
 
   const payment = data.payment
   const customer = payment?.customer
-  const payableInvoice = payment?.payable.__typename === 'Invoice' ? [payment.payable] : []
-  const requestPaymentInvoices =
-    payment?.payable.__typename === 'PaymentRequest' ? payment.payable.invoices : []
+  const payable = payment?.payable
+  const payableInvoice = payable?.__typename === 'Invoice' && [payable]
+  const requestPaymentInvoices = payable?.__typename === 'PaymentRequest' && payable?.invoices
   const invoices = payableInvoice || requestPaymentInvoices
 
+  const goToPreviousRoute = useCallback(
+    () =>
+      goBack(
+        !!customerId
+          ? generatePath(CUSTOMER_DETAILS_TAB_ROUTE, {
+              customerId: customerId as string,
+              tab: CustomerDetailsTabsOptions.payments,
+            })
+          : generatePath(INVOICES_TAB_ROUTE, {
+              tab: InvoiceListTabEnum.payments,
+            }),
+        {
+          exclude: [CREATE_PAYMENT_ROUTE, CREATE_INVOICE_PAYMENT_ROUTE],
+        },
+      ),
+    [customerId, goBack],
+  )
+
   return (
     <div>
       <PageHeader.Wrapper withSide>
         <PageHeader.Group>
-          <Button
-            icon="arrow-left"
-            variant="quaternary"
-            onClick={() =>
-              navigate(
-                !!customerId
-                  ? generatePath(CUSTOMER_DETAILS_TAB_ROUTE, {
-                      customerId: customerId as string,
-                      tab: CustomerDetailsTabsOptions.payments,
-                    })
-                  : generatePath(INVOICES_TAB_ROUTE, {
-                      tab: InvoiceListTabEnum.payments,
-                    }),
-              )
-            }
-          />
+          <Button icon="arrow-left" variant="quaternary" onClick={goToPreviousRoute} />
           {loading ? (
             <Skeleton variant="text" className="w-40" />
           ) : (
@@ -194,7 +200,7 @@ const PaymentDetails = () => {
               noWrap
               data-test="coupon-details-name"
             >
-              {payment?.reference ?? payment?.id}
+              {payment?.id}
             </Typography>
           )}
         </PageHeader.Group>
@@ -424,7 +430,7 @@ const PaymentDetails = () => {
             data={invoices}
             isLoading={loading}
             containerSize={{
-              default: 0,
+              default: 4,
             }}
             onRowActionLink={({ id }) =>
               generatePath(CUSTOMER_INVOICE_DETAILS_ROUTE, {