feat: setting up the date format in the whole system dates

2026-02-17 05:10:31 +00:00 · 2024-06-12 19:43:42 +02:00
parent 265ea9ca48
commit 3a0a0db8a7
24 changed files with 62 additions and 52 deletions
--- a/packages/server/src/api/controllers/Dashboard/index.ts
+++ b/packages/server/src/api/controllers/Dashboard/index.ts
@@ -5,7 +5,7 @@ import DashboardService from '@/services/Dashboard/DashboardService';
@Service()
 export default class DashboardMetaController {
  @Inject()
-  dashboardService: DashboardService;
+  private dashboardService: DashboardService;

  /**
   * Constructor router.
--- a/packages/server/src/lib/Transformer/Transformer.ts
+++ b/packages/server/src/lib/Transformer/Transformer.ts
@@ -149,13 +149,19 @@ export class Transformer {
    return this.excludeAttributes().length > 0;
  };

+  private dateFormat = 'YYYY MMM DD';
+
+  setDateFormat(format: string) {
+    this.dateFormat = format;
+  }
+
  /**
   *
   * @param date
   * @returns
   */
  protected formatDate(date) {
-    return date ? moment(date).format('YYYY/MM/DD') : '';
+    return date ? moment(date).format(this.dateFormat) : '';
  }

  /**
@@ -193,6 +199,7 @@ export class Transformer {
  ) {
    transformer.setOptions(options);
    transformer.setContext(this.context);
+    transformer.setDateFormat(this.dateFormat);

    return transformer.work(obj);
  }
--- a/packages/server/src/lib/Transformer/TransformerInjectable.ts
+++ b/packages/server/src/lib/Transformer/TransformerInjectable.ts
@@ -24,6 +24,17 @@ export class TransformerInjectable {
    };
  }

+  /**
+   * Retrieves the given tenatn date format.
+   * @param {number} tenantId
+   * @returns {string}
+   */
+  async getTenantDateFormat(tenantId: number) {
+    const metadata = await TenantMetadata.query().findOne('tenantId', tenantId);
+
+    return metadata.dateFormat;
+  }
+
  /**
   * Transformes the given transformer after inject the tenant context.
   * @param   {number} tenantId
@@ -41,7 +52,11 @@ export class TransformerInjectable {
    if (!isNull(tenantId)) {
      const context = await this.getApplicationContext(tenantId);
      transformer.setContext(context);
+
+      const dateFormat = await this.getTenantDateFormat(tenantId);
+      transformer.setDateFormat(dateFormat);
    }
+
    transformer.setOptions(options);

    return transformer.work(object);
--- a/packages/server/src/services/Purchases/BillPayments/BillPaymentEntryTransformer.ts
+++ b/packages/server/src/services/Purchases/BillPayments/BillPaymentEntryTransformer.ts
@@ -1,5 +1,6 @@
 import { Transformer } from '@/lib/Transformer/Transformer';
 import { formatNumber } from '@/utils';
+import { PurchaseInvoiceTransformer } from '../Bills/PurchaseInvoiceTransformer';

 export class BillPaymentEntryTransformer extends Transformer {
  /**
@@ -7,7 +8,14 @@ export class BillPaymentEntryTransformer extends Transformer {
   * @returns {Array}
   */
  public includeAttributes = (): string[] => {
-    return ['paymentAmountFormatted'];
+    return ['paymentAmountFormatted', 'bill'];
+  };
+
+  /**
+   * Retreives the
+   */
+  protected bill = (entry) => {
+    return this.item(entry.bill, new PurchaseInvoiceTransformer());
  };

  /**
--- a/packages/webapp/src/containers/Accounting/JournalsLanding/utils.tsx
+++ b/packages/webapp/src/containers/Accounting/JournalsLanding/utils.tsx
@@ -16,8 +16,7 @@ export const useManualJournalsColumns = () => {
      {
        id: 'date',
        Header: intl.get('date'),
-        accessor: 'date',
-        Cell: FormatDateCell,
+        accessor: 'formatted_date',
        width: 115,
        className: 'date',
        clickable: true,
--- a/packages/webapp/src/containers/Drawers/BillDrawer/BillDetailHeader.tsx
+++ b/packages/webapp/src/containers/Drawers/BillDrawer/BillDetailHeader.tsx
@@ -41,19 +41,23 @@ export default function BillDetailHeader() {
        <Col xs={6}>
          <DetailsMenu direction={'horizantal'} minLabelSize={'180px'}>
            <DetailItem label={intl.get('bill_date')}>
-              <FormatDate value={bill.bill_date} />
+              {bill.formatted_bill_date}
            </DetailItem>
+
            <DetailItem label={intl.get('due_date')}>
-              <FormatDate value={bill.due_date} />
+              {bill.formatted_due_date}
            </DetailItem>
+
            <DetailItem label={intl.get('vendor_name')}>
              <VendorDrawerLink vendorId={bill.vendor_id}>
                {bill.vendor?.display_name}
              </VendorDrawerLink>
            </DetailItem>
+
            <DetailItem label={intl.get('bill.details.bill_number')}>
              {defaultTo(bill.bill_number, '-')}
            </DetailItem>
+
            <ExchangeRateDetailItem
              exchangeRate={bill?.exchange_rate}
              toCurrency={bill?.currency_code}
--- a/packages/webapp/src/containers/Drawers/CreditNoteDetailDrawer/CreditNoteDetailHeader.tsx
+++ b/packages/webapp/src/containers/Drawers/CreditNoteDetailDrawer/CreditNoteDetailHeader.tsx
@@ -47,7 +47,7 @@ export default function CreditNoteDetailHeader() {
            <DetailItem
              label={intl.get('credit_note.drawer.label_credit_note_date')}
            >
-              <FormatDate value={creditNote.formatted_credit_note_date} />
+              {creditNote.formatted_credit_note_date}
            </DetailItem>

            <DetailItem
--- a/packages/webapp/src/containers/Drawers/ExpenseDrawer/ExpenseDrawerHeader.tsx
+++ b/packages/webapp/src/containers/Drawers/ExpenseDrawer/ExpenseDrawerHeader.tsx
@@ -1,6 +1,5 @@
 // @ts-nocheck
 import React from 'react';
-import moment from 'moment';
 import styled from 'styled-components';
 import { defaultTo } from 'lodash';

@@ -42,7 +41,7 @@ export default function ExpenseDrawerHeader() {
        <Col xs={6}>
          <DetailsMenu direction={'horizantal'} minLabelSize={'180px'}>
            <DetailItem name={'date'} label={<T id={'date'} />}>
-              {moment(expense.payment_date).format('YYYY MMM DD')}
+              {expense.formatted_payment_date}
            </DetailItem>

            <DetailItem name={'reference'} label={<T id={'reference_no'} />}>
--- a/packages/webapp/src/containers/Drawers/InvoiceDetailDrawer/InvoiceDetailHeader.tsx
+++ b/packages/webapp/src/containers/Drawers/InvoiceDetailDrawer/InvoiceDetailHeader.tsx
@@ -43,11 +43,11 @@ export default function InvoiceDetailHeader() {
        <Col xs={6}>
          <DetailsMenu direction={'horizantal'} minLabelSize={'180px'}>
            <DetailItem label={intl.get('invoice_date')}>
-              <FormatDate value={invoice.invoice_date} />
+              {invoice.invoice_date_formatted}
            </DetailItem>

            <DetailItem label={intl.get('due_date')}>
-              <FormatDate value={invoice.due_date} />
+              {invoice.due_date_formatted}
            </DetailItem>

            <DetailItem label={intl.get('customer_name')}>
--- a/packages/webapp/src/containers/Drawers/PaymentMadeDetailDrawer/PaymentMadeDetailHeader.tsx
+++ b/packages/webapp/src/containers/Drawers/PaymentMadeDetailDrawer/PaymentMadeDetailHeader.tsx
@@ -37,7 +37,7 @@ export default function PaymentMadeDetailHeader() {
          <DetailsMenu direction={'horizantal'} minLabelSize={'180px'}>
            <DetailItem
              label={intl.get('payment_date')}
-              children={<FormatDate value={paymentMade.payment_date} />}
+              children={paymentMade.formatted_payment_date}
            />
            <DetailItem
              label={intl.get('payment_made.details.payment_number')}
--- a/packages/webapp/src/containers/Drawers/PaymentMadeDetailDrawer/utils.tsx
+++ b/packages/webapp/src/containers/Drawers/PaymentMadeDetailDrawer/utils.tsx
@@ -1,8 +1,6 @@
 // @ts-nocheck
 import React from 'react';
 import intl from 'react-intl-universal';
-import moment from 'moment';
-
 import { getColumnWidth } from '@/utils';
 import { FormatNumberCell } from '@/components';
 import { usePaymentMadeDetailContext } from './PaymentMadeDetailProvider';
@@ -17,7 +15,7 @@ export const usePaymentMadeEntriesColumns = () => {
    () => [
      {
        Header: intl.get('date'),
-        accessor: (row) => moment(row.date).format('YYYY MMM DD'),
+        accessor: 'bill.formatted_bill_date',
        width: 100,
        disableSortBy: true,
        className: 'date',
--- a/packages/webapp/src/containers/Drawers/PaymentReceiveDetailDrawer/PaymentReceiveDetailHeader.tsx
+++ b/packages/webapp/src/containers/Drawers/PaymentReceiveDetailDrawer/PaymentReceiveDetailHeader.tsx
@@ -36,7 +36,7 @@ export default function PaymentReceiveDetailHeader() {
          <DetailsMenu direction={'horizantal'} minLabelSize={'180px'}>
            <DetailItem
              label={intl.get('payment_date')}
-              children={<FormatDate value={paymentReceive.payment_date} />}
+              children={paymentReceive.formatted_payment_date}
            />
            <DetailItem
              label={intl.get('payment_receive.details.payment_number')}
--- a/packages/webapp/src/containers/Drawers/PaymentReceiveDetailDrawer/utils.tsx
+++ b/packages/webapp/src/containers/Drawers/PaymentReceiveDetailDrawer/utils.tsx
@@ -1,7 +1,6 @@
 // @ts-nocheck
 import React from 'react';
 import intl from 'react-intl-universal';
-import moment from 'moment';
 import {
  Button,
  Popover,
@@ -26,7 +25,7 @@ export const usePaymentReceiveEntriesColumns = () => {
    () => [
      {
        Header: intl.get('date'),
-        accessor: (row) => moment(row.payment_date).format('YYYY MMM DD'),
+        accessor: 'invoice.invoice_date_formatted',
        width: 100,
        className: 'date',
        disableSortBy: true,
--- a/packages/webapp/src/containers/Drawers/ReceiptDetailDrawer/ReceiptDetailHeader.tsx
+++ b/packages/webapp/src/containers/Drawers/ReceiptDetailDrawer/ReceiptDetailHeader.tsx
@@ -54,11 +54,11 @@ export default function ReceiptDetailHeader() {
            </DetailItem>
            <DetailItem
              label={intl.get('receipt_date')}
-              children={<FormatDate value={receipt.receipt_date} />}
+              children={receipt.formatted_receipt_date}
            />
            <DetailItem
              label={intl.get('closed_date')}
-              children={<FormatDate value={receipt.closed_at_date} />}
+              children={receipt.formatted_closed_at_date}
            />
            <ExchangeRateDetailItem
              exchangeRate={receipt?.exchange_rate}
--- a/packages/webapp/src/containers/Drawers/VendorCreditDetailDrawer/VendorCreditDetailHeader.tsx
+++ b/packages/webapp/src/containers/Drawers/VendorCreditDetailDrawer/VendorCreditDetailHeader.tsx
@@ -42,7 +42,7 @@ export default function VendorCreditDetailHeader() {
            <DetailItem
              label={intl.get('vendor_credit.drawer.label_vendor_credit_date')}
            >
-              <FormatDate value={vendorCredit.formatted_vendor_credit_date} />
+              {vendorCredit.formatted_vendor_credit_date}
            </DetailItem>
            <DetailItem
              label={intl.get('vendor_credit.drawer.label_vendor_credit_no')}
--- a/packages/webapp/src/containers/JournalEntriesTable/utils.tsx
+++ b/packages/webapp/src/containers/JournalEntriesTable/utils.tsx
@@ -1,16 +1,13 @@
 // @ts-nocheck
 import React from 'react';
 import intl from 'react-intl-universal';
-import moment from 'moment';
-

 export const useGLEntriesTableColumns = () => {
  return React.useMemo(
    () => [
      {
        Header: intl.get('date'),
-        accessor: ({ formatted_date }) =>
-          moment(formatted_date).format('YYYY MMM DD'),
+        accessor: 'date.formatted_date',
        width: 140,
        className: 'date',
        textOverview: true,
--- a/packages/webapp/src/containers/Purchases/Bills/BillsLanding/components.tsx
+++ b/packages/webapp/src/containers/Purchases/Bills/BillsLanding/components.tsx
@@ -161,8 +161,7 @@ export function useBillsTableColumns() {
      {
        id: 'bill_date',
        Header: intl.get('bill_date'),
-        accessor: 'bill_date',
-        Cell: FormatDateCell,
+        accessor: 'formatted_bill_date',
        width: 110,
        className: 'bill_date',
        clickable: true,
--- a/packages/webapp/src/containers/Purchases/CreditNotes/CreditNotesLanding/components.tsx
+++ b/packages/webapp/src/containers/Purchases/CreditNotes/CreditNotesLanding/components.tsx
@@ -5,14 +5,7 @@ import clsx from 'classnames';
 import { Intent, Tag, Menu, MenuItem, MenuDivider } from '@blueprintjs/core';

 import { CLASSES } from '@/constants/classes';
-import {
-  FormatDateCell,
-  FormattedMessage as T,
-  Choose,
-  If,
-  Icon,
-  Can,
-} from '@/components';
+import { FormattedMessage as T, Choose, If, Icon, Can } from '@/components';
 import { safeCallback } from '@/utils';
 import { VendorCreditAction, AbilitySubject } from '@/constants/abilityOption';

@@ -119,7 +112,6 @@ export function useVendorsCreditNoteTableColumns() {
        id: 'credit_date',
        Header: intl.get('date'),
        accessor: 'formatted_vendor_credit_date',
-        Cell: FormatDateCell,
        width: 110,
        className: 'credit_date',
        clickable: true,
--- a/packages/webapp/src/containers/Purchases/PaymentMades/PaymentsLanding/components.tsx
+++ b/packages/webapp/src/containers/Purchases/PaymentMades/PaymentsLanding/components.tsx
@@ -11,7 +11,7 @@ import {
  Position,
 } from '@blueprintjs/core';

-import { Icon, Money, FormatDateCell, Can } from '@/components';
+import { Icon, Money, Can } from '@/components';
 import { PaymentMadeAction, AbilitySubject } from '@/constants/abilityOption';

 import { safeCallback } from '@/utils';
@@ -29,7 +29,7 @@ export function ActionsMenu({
 }) {
  return (
    <Menu>
-      <MenuItem
+    <MenuItem
        icon={<Icon icon="reader-18" />}
        text={intl.get('view_details')}
        onClick={safeCallback(onViewDetails, original)}
@@ -79,8 +79,7 @@ export function usePaymentMadesTableColumns() {
      {
        id: 'payment_date',
        Header: intl.get('payment_date'),
-        Cell: FormatDateCell,
-        accessor: 'payment_date',
+        accessor: 'formatted_payment_date',
        width: 140,
        className: 'payment_date',
        clickable: true,
--- a/packages/webapp/src/containers/Sales/CreditNotes/CreditNotesLanding/components.tsx
+++ b/packages/webapp/src/containers/Sales/CreditNotes/CreditNotesLanding/components.tsx
@@ -5,7 +5,6 @@ import clsx from 'classnames';
 import { Intent, Tag, Menu, MenuItem, MenuDivider } from '@blueprintjs/core';
 import { CLASSES } from '@/constants/classes';
 import {
-  FormatDateCell,
  FormattedMessage as T,
  Choose,
  If,
@@ -112,7 +111,6 @@ export function useCreditNoteTableColumns() {
        id: 'credit_date',
        Header: intl.get('credit_note.column.credit_date'),
        accessor: 'formatted_credit_note_date',
-        Cell: FormatDateCell,
        width: 110,
        className: 'credit_date',
        clickable: true,
--- a/packages/webapp/src/containers/Sales/Estimates/EstimatesLanding/components.tsx
+++ b/packages/webapp/src/containers/Sales/Estimates/EstimatesLanding/components.tsx
@@ -164,8 +164,7 @@ export function useEstiamtesTableColumns() {
      {
        id: 'estimate_date',
        Header: intl.get('estimate_date'),
-        accessor: 'estimate_date',
-        Cell: FormatDateCell,
+        accessor: 'formatted_estimate_date',
        width: 140,
        className: 'estimate_date',
        clickable: true,
--- a/packages/webapp/src/containers/Sales/Invoices/InvoicesLanding/components.tsx
+++ b/packages/webapp/src/containers/Sales/Invoices/InvoicesLanding/components.tsx
@@ -128,7 +128,7 @@ export function ActionsMenu({
    onQuick,
    onViewDetails,
    onPrint,
-    onSendMail
+    onSendMail,
  },
  row: { original },
 }) {
@@ -202,8 +202,7 @@ export function useInvoicesTableColumns() {
      {
        id: 'invoice_date',
        Header: intl.get('invoice_date'),
-        accessor: 'invoice_date',
-        Cell: FormatDateCell,
+        accessor: 'invoice_date_formatted',
        width: 110,
        className: 'invoice_date',
        clickable: true,
--- a/packages/webapp/src/containers/Sales/PaymentReceives/PaymentsLanding/components.tsx
+++ b/packages/webapp/src/containers/Sales/PaymentReceives/PaymentsLanding/components.tsx
@@ -90,8 +90,7 @@ export function usePaymentReceivesColumns() {
      {
        id: 'payment_date',
        Header: intl.get('payment_date'),
-        accessor: 'payment_date',
-        Cell: FormatDateCell,
+        accessor: 'formatted_payment_date',
        width: 140,
        className: 'payment_date',
        clickable: true,
--- a/packages/webapp/src/containers/Sales/Receipts/ReceiptsLanding/components.tsx
+++ b/packages/webapp/src/containers/Sales/Receipts/ReceiptsLanding/components.tsx
@@ -119,8 +119,7 @@ export function useReceiptsTableColumns() {
      {
        id: 'receipt_date',
        Header: intl.get('receipt_date'),
-        accessor: 'receipt_date',
-        Cell: FormatDateCell,
+        accessor: 'formatted_receipt_date',
        width: 140,
        className: 'receipt_date',
        clickable: true,