feat(lang): drawer lang.

client/src/containers/Drawers/AccountDrawer/AccountDrawerHeader.js

@@ -18,7 +18,9 @@ export default function AccountDrawerHeader({
   return (
     <div className={'account-drawer__content'}>
       <div>
-        <span>Closing Balance</span>
+        <span>
+          <T id={'closing_balance'} />
+        </span>
         <p className={'balance'}>
           {<Money amount={amount} currency={currency_code} />}
         </p>

client/src/containers/Drawers/AccountDrawer/AccountDrawerTable.js

@@ -11,13 +11,11 @@ import withDrawerActions from 'containers/Drawer/withDrawerActions';
 /**
  * account drawer table.
  */
-function AccountDrawerTable({
-  closeDrawer
-}) {
+function AccountDrawerTable({ closeDrawer }) {
   const {
     account: { currency_code },
     accounts,
-    drawerName
+    drawerName,
   } = useAccountDrawerContext();
 
   const columns = React.useMemo(
@@ -69,14 +67,15 @@ function AccountDrawerTable({
       <DataTable columns={columns} data={accounts} />
 
       <div class="account-drawer__table-footer">
-        <Link to={`/financial-reports/general-ledger`} onClick={handleLinkClick}>
-          ← View more transactions.
+        <Link
+          to={`/financial-reports/general-ledger`}
+          onClick={handleLinkClick}
+        >
+          ←{formatMessage({ id: 'view_more_transactions' })}
         </Link>
       </div>
     </div>
   );
 }
 
-export default compose(
-  withDrawerActions
-)(AccountDrawerTable);
+export default compose(withDrawerActions)(AccountDrawerTable);

client/src/containers/Drawers/ExpenseDrawer/ExpenseDrawerFooter.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import { If, Money } from 'components';
+import { FormattedMessage as T } from 'react-intl';
 
 export default function ExpenseDrawerFooter({
   expense: { total_amount, currency_code },
@@ -8,11 +9,11 @@ export default function ExpenseDrawerFooter({
     <div className="expense-drawer__content--footer">
       <div className="wrapper">
         <div>
-          <span>Sub Total</span>
+          <span><T id={'sub_total'}/></span>
           <p>{<Money amount={total_amount} currency={currency_code} />}</p>
         </div>
         <div>
-          <span>Total</span>
+          <span><T id={'total'}/></span>
           <p>{<Money amount={total_amount} currency={currency_code} />}</p>
         </div>
       </div>

client/src/containers/Drawers/ExpenseDrawer/ExpenseDrawerTable.js

@@ -12,12 +12,12 @@ export default function ExpenseDrawerTable({
   const columns = React.useMemo(
     () => [
       {
-        Header: formatMessage({ id: 'Expense account' }),
+        Header: formatMessage({ id: 'expense_account' }),
         accessor: 'expense_account.name',
         width: 110,
       },
       {
-        Header: formatMessage({ id: 'Amount' }),
+        Header: formatMessage({ id: 'amount' }),
         accessor: ({ amount }) => (
           <Money amount={amount} currency={currency_code} />
         ),

client/src/containers/Drawers/ManualJournalDrawer/ManualJournalDrawerFooter.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import { FormattedMessage as T } from 'react-intl';
 
 export default function ManualJournalDrawerFooter({
   manualJournal: { amount_formatted },
@@ -7,11 +8,15 @@ export default function ManualJournalDrawerFooter({
     <div className="journal-drawer__content--footer">
       <div className="wrapper">
         <div>
-          <span>Sub Total</span>
+          <span>
+            <T id={'sub_total'} />
+          </span>
           <p>{amount_formatted}</p>
         </div>
         <div>
-          <span>Total</span>
+          <span>
+            <T id={'total'} />
+          </span>
           <p>{amount_formatted}</p>
         </div>
       </div>

client/src/containers/Drawers/PaperTemplate/PaperTemplate.js

@@ -3,18 +3,19 @@ import PaperTemplateHeader from './PaperTemplateHeader';
 import PaperTemplateTable from './PaperTemplateTable';
 import PaperTemplateFooter from './PaperTemplateFooter';
 import { updateItemsEntriesTotal } from 'containers/Entries/utils';
+import { formatMessage } from 'services/intl';
 
 import 'style/components/Drawer/DrawerTemplate.scss';
 
 function PaperTemplate({ labels: propLabels, paperData, entries }) {
   const labels = {
-    name: 'Estimate',
-    billedTo: 'Billed to',
-    date: 'Estimate date',
-    refNo: 'Estimate No.',
-    billedFrom: 'Billed from',
-    amount: 'Estimate amount',
-    dueDate: 'Due date',
+    name: formatMessage({ id: 'estimate_' }),
+    billedTo: formatMessage({ id: 'billed_to' }),
+    date: formatMessage({ id: 'estimate_date' }),
+    refNo: formatMessage({ id: 'estimate_no' }),
+    billedFrom: formatMessage({ id: 'billed_from' }),
+    amount: formatMessage({ id: 'estimate_amount' }),
+    dueDate: formatMessage({ id: 'due_date_' }),
     ...propLabels,
   };
 

client/src/containers/Drawers/PaperTemplate/PaperTemplateTable.js

@@ -19,7 +19,7 @@ export default function DrawerTemplateTable({ tableData, currencyCode }) {
         width: 80,
       },
       {
-        Header: formatMessage({ id: 'Qty' }),
+        Header: formatMessage({ id: 'qty' }),
         accessor: 'quantity',
         disableSortBy: true,
         width: 50,

client/src/containers/Drawers/PaymentPaperTemplate/PaymentPaperTemplate.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import PaymentPaperTemplateHeader from './PaymentPaperTemplateHeader';
 import PaymentPaperTemplateTable from './PaymentPaperTemplateTable';
+import { formatMessage } from 'services/intl';
 
 import 'style/components/Drawer/DrawerTemplate.scss';
 
@@ -9,14 +10,14 @@ export default function PaymentPaperTemplate({
   paperData,
 }) {
   const labels = {
-    name: 'Payment receive',
-    billedTo: 'Billed to',
-    date: 'Payment date',
-    refNo: 'Payment No.',
-    billedFrom: 'Billed from',
-    referenceNo: 'Reference No',
-    amount: 'Amount received',
-    dueDate: 'Due date',
+    name: formatMessage({ id: 'payment_receive' }),
+    billedTo: formatMessage({ id: 'billed_to' }),
+    date: formatMessage({ id: 'payment_date_' }),
+    refNo: formatMessage({ id: 'payment_no' }),
+    billedFrom: formatMessage({ id: 'billed_from' }),
+    referenceNo: formatMessage({ id: 'reference_no' }),
+    amount: formatMessage({ id: 'amount_received' }),
+    dueDate: formatMessage({ id: 'due_date_' }),
     ...propLabels,
   };
   const defaultValues = {