WIP: Arabic localization.|

client/src/containers/Accounting/MakeJournal/MakeJournalEntries.schema.js

@@ -1,5 +1,5 @@
 import * as Yup from 'yup';
-import { formatMessage } from 'services/intl';
+import intl from 'react-intl-universal';
 import { DATATYPES_LENGTH } from 'common/dataTypes';
 
 const Schema = Yup.object().shape({
@@ -7,15 +7,15 @@ const Schema = Yup.object().shape({
     .required()
     .min(1)
     .max(DATATYPES_LENGTH.STRING)
-    .label(formatMessage({ id: 'journal_number_' })),
+    .label(intl.get('journal_number_')),
   journal_type: Yup.string()
     .required()
     .min(1)
     .max(DATATYPES_LENGTH.STRING)
-    .label(formatMessage({ id: 'journal_type' })),
+    .label(intl.get('journal_type')),
   date: Yup.date()
     .required()
-    .label(formatMessage({ id: 'date' })),
+    .label(intl.get('date')),
   currency_code: Yup.string().max(3),
   publish: Yup.boolean(),
   reference: Yup.string().nullable().min(1).max(DATATYPES_LENGTH.STRING),

client/src/containers/Accounting/MakeJournal/MakeJournalEntriesFooter.js

@@ -9,7 +9,7 @@ import {
   Menu,
   MenuItem,
 } from '@blueprintjs/core';
-import { FormattedMessage as T } from 'react-intl';
+import { FormattedMessage as T } from 'components';
 import { useFormikContext } from 'formik';
 import { CLASSES } from 'common/classes';
 import classNames from 'classnames';

client/src/containers/Accounting/MakeJournal/MakeJournalEntriesForm.js

@@ -1,7 +1,7 @@
 import React, { useMemo } from 'react';
 import { Formik, Form } from 'formik';
 import { Intent } from '@blueprintjs/core';
-import { useIntl } from 'react-intl';
+import intl from 'react-intl-universal';
 import { defaultTo, isEmpty, omit } from 'lodash';
 import classNames from 'classnames';
 import { useHistory } from 'react-router-dom';
@@ -48,7 +48,6 @@ function MakeJournalEntriesForm({
     submitPayload,
   } = useMakeJournalFormContext();
 
-  const { formatMessage } = useIntl();
   const history = useHistory();
 
   // New journal number.
@@ -92,18 +91,14 @@ function MakeJournalEntriesForm({
     // Validate the total credit should be eqials total debit.
     if (totalCredit !== totalDebit) {
       AppToaster.show({
-        message: formatMessage({
-          id: 'should_total_of_credit_and_debit_be_equal',
-        }),
+        message: intl.get('should_total_of_credit_and_debit_be_equal'),
         intent: Intent.DANGER,
       });
       setSubmitting(false);
       return;
     } else if (totalCredit === 0 || totalDebit === 0) {
       AppToaster.show({
-        message: formatMessage({
-          id: 'amount_cannot_be_zero_or_empty',
-        }),
+        message: intl.get('amount_cannot_be_zero_or_empty'),
         intent: Intent.DANGER,
       });
       setSubmitting(false);
@@ -131,12 +126,10 @@ function MakeJournalEntriesForm({
     // Handle the request success.
     const handleSuccess = (errors) => {
       AppToaster.show({
-        message: formatMessage(
-          {
-            id: isNewMode
-              ? 'the_journal_has_been_created_successfully'
-              : 'the_journal_has_been_edited_successfully',
-          },
+        message: intl.get(
+          isNewMode
+            ? 'the_journal_has_been_created_successfully'
+            : 'the_journal_has_been_edited_successfully',
           { number: values.journal_number },
         ),
         intent: Intent.SUCCESS,

client/src/containers/Accounting/MakeJournal/MakeJournalEntriesHeader.js

@@ -2,7 +2,7 @@ import React from 'react';
 import classNames from 'classnames';
 import { useFormikContext } from 'formik';
 import { CLASSES } from 'common/classes';
-import { FormattedMessage as T } from 'react-intl';
+import { FormattedMessage as T } from 'components';
 import MakeJournalEntriesHeaderFields from './MakeJournalEntriesHeaderFields';
 import { PageFormBigNumber } from 'components';
 import { safeSumBy } from 'utils';

client/src/containers/Accounting/MakeJournal/MakeJournalEntriesHeaderFields.js

@@ -7,7 +7,7 @@ import {
 } from '@blueprintjs/core';
 import { FastField, ErrorMessage } from 'formik';
 import { DateInput } from '@blueprintjs/datetime';
-import { FormattedMessage as T } from 'react-intl';
+import { FormattedMessage as T } from 'components';
 import classNames from 'classnames';
 
 import { CLASSES } from 'common/classes';

client/src/containers/Accounting/MakeJournal/MakeJournalFormFloatingActions.js

@@ -11,7 +11,7 @@ import {
 } from '@blueprintjs/core';
 import { useFormikContext } from 'formik';
 import classNames from 'classnames';
-import { FormattedMessage as T } from 'react-intl';
+import { FormattedMessage as T } from 'components';
 import { CLASSES } from 'common/classes';
 import { Icon, If } from 'components';
 import { useHistory } from 'react-router-dom';

client/src/containers/Accounting/MakeJournal/MakeJournalFormFooter.js

@@ -3,7 +3,7 @@ import { FastField } from 'formik';
 import classNames from 'classnames';
 import { CLASSES } from 'common/classes';
 import { FormGroup, TextArea } from '@blueprintjs/core';
-import { FormattedMessage as T } from 'react-intl';
+import { FormattedMessage as T } from 'components';
 import { Postbox, ErrorMessage, Row, Col } from 'components';
 import Dragzone from 'components/Dragzone';
 import { inputIntent } from 'utils';

client/src/containers/Accounting/MakeJournal/components.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { Intent, Position, Button, Tooltip } from '@blueprintjs/core';
-import { FormattedMessage as T } from 'react-intl';
+import { FormattedMessage as T } from 'components';
 import { Icon, Money, Hint } from 'components';
-import { formatMessage } from 'services/intl';
+import intl from 'react-intl-universal';
 import {
   AccountsListFieldCell,
   MoneyFieldCell,
@@ -30,14 +30,14 @@ export function ContactHeaderCell() {
  * Credit header cell.
  */
 export function CreditHeaderCell({ payload: { currencyCode } }) {
-  return formatMessage({ id: 'credit_currency' }, { currency: currencyCode });
+  return intl.get('credit_currency', { currency: currencyCode });
 }
 
 /**
  * debit header cell.
  */
 export function DebitHeaderCell({ payload: { currencyCode } }) {
-  return formatMessage({ id: 'debit_currency' }, { currency: currencyCode });
+  return intl.get('debit_currency', { currency: currencyCode });
 }
 
 /**
@@ -46,7 +46,7 @@ export function DebitHeaderCell({ payload: { currencyCode } }) {
 function AccountFooterCell({ payload: { currencyCode } }) {
   return (
     <span>
-      {formatMessage({ id: 'total_currency' }, { currency: currencyCode })}
+      {intl.get('total_currency', { currency: currencyCode })}
     </span>
   );
 }
@@ -120,7 +120,7 @@ export const useJournalTableEntriesColumns = () => {
         sticky: 'left',
       },
       {
-        Header: formatMessage({ id: 'account' }),
+        Header: intl.get('account'),
         id: 'account_id',
         accessor: 'account_id',
         Cell: AccountsListFieldCell,
@@ -157,7 +157,7 @@ export const useJournalTableEntriesColumns = () => {
         width: 120,
       },
       {
-        Header: formatMessage({ id: 'note' }),
+        Header: intl.get('note'),
         accessor: 'note',
         Cell: InputGroupCell,
         disableSortBy: true,
@@ -174,6 +174,6 @@ export const useJournalTableEntriesColumns = () => {
         width: 45,
       },
     ],
-    [formatMessage],
+    [],
   );
 };

client/src/containers/Accounting/MakeJournal/utils.js

@@ -10,7 +10,7 @@ import {
   transformToForm,
 } from 'utils';
 import { AppToaster } from 'components';
-import { formatMessage } from 'services/intl';
+import intl from 'react-intl-universal';
 import { useFormikContext } from 'formik';
 
 const ERROR = {
@@ -118,23 +118,19 @@ export const transformErrors = (resErrors, { setErrors, errors }) => {
 
   if ((error = getError(ERROR.RECEIVABLE_ENTRIES_HAS_NO_CUSTOMERS))) {
     toastMessages.push(
-      formatMessage({
-        id: 'should_select_customers_with_entries_have_receivable_account',
-      }),
+      intl.get('should_select_customers_with_entries_have_receivable_account'),
     );
     setEntriesErrors(error.indexes, 'contact_id', 'error');
   }
   if ((error = getError(ERROR.ENTRIES_SHOULD_ASSIGN_WITH_CONTACT))) {
     if (error.meta.find(meta => meta.contact_type === 'customer')) {
       toastMessages.push(
-        formatMessage({
-          id: 'receivable_accounts_should_assign_with_customers',
-        }),
+        intl.get('receivable_accounts_should_assign_with_customers'),
       );
     }
     if (error.meta.find(meta => meta.contact_type === 'vendor')) {
       toastMessages.push(
-        formatMessage({ id: 'payable_accounts_should_assign_with_vendors' }),
+        intl.get('payable_accounts_should_assign_with_vendors'),
       );
     }
     const indexes = error.meta.map((meta => meta.indexes)).flat();
@@ -144,9 +140,7 @@ export const transformErrors = (resErrors, { setErrors, errors }) => {
     newErrors = setWith(
       newErrors,
       'journal_number',
-      formatMessage({
-        id: 'journal_number_is_already_used',
-      }),
+      intl.get('journal_number_is_already_used'),
     );
   }
   setErrors({ ...newErrors });