Merge remote-tracking branch 'origin/feature/exchange_rates'

client/src/components/AccountsMultiSelect.js

@@ -6,6 +6,7 @@ import {
 } from '@blueprintjs/core';
 // import {Select} from '@blueprintjs/select';
 import MultiSelect from 'components/MultiSelect';
+import { FormattedMessage as T, useIntl } from 'react-intl';
 
 export default function AccountsMultiSelect({
   accounts,
@@ -58,7 +59,7 @@ export default function AccountsMultiSelect({
       <Button
         rightIcon='caret-down'
         text={countSelectedAccounts === 0 ?
-          'All accounts' :
+         <T id={'all_accounts'}/>:
           `(${countSelectedAccounts}) Selected accounts`
         }
       />

client/src/components/AccountsSelectList.js

@@ -36,7 +36,6 @@ export default function AccountsSelectList({
       filterable={true}
       onItemSelect={onAccountSelect}>
       <Button
-        rightIcon='caret-down'
         text={selectedAccount ? selectedAccount.name : defautlSelectText}
       />
     </Select>

client/src/components/Authentication.js

@@ -1,26 +1,32 @@
 import React from 'react';
 import { Redirect, Route, Switch, Link } from 'react-router-dom';
-import BodyClassName from 'react-body-classname'; 
+import BodyClassName from 'react-body-classname';
 import authenticationRoutes from 'routes/authentication';
+import { FormattedMessage as T, useIntl } from 'react-intl';
 
-export default function AuthenticationWrapper({ isAuthenticated =false, ...rest }) {
-  const to = {pathname: '/dashboard/homepage'};
+export default function AuthenticationWrapper({
+  isAuthenticated = false,
+  ...rest
+}) {
+  const to = { pathname: '/dashboard/homepage' };
 
   return (
-    <Route path="/auth">
-      { (isAuthenticated) ?
-        (<Redirect to={to} />) : (
+    <Route path='/auth'>
+      {isAuthenticated ? (
+        <Redirect to={to} />
+      ) : (
         <BodyClassName className={'authentication'}>
           <Switch>
-            <div class="authentication-page">
+            <div class='authentication-page'>
               <Link
                 to={'bigcapital.io'}
-                className={'authentication-page__goto-bigcapital'}>
-                  ← Go to bigcapital.com
+                className={'authentication-page__goto-bigcapital'}
+              >
+                <T id={'go_to_bigcapital_com'} />
               </Link>
 
-              <div class="authentication-page__form-wrapper">
-                { authenticationRoutes.map((route, index) => (
+              <div class='authentication-page__form-wrapper'>
+                {authenticationRoutes.map((route, index) => (
                   <Route
                     key={index}
                     path={route.path}
@@ -32,8 +38,7 @@ export default function AuthenticationWrapper({ isAuthenticated =false, ...rest
             </div>
           </Switch>
         </BodyClassName>
-        )
-      }
+      )}
     </Route>
   );
-}
+}

client/src/components/CurrenciesSelectList.js

@@ -10,6 +10,7 @@ import {
   Select
 } from '@blueprintjs/select';
 
+import { FormattedMessage as T, useIntl } from 'react-intl';
 
 export default function CurrenciesSelectList(props) {
   const {formGroupProps, selectProps, onItemSelect} = props;
@@ -39,7 +40,7 @@ export default function CurrenciesSelectList(props) {
 
   return (
     <FormGroup
-      label={'Currency'}
+      label={<T id={'currency'}/>}
       className={'form-group--select-list form-group--currency'}
       {...formGroupProps}
     >

client/src/components/Dashboard/DashboardTopbar.js

@@ -12,6 +12,7 @@ import DashboardTopbarUser from 'components/Dashboard/TopbarUser';
 import Icon from 'components/Icon';
 import SearchConnect from 'connectors/Search.connect';
 import { compose } from 'utils';
+import { FormattedMessage as T, useIntl } from 'react-intl';
 
 function DashboardTopbar({
   pageTitle,
@@ -77,18 +78,18 @@ function DashboardTopbar({
               onClick={() => openGlobalSearch(true)}
               className={Classes.MINIMAL}
               icon='home'
-              text='Search'
+              text={<T id={'search'}/>}
             />
 
             <Button
               className={Classes.MINIMAL}
               icon='document'
-              text='Filters'
+              text={<T id={'filters'}/>}
             />
             <Button
               className={Classes.MINIMAL}
               icon='document'
-              text='Add order'
+              text={<T id={'add_order'}/>}
             />
             <Button className={Classes.MINIMAL} icon='document' text='More' />
           </NavbarGroup>

client/src/components/DialogsContainer.js

@@ -4,10 +4,12 @@ import UserFormDialog from 'containers/Dialogs/UserFormDialog';
 import ItemCategoryDialog from 'containers/Dialogs/ItemCategoryDialog';
 import CurrencyDialog from 'containers/Dialogs/CurrencyDialog';
 import InviteUserDialog from 'containers/Dialogs/InviteUserDialog';
+import ExchangeRateDialog from 'containers/Dialogs/ExchangeRateDialog';
 
 export default function DialogsContainer() {
   return (
     <React.Fragment>
+      <ExchangeRateDialog />
       <InviteUserDialog />
       <CurrencyDialog />
       <ItemCategoryDialog />

client/src/components/Expenses/ExpenseForm.js

@@ -13,7 +13,7 @@ import {
 } from '@blueprintjs/core';
 import { DateInput } from '@blueprintjs/datetime';
 import { Select } from '@blueprintjs/select';
-import { useIntl } from 'react-intl';
+import { FormattedMessage as T, useIntl } from 'react-intl';
 import { momentFormatter } from 'utils';
 import moment from 'moment';
 import AppToaster from 'components/AppToaster';
@@ -25,8 +25,7 @@ export default function ExpenseForm({
   expenseDetails,
   currencies
 }) {
-  const intl = useIntl();
-  console.log({ accounts });
+  const {formatMessage} = useIntl();
 
   const [state, setState] = useState({
     selectedExpenseAccount: null,
@@ -121,7 +120,7 @@ export default function ExpenseForm({
     <div class='expense-form'>
       <form onSubmit={formik.handleSubmit}>
         <FormGroup
-          label={'Date'}
+          label={<T id={'date'}/>}
           inline={true}
           intent={formik.errors.date && Intent.DANGER}
           helperText={formik.errors.date && formik.errors.date}
@@ -135,7 +134,7 @@ export default function ExpenseForm({
         </FormGroup>
 
         <FormGroup
-          label={'Expense Account'}
+          label={<T id={'expense_account'}/>}
           className={'form-group--expense-account'}
           inline={true}
           intent={formik.errors.expense_account_id && Intent.DANGER}
@@ -159,7 +158,7 @@ export default function ExpenseForm({
         </FormGroup>
 
         <FormGroup
-          label={'Amount'}
+          label={<T id={'amount'}/>}
           className={'form-group--amount'}
           intent={formik.errors.amount && Intent.DANGER}
           helperText={formik.errors.amount && formik.errors.amount}
@@ -191,7 +190,7 @@ export default function ExpenseForm({
         </FormGroup>
 
         <FormGroup
-          label={'Exchange Rate'}
+          label={<T id={'exchange_rate'}/>}
           className={'form-group--exchange-rate'}
           inline={true}
         >
@@ -199,7 +198,7 @@ export default function ExpenseForm({
         </FormGroup>
 
         <FormGroup
-          label={'Payment Account'}
+          label={<T id={'payment_account'}/>}
           className={'form-group--payment-account'}
           inline={true}
           intent={formik.errors.payment_account_id && Intent.DANGER}
@@ -223,7 +222,7 @@ export default function ExpenseForm({
         </FormGroup>
 
         <FormGroup
-          label={'Description'}
+          label={<T id={'description'}/>}
           className={'form-group--description'}
           inline={true}
         >
@@ -236,10 +235,10 @@ export default function ExpenseForm({
 
         <div class='form__floating-footer'>
           <Button intent={Intent.PRIMARY} type='submit'>
-            Save
+        <T id={'save'}/>
           </Button>
-          <Button>Save as Draft</Button>
-          <Button onClick={handleClose}>Close</Button>
+          <Button><T id={'save_as_draft'}/></Button>
+          <Button onClick={handleClose}><T id={'close'}/></Button>
         </div>
       </form>
     </div>

client/src/components/Expenses/ExpensesActionsBar.js

@@ -16,6 +16,7 @@ import { useRouteMatch } from 'react-router-dom'
 import classNames from 'classnames';
 import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
 import Icon from 'components/Icon';
+import { FormattedMessage as T, useIntl } from 'react-intl';
 
 export default function ExpensesActionsBar({
 
@@ -39,7 +40,7 @@ export default function ExpensesActionsBar({
           <Button
             className={classNames(Classes.MINIMAL, 'button--table-views')}
             icon={<Icon icon='table' />}
-            text='Table Views'
+            text={<T id={'table_views'}/>}
             rightIcon={'caret-down'}
           />
         </Popover>
@@ -50,31 +51,31 @@ export default function ExpensesActionsBar({
           className={Classes.MINIMAL}
           icon={<Icon icon='plus' />}
           href='/dashboard/expenses/new'
-          text='New Expense'
+          text={<T id={'new_expense'}/>}
           onClick={onClickNewAccount}
         />
         <Button
           className={Classes.MINIMAL}
           intent={Intent.DANGER}
           icon={<Icon icon='plus' />}
-          text='Delete'
+          text={<T id={'delete'}/>}
           onClick={onClickNewAccount}
         />
         <Button
           className={Classes.MINIMAL}
           icon={<Icon icon='plus' />}
-          text='Bulk Update'
+          text={<T id={'bulk_update'}/>}
           onClick={onClickNewAccount}
         />
         <Button
           className={Classes.MINIMAL}
           icon={<Icon icon='file-import' />}
-          text='Import'
+          text={<T id={'import'}/>}
         />
         <Button
           className={Classes.MINIMAL}
           icon={<Icon icon='file-export' />}
-          text='Export'
+          text={<T id={'export'}/>}
         />
       </NavbarGroup>
     </DashboardActionsBar>

client/src/components/FilterDropdown.js

@@ -13,6 +13,7 @@ import { usePrevious } from 'react-use';
 import { debounce } from 'lodash';
 import Icon from 'components/Icon';
 import { checkRequiredProperties } from 'utils';
+import { FormattedMessage as T, useIntl } from 'react-intl';
 
 export default function FilterDropdown({
   fields,
@@ -146,7 +147,7 @@ export default function FilterDropdown({
           minimal={true}
           intent={Intent.PRIMARY}
           onClick={onClickNewFilter}>
-          + New Conditional
+      <T id={'new_conditional'}/>
         </Button>
       </div>
     </div>

client/src/components/index.js

@@ -1,9 +1,11 @@
 import If from './Utils/If';
+import Money from './Money';
 // import Choose from './Utils/Choose';
 // import For from './Utils/For';
 
 export {
   If,
+  Money,
   // Choose,
   // For,
 };