diff --git a/src/components/customers/CustomerInvoicesList.tsx b/src/components/customers/CustomerInvoicesList.tsx index 3df112dce..ac8d03410 100644 --- a/src/components/customers/CustomerInvoicesList.tsx +++ b/src/components/customers/CustomerInvoicesList.tsx @@ -3,7 +3,7 @@ import { FC, useRef } from 'react' import { generatePath, useNavigate } from 'react-router-dom' import styled from 'styled-components' -import { InfiniteScroll, Status, Table, Tooltip, Typography } from '~/components/designSystem' +import { Chip, InfiniteScroll, Status, Table, Tooltip, Typography } from '~/components/designSystem' import { addToast, hasDefinedGQLError } from '~/core/apolloClient' import { invoiceStatusMapping, paymentStatusMapping } from '~/core/constants/statusInvoiceMapping' import { intlFormatNumber } from '~/core/formats/intlFormatNumber' @@ -236,7 +236,7 @@ export const CustomerInvoicesList: FC = ({ key: 'paymentStatus', minWidth: 120, title: translate('text_63b5d225b075850e0fe489f4'), - content: ({ status, paymentStatus, paymentOverdue, paymentDisputeLostAt }) => { + content: ({ status, paymentStatus, paymentDisputeLostAt }) => { if (status !== InvoiceStatusTypeEnum.Finalized) { return null } @@ -254,7 +254,6 @@ export const CustomerInvoicesList: FC = ({ {...paymentStatusMapping({ status, paymentStatus, - paymentOverdue, })} endIcon={!!paymentDisputeLostAt ? 'warning-unfilled' : undefined} /> @@ -263,6 +262,16 @@ export const CustomerInvoicesList: FC = ({ }, } : null, + context === 'finalized' + ? { + key: 'paymentOverdue', + title: translate('text_666c5b12fea4aa1e1b26bf55'), + content: ({ paymentOverdue }) => + paymentOverdue && ( + + ), + } + : null, { key: 'issuingDate', minWidth: 104, diff --git a/src/components/invoices/InvoicesList.tsx b/src/components/invoices/InvoicesList.tsx index 96c1da2a7..c49a7970f 100644 --- a/src/components/invoices/InvoicesList.tsx +++ b/src/components/invoices/InvoicesList.tsx @@ -3,6 +3,7 @@ import { useEffect, useRef } from 'react' import { generatePath, useNavigate, useSearchParams } from 'react-router-dom' import { + Chip, InfiniteScroll, QuickFilters, Status, @@ -305,7 +306,7 @@ const InvoicesList = ({ key: 'paymentStatus', title: translate('text_6419c64eace749372fc72b40'), minWidth: 80, - content: ({ status, paymentStatus, paymentOverdue, paymentDisputeLostAt }) => { + content: ({ status, paymentStatus, paymentDisputeLostAt }) => { if (status !== InvoiceStatusTypeEnum.Finalized) { return null } @@ -323,7 +324,6 @@ const InvoicesList = ({ {...paymentStatusMapping({ status, paymentStatus, - paymentOverdue, })} endIcon={!!paymentDisputeLostAt ? 'warning-unfilled' : undefined} /> @@ -331,6 +331,14 @@ const InvoicesList = ({ ) }, }, + { + key: 'paymentOverdue', + title: translate('text_666c5b12fea4aa1e1b26bf55'), + content: ({ paymentOverdue }) => + paymentOverdue && ( + + ), + }, { key: 'customer.name', title: translate('text_65201c5a175a4b0238abf29a'), diff --git a/src/core/constants/statusInvoiceMapping.ts b/src/core/constants/statusInvoiceMapping.ts index cfcb49432..5a26b2f2f 100644 --- a/src/core/constants/statusInvoiceMapping.ts +++ b/src/core/constants/statusInvoiceMapping.ts @@ -23,16 +23,10 @@ export const invoiceStatusMapping = ({ export const paymentStatusMapping = ({ status, paymentStatus, - paymentOverdue, }: { status: InvoiceStatusTypeEnum paymentStatus: InvoicePaymentStatusTypeEnum - paymentOverdue?: boolean }): StatusProps => { - if (paymentOverdue) { - return { label: 'overdue', type: StatusType.danger } - } - if (status === InvoiceStatusTypeEnum.Finalized) { switch (paymentStatus) { case InvoicePaymentStatusTypeEnum.Pending: