WIP: Arabic localization.|

client/src/containers/Vendors/VendorsLanding/components.js

@@ -8,7 +8,7 @@ import {
   Position,
   Intent,
 } from '@blueprintjs/core';
-import { useIntl } from 'react-intl';
+import intl from 'react-intl-universal';
 import { Icon, Money } from 'components';
 import { safeCallback, firstLettersArgs } from 'utils';
 
@@ -19,28 +19,28 @@ export function ActionsMenu({
   row: { original },
   payload: { onEdit, onDelete, onDuplicate },
 }) {
-  const { formatMessage } = useIntl();
+  
 
   return (
     <Menu>
       <MenuItem
         icon={<Icon icon="reader-18" />}
-        text={formatMessage({ id: 'view_details' })}
+        text={intl.get('view_details')}
       />
       <MenuDivider />
       <MenuItem
         icon={<Icon icon="pen-18" />}
-        text={formatMessage({ id: 'edit_vendor' })}
+        text={intl.get('edit_vendor')}
         onClick={safeCallback(onEdit, original)}
       />
       <MenuItem
         icon={<Icon icon="duplicate-16" />}
-        text={formatMessage({ id: 'duplicate' })}
+        text={intl.get('duplicate')}
         onClick={safeCallback(onDuplicate, original)}
       />
       <MenuItem
         icon={<Icon icon="trash-16" iconSize={16} />}
-        text={formatMessage({ id: 'delete_vendor' })}
+        text={intl.get('delete_vendor')}
         intent={Intent.DANGER}
         onClick={safeCallback(onDelete, original)}
       />
@@ -87,7 +87,7 @@ export function BalanceAccessor({ closing_balance, currency_code }) {
  * Retrieve the vendors table columns.
  */
 export function useVendorsTableColumns() {
-  const { formatMessage } = useIntl();
+  
 
   return React.useMemo(
     () => [
@@ -102,33 +102,33 @@ export function useVendorsTableColumns() {
       },
       {
         id: 'display_name',
-        Header: formatMessage({ id: 'display_name' }),
+        Header: intl.get('display_name'),
         accessor: 'display_name',
         className: 'display_name',
         width: 150,
       },
       {
         id: 'company_name',
-        Header: formatMessage({ id: 'company_name' }),
+        Header: intl.get('company_name'),
         accessor: 'company_name',
         className: 'company_name',
         width: 150,
       },
       {
         id: 'work_phone',
-        Header: formatMessage({ id: 'work_phone' }),
+        Header: intl.get('work_phone'),
         accessor: PhoneNumberAccessor,
         className: 'work_phone',
         width: 100,
       },
       {
         id: 'balance',
-        Header: formatMessage({ id: 'receivable_balance' }),
+        Header: intl.get('receivable_balance'),
         accessor: BalanceAccessor,
         className: 'receivable_balance',
         width: 100,
       }
     ],
-    [formatMessage],
+    [],
   );
 }