diff --git a/src/components/App.js b/src/components/App.js index 49699ba75..e91c41334 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -14,7 +14,7 @@ import GlobalErrors from 'containers/GlobalErrors/GlobalErrors'; import DashboardPrivatePages from 'components/Dashboard/PrivatePages'; import Authentication from 'components/Authentication'; -import { SplashScreen } from '../components'; +import { SplashScreen, DashboardThemeProvider } from '../components'; import { queryConfig } from '../hooks/query/base'; /** @@ -23,16 +23,18 @@ import { queryConfig } from '../hooks/query/base'; function AppInsider({ history }) { return (
- - - - - - - - + + + + + + + + + - + +
); } diff --git a/src/components/BankAccounts/index.js b/src/components/BankAccounts/index.js index 16eef2968..0022eddfa 100644 --- a/src/components/BankAccounts/index.js +++ b/src/components/BankAccounts/index.js @@ -4,6 +4,94 @@ import styled from 'styled-components'; import { Classes } from '@blueprintjs/core'; import clsx from 'classnames'; import Icon from '../Icon'; +import { whenRtl, whenLtr } from 'utils/styled-components'; + +const ACCOUNT_TYPE = { + CASH: 'cash', + BANK: 'bank', + CREDIT_CARD: 'credit-card', +}; + +const ACCOUNT_TYPE_PAIR_ICON = { + [ACCOUNT_TYPE.CASH]: 'payments', + [ACCOUNT_TYPE.CREDIT_CARD]: 'credit-card', + [ACCOUNT_TYPE.BANK]: 'account-balance', +}; + +function BankAccountMetaLine({ title, value, className }) { + return ( + + {title} + {value && {value}} + + ); +} + +function BankAccountBalance({ amount, loading }) { + return ( + + + {amount} + + {intl.get('balance')} + + ); +} + +function BankAccountTypeIcon({ type }) { + const icon = ACCOUNT_TYPE_PAIR_ICON[type]; + + if (!icon) { + return; + } + return ( + + + + ); +} + +export function BankAccount({ + title, + code, + type, + balance, + loading = false, + updatedBeforeText, + ...restProps +}) { + return ( + + + + {title} + + + {code} + + {!loading && } + + + + + + + + + + ); +} const BankAccountWrap = styled.div` width: 225px; @@ -91,13 +179,15 @@ const MetaLineValue = styled.div` border-radius: 9.6px; font-weight: normal; text-transform: none; - margin-left: auto; width: 30px; min-width: 30px; height: 16px; text-align: center; color: rgb(23, 43, 77); font-size: 11px; + + ${whenLtr(`margin-left: auto;`)} + ${whenRtl(`margin-right: auto;`)} `; const BankAccountMeta = styled.div` @@ -107,98 +197,14 @@ const BankAccountMeta = styled.div` export const BankAccountsList = styled.div` display: flex; margin: -8px; + flex-wrap: wrap; `; const AccountIconWrap = styled.div` position: absolute; top: 14px; - right: 12px; color: #abb3bb; + + ${whenLtr(`right: 12px;`)} + ${whenRtl(`left: 12px;`)} `; - -function BankAccountMetaLine({ title, value, className }) { - return ( - - {title} - {value && {value}} - - ); -} - -function BankAccountBalance({ amount, loading }) { - return ( - - - {amount} - - {intl.get('balance')} - - ); -} - -const ACCOUNT_TYPE = { - CASH: 'cash', - BANK: 'bank', - CREDIT_CARD: 'credit-card', -}; - -const ACCOUNT_TYPE_PAIR_ICON = { - [ACCOUNT_TYPE.CASH]: 'payments', - [ACCOUNT_TYPE.CREDIT_CARD]: 'credit-card', - [ACCOUNT_TYPE.BANK]: 'account-balance', -}; - -function BankAccountTypeIcon({ type }) { - const icon = ACCOUNT_TYPE_PAIR_ICON[type]; - - if (!icon) { - return; - } - return ( - - - - ); -} - -export function BankAccount({ - title, - code, - type, - balance, - loading = false, - updatedBeforeText, - ...restProps -}) { - return ( - - - - {title} - - - {code} - - {!loading && } - - - - - - - - - - ); -} diff --git a/src/components/Dashboard/DashboardThemeProvider.js b/src/components/Dashboard/DashboardThemeProvider.js new file mode 100644 index 000000000..23300ddb9 --- /dev/null +++ b/src/components/Dashboard/DashboardThemeProvider.js @@ -0,0 +1,9 @@ +import React from 'react'; +import { ThemeProvider } from 'styled-components'; +import { useAppIntlContext } from '../AppIntlProvider'; + +export function DashboardThemeProvider({ children }) { + const { direction } = useAppIntlContext(); + + return {children}; +} diff --git a/src/components/Dashboard/index.js b/src/components/Dashboard/index.js index 143e73dcb..fb97e3182 100644 --- a/src/components/Dashboard/index.js +++ b/src/components/Dashboard/index.js @@ -1,4 +1,3 @@ - - export * from './SplashScreen'; -export * from './DashboardBoot'; \ No newline at end of file +export * from './DashboardBoot'; +export * from './DashboardThemeProvider'; diff --git a/src/containers/CashFlow/AccountTransactions/AccountTransactionsDataTable.js b/src/containers/CashFlow/AccountTransactions/AccountTransactionsDataTable.js index a4186ecc6..f6ebecbe4 100644 --- a/src/containers/CashFlow/AccountTransactions/AccountTransactionsDataTable.js +++ b/src/containers/CashFlow/AccountTransactions/AccountTransactionsDataTable.js @@ -16,7 +16,9 @@ import { useMemorizedColumnsWidths } from '../../../hooks'; import { useAccountTransactionsColumns, ActionsMenu } from './components'; import { useAccountTransactionsContext } from './AccountTransactionsProvider'; import { handleCashFlowTransactionType } from './utils'; + import { compose } from 'utils'; +import { whenRtl, whenLtr } from 'utils/styled-components'; /** * Account transactions data table. @@ -79,13 +81,7 @@ function AccountTransactionsDataTable({ vListOverscanRowCount={0} initialColumnsWidths={initialColumnsWidths} onColumnResizing={handleColumnResizing} - noResults={ - - } + noResults={} className="table-constrant" payload={{ onViewDetails: handleViewDetailCashflowTransaction, @@ -133,10 +129,9 @@ const CashflowTransactionsTable = styled(DashboardConstrantTable)` .tbody-inner { .tr .td:not(:first-child) { - border-left: 1px solid #e6e6e6; + ${whenLtr(`border-left: 1px solid #e6e6e6;`)} + ${whenRtl(`border-right: 1px solid #e6e6e6;`)} } } } `; - -const DashboardRegularTable = styled(DataTable)``; diff --git a/src/containers/CashFlow/AccountTransactions/AccountTransactionsDetailsBar.js b/src/containers/CashFlow/AccountTransactions/AccountTransactionsDetailsBar.js index 93f27f8b3..29128ab0c 100644 --- a/src/containers/CashFlow/AccountTransactions/AccountTransactionsDetailsBar.js +++ b/src/containers/CashFlow/AccountTransactions/AccountTransactionsDetailsBar.js @@ -14,6 +14,7 @@ import { curry } from 'lodash/fp'; import { Icon } from '../../../components'; import { useAccountTransactionsContext } from './AccountTransactionsProvider'; +import { whenRtl, whenLtr } from 'utils/styled-components'; function AccountSwitchButton() { const { currentAccount } = useAccountTransactionsContext(); @@ -62,7 +63,7 @@ function AccountBalanceItem() { return ( - Balance in Bigcapital {''} + {intl.get('cash_flow_transaction.balance_in_bigcapital')} {''} {currentAccount.formatted_amount} @@ -159,8 +160,9 @@ const AccountSwitchText = styled.div` const AccountBalanceAmount = styled.span` font-weight: 600; display: inline-block; - margin-left: 10px; color: rgb(31, 50, 85); + ${whenLtr(`margin-left: 10px;`)} + ${whenRtl(`margin-right: 10px;`)} `; const AccountSwitchItemName = styled.div` @@ -178,6 +180,7 @@ const AccountSwitchItemUpdatedAt = styled.div` const AccountSwitchButtonBase = styled(Button)` .bp3-button-text { - margin-right: 5px; + ${whenLtr(`margin-right: 5px;`)} + ${whenRtl(`margin-left: 5px;`)} } `; diff --git a/src/containers/CashFlow/AccountTransactions/components.js b/src/containers/CashFlow/AccountTransactions/components.js index 199408d54..528d6afe2 100644 --- a/src/containers/CashFlow/AccountTransactions/components.js +++ b/src/containers/CashFlow/AccountTransactions/components.js @@ -45,6 +45,8 @@ export function useAccountTransactionsColumns() { Cell: FormatDateCell, width: 110, className: 'date', + clickable: true, + textOverview: true, }, { id: 'type', @@ -53,6 +55,7 @@ export function useAccountTransactionsColumns() { className: 'type', width: 140, textOverview: true, + clickable: true, }, { id: 'transaction_number', @@ -60,6 +63,8 @@ export function useAccountTransactionsColumns() { accessor: 'transaction_number', width: 160, className: 'transaction_number', + clickable: true, + textOverview: true, }, { id: 'reference_number', @@ -67,6 +72,8 @@ export function useAccountTransactionsColumns() { accessor: 'reference_number', width: 160, className: 'reference_number', + clickable: true, + textOverview: true, }, { id: 'deposit', @@ -76,6 +83,7 @@ export function useAccountTransactionsColumns() { className: 'deposit', textOverview: true, align: 'right', + clickable: true }, { id: 'withdrawal', @@ -85,6 +93,7 @@ export function useAccountTransactionsColumns() { width: 150, textOverview: true, align: 'right', + clickable: true }, { id: 'running_balance', @@ -94,6 +103,7 @@ export function useAccountTransactionsColumns() { width: 150, textOverview: true, align: 'right', + clickable: true }, { id: 'balance', @@ -102,6 +112,7 @@ export function useAccountTransactionsColumns() { className: 'balance', width: 150, textOverview: true, + clickable: true, align: 'right', }, ], diff --git a/src/containers/CashFlow/CashFlowAccounts/CashflowAccountsGrid.js b/src/containers/CashFlow/CashFlowAccounts/CashflowAccountsGrid.js index d2dfb92bd..e6531651c 100644 --- a/src/containers/CashFlow/CashFlowAccounts/CashflowAccountsGrid.js +++ b/src/containers/CashFlow/CashFlowAccounts/CashflowAccountsGrid.js @@ -151,7 +151,7 @@ const CashflowBankAccountEnhanced = compose( )(CashflowBankAccount); function getUpdatedBeforeText(createdAt) { - return '' + return ''; } /** @@ -170,11 +170,7 @@ function CashflowAccountsEmptyState() { return ( - + ); @@ -260,7 +256,7 @@ function CashflowAccountContextMenu({ } + text={} icon={} > diff --git a/src/lang/ar/index.json b/src/lang/ar/index.json index ea069410a..1bcb70ca0 100644 --- a/src/lang/ar/index.json +++ b/src/lang/ar/index.json @@ -1247,7 +1247,7 @@ "expense.details.total": "إجمالي", "manual_journal.details.subtotal": "المجموع", "manual_journal.details.total": "إجمالي", - "manual_journal.details.description": "الوصف", + "manual_journal.details.description": "الوصف", "setup.left_side.title": "سجل منشأة جديدة الأن.", "setup.left_side.description": "حسابك علي Bigcapital", "setup.left_side.footer_help": "نحن هنا للمساعدة!", @@ -1369,46 +1369,46 @@ "filter.enter_date": "أدخل تاريخ", "filter.value": "قيمة", "payment_made.empty_status.title": "المنشأة لم تدفع اي اموال إلي الموردين ، إلي حد الأن!.", - "estimate.delete.error.estimate_converted_to_invoice":"لا يمكن حذف عملية عرض اسعار الذي تم تحويلها إلي فاتورة بيع.", + "estimate.delete.error.estimate_converted_to_invoice": "لا يمكن حذف عملية عرض اسعار الذي تم تحويلها إلي فاتورة بيع.", "landed_cost.action.delete.success_message": "The landed cost has been deleted successfully.", - + "items.option.only_active": "Only active", "items.option_all_items.hint": "جميع الاصناف ، بما في ذلك تلك الاصناف لديها رصيد صفر.", "items.option_with_transactions": "الاصناف مع معاملات", "items.option_with_transactions.hint": "قم بتضمين الاصناف التي لها معاملات في فترة التاريخ المحددة فقط.", - "items.option_without_zero_balance": "الاصناف ذات رصيد صفر", + "items.option_without_zero_balance": "الاصناف ذات رصيد صفر", "items.option_without_zero_balance.hint": "قم بتضمين الاصناف واستبعاد تلك التي لديها رصيد صفري.", "items.label_filter_items": "تصفية الاصناف", - "customers.option_all_customers.hint":"All customers, including that ones have zero-balance.", + "customers.option_all_customers.hint": "All customers, including that ones have zero-balance.", "customers.option_without_zero_balance": "Customers without zero-balance", - "customers.option_without_zero_balance.hint":"Include customers and exclude that ones have zero-balance.", + "customers.option_without_zero_balance.hint": "Include customers and exclude that ones have zero-balance.", "customers.option_with_transactions": "Customers with transactions", "customers.option_with_transactions.hint": "Include customers that onces have transactions on the given date period only.", "customers.label_filter_customers": "Filter customers", - - - "vendors.option_all_vendors.hint":"All vendors, including that ones have zero-balance.", + + + "vendors.option_all_vendors.hint": "All vendors, including that ones have zero-balance.", "vendors.label_filter_vendors": "Filter Vendors", "vendors.option_without_zero_balance": "Vendors without zero-balance", - "vendors.option_without_zero_balance.hint":"Include vendors and exclude that ones have zero-balance.", + "vendors.option_without_zero_balance.hint": "Include vendors and exclude that ones have zero-balance.", "vendors.option_with_transactions": "Vendors with transactions", "vendors.option_with_transactions.hint": "Include vendors that onces have transactions on the given date period only.", - "siebar.cashflow":"التدفق النقدي", - "siebar.cashflow.label_cash_and_bank_accounts": "حسابات نقدية ومصرفية ", - "cash_flow.label_account_transcations": "حساب المعاملات", + "siebar.cashflow": "التدفق النقدي", + "siebar.cashflow.label_cash_and_bank_accounts": "حسابات نقدية والمصارف ", + "cash_flow.label_account_transcations": "معاملات الحساب", "cash_flow.label.deposit": "الإيداع", "cash_flow.label.withdrawal": "السحب", "cash_flow.label.running_balance": "الرصيد التحليلي", - "cash_flow.label.add_cash_account": "اضافة حساب نقدي", - "cash_flow.label.add_bank_account": "اضافة حساب مصرفي", - "cash_flow.label.add_money_in": "إيداع إلي حساب", - "cash_flow.label.add_money_out": "سحب من حساب", + "cash_flow.label.add_cash_account": "اضافة حساب نقدية", + "cash_flow.label.add_bank_account": "اضافة حساب مصرف", + "cash_flow.label.add_money_in": "إيداع إلي الحساب", + "cash_flow.label.add_money_out": "سحب من الحساب", "cash_flow.owner_contribution": "زيادة رأس المال", - "cash_flow.other_income": "الإيرادات الأخرى", - "cash_flow.owner_drawings": "نقصان رأس المال", + "cash_flow.other_income": "إيراد أخر", + "cash_flow.owner_drawings": "سحب رأس المال", "cash_flow.expenses": "المصاريف", "cash_flow.transfer_form_account": "تحويل من الحساب ", "cash_flow.transfer_to_account": "تحويل إلى الحساب ", @@ -1423,7 +1423,7 @@ "cash_flow_transaction.label_transfer_from_account": "تحويل من الحساب ", "cash_flow_transaction.label_transfer_to_account": "تحويل إلى الحساب ", "cash_flow_transaction.label_current_account": "حساب الحالي", - "cash_flow_transaction.delete.alert_message": "تم حذف معاملة التدفق النقدي بنجاح", + "cash_flow_transaction.delete.alert_message": "تم حذف معاملة التدفق النقدي بنجاح", "cash_flow_transaction_once_delete_this_transaction_you_will_able_to_restore_it": "بمجرد حذف هذه معاملة ، لن تتمكن من استعادتها لاحقًا. هل أنت متأكد أنك تريد حذف ؟", "cash_flow.auto_increment.auto": "يتم تعيين أرقام المعاملات على وضع الزيادة التلقائي. هل أنت متأكد من تغيير هذا الإعداد؟", "cash_flow.auto_increment.manually": "يتم تعيين أرقام معاملاتك يدوياً. هل أنت متأكد من تغيير هذه الإعدادات؟", @@ -1431,10 +1431,10 @@ "cash_flow_drawer.label_transaction_type": " نوع المعاملة", "cash_flow.drawer.label_transaction_no": " رقم المعاملة", "cash_flow.drawer.label_transaction": "معاملة التدفق النقدي {number}", - "cash_flow_there_is_deposit_withdrawal_transactions_on_the_current_account": "لا توجد معاملات إيداع / سحب على الحساب الحالي. ", - "cash_flow_there_is_no_cashflow_accounts_with_current_filter_criteria:":"لا توجد حسابات تدفق نقدي بمعايير التصفية الحالية. ", - "cash_flow_money_in":"إيداع مال الي حساب", - "cash_flow_money_out":"سحب مال من حساب", - "cash_flow_transaction.switch_item":" {value} من معاملات " -} - + "cash_flow.account_transactions.no_results": "لا توجد معاملات إيداع او سحب على الحساب الحالي.", + "cash_flow.accounts.no_results": "لا توجد حسابات نقدية او مصرف بحسب شروط المرشح الحالية. ", + "cash_flow_money_in": "إيداع", + "cash_flow_money_out": "سحب", + "cash_flow_transaction.switch_item": " {value} معاملة علي حساب", + "cash_flow_transaction.balance_in_bigcapital": "الرصيد في Bigcapital" +} \ No newline at end of file diff --git a/src/lang/en/index.json b/src/lang/en/index.json index e4eff711c..2003d8ea8 100644 --- a/src/lang/en/index.json +++ b/src/lang/en/index.json @@ -1365,7 +1365,7 @@ "vendors.option_with_transactions": "Vendors with transactions", "vendors.option_with_transactions.hint": "Include vendors that onces have transactions on the given date period only.", "landed_cost.action.delete.success_message": "The landed cost has been deleted successfully.", - "siebar.cashflow":"Cash flow", + "siebar.cashflow": "Cash flow", "siebar.cashflow.label_cash_and_bank_accounts": "Cash & Bank Accounts", "cash_flow.label_account_transcations": "Account Transcations", "cash_flow.label.deposit": "Deposit", @@ -1400,12 +1400,11 @@ "cash_flow_drawer.label_transaction_type": "Transaction type", "cash_flow.drawer.label_transaction_no": "Transaction number", "cash_flow.drawer.label_transaction": "Cash flow Transaction {number}", - "cash_flow_there_is_deposit_withdrawal_transactions_on_the_current_account": "There are no deposit/withdrawal transactions on the current account.", - "cash_flow_balance_in":"Balance in {name}", - "cash_flow_there_is_no_cashflow_accounts_with_current_filter_criteria:":"There are no cashflow accounts with current filter criteria.", - "cash_flow_money_in":"Money In", - "cash_flow_money_out":"Money Out", - "cash_flow_transaction.switch_item":"Transactions {value}" - - + "cash_flow.transactions.no_results": "There are no deposit/withdrawal transactions on the current account.", + "cash_flow_balance_in": "Balance in {name}", + "cash_flow.accounts.no_results": "There are no cashflow accounts with current filter criteria.", + "cash_flow_money_in": "Money In", + "cash_flow_money_out": "Money Out", + "cash_flow_transaction.switch_item": "Transactions {value}", + "cash_flow_transaction.balance_in_bigcapital": "Balance in Bigcapital" } \ No newline at end of file diff --git a/src/utils.js b/src/utils/index.js similarity index 100% rename from src/utils.js rename to src/utils/index.js diff --git a/src/utils/styled-components.js b/src/utils/styled-components.js new file mode 100644 index 000000000..6096cc865 --- /dev/null +++ b/src/utils/styled-components.js @@ -0,0 +1,9 @@ +import { css } from 'styled-components'; + +export const whenRtl = (restCss) => css` + ${({ theme }) => theme.dir === 'rtl' && restCss} +`; + +export const whenLtr = (restCss) => css` + ${({ theme }) => !theme.dir === 'ltr' && restCss} +`;