feat: money in & out Hotkeys.

This commit is contained in:
elforjani13
2021-10-23 20:59:25 +02:00
parent 75acab3348
commit e29db07c32
7 changed files with 31 additions and 16 deletions

View File

@@ -3,11 +3,16 @@ import { useHotkeys } from 'react-hotkeys-hook';
import { useHistory } from 'react-router-dom'; import { useHistory } from 'react-router-dom';
import { getDashboardRoutes } from 'routes/dashboard'; import { getDashboardRoutes } from 'routes/dashboard';
import withDashboardActions from 'containers/Dashboard/withDashboardActions'; import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import withDialogActions from 'containers/Dialog/withDialogActions';
import { compose } from 'utils'; import { compose } from 'utils';
function GlobalHotkeys({ function GlobalHotkeys({
// #withDashboardActions // #withDashboardActions
toggleSidebarExpend, toggleSidebarExpend,
// #withDialogActions
openDialog,
}) { }) {
const history = useHistory(); const history = useHistory();
const routes = getDashboardRoutes(); const routes = getDashboardRoutes();
@@ -17,7 +22,7 @@ function GlobalHotkeys({
.map(({ hotkey }) => hotkey) .map(({ hotkey }) => hotkey)
.toString(); .toString();
const handleSidebarToggleBtn = () => { const handleSidebarToggleBtn = () => {
toggleSidebarExpend(); toggleSidebarExpend();
}; };
useHotkeys( useHotkeys(
@@ -32,7 +37,9 @@ function GlobalHotkeys({
[history], [history],
); );
useHotkeys('ctrl+/', (event, handle) => handleSidebarToggleBtn()); useHotkeys('ctrl+/', (event, handle) => handleSidebarToggleBtn());
useHotkeys('shift+q', (event, handle) => openDialog('money-in', {}));
useHotkeys('shift+d', (event, handle) => openDialog('money-out', {}));
return <div></div>; return <div></div>;
} }
export default compose(withDashboardActions)(GlobalHotkeys); export default compose(withDashboardActions, withDialogActions)(GlobalHotkeys);

View File

@@ -1,4 +1,5 @@
import React from 'react'; import React from 'react';
import { useFormikContext } from 'formik';
import { Classes } from '@blueprintjs/core'; import { Classes } from '@blueprintjs/core';
import { If } from 'components'; import { If } from 'components';
@@ -11,15 +12,17 @@ import { useMoneyInDailogContext } from './MoneyInDialogProvider';
* Money in form fields. * Money in form fields.
*/ */
function MoneyInFormFields() { function MoneyInFormFields() {
const { values } = useFormikContext();
// Money in dialog context. // Money in dialog context.
const { accountId, accountType } = useMoneyInDailogContext(); const { accountId } = useMoneyInDailogContext();
return ( return (
<div className={Classes.DIALOG_BODY}> <div className={Classes.DIALOG_BODY}>
<If condition={!accountId}> <If condition={!accountId}>
<TransactionTypeFields /> <TransactionTypeFields />
</If> </If>
<MoneyInContentFields accountType={accountType} /> <MoneyInContentFields accountType={values.transaction_type} />
</div> </div>
); );
} }

View File

@@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { FastField, ErrorMessage } from 'formik'; import { FastField, Field, ErrorMessage } from 'formik';
import { Classes, FormGroup } from '@blueprintjs/core'; import { Classes, FormGroup } from '@blueprintjs/core';
import classNames from 'classnames'; import classNames from 'classnames';
import { import {
@@ -32,7 +32,7 @@ export default function TransactionTypeFields() {
<FastField name={'cashflow_account_id'}> <FastField name={'cashflow_account_id'}>
{({ form, field: { value }, meta: { error, touched } }) => ( {({ form, field: { value }, meta: { error, touched } }) => (
<FormGroup <FormGroup
label={'Current account'} label={<T id={'cash_flow_transaction.label_current_account'} />}
labelInfo={<FieldRequiredHint />} labelInfo={<FieldRequiredHint />}
intent={inputIntent({ error, touched })} intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name="cashflow_account_id" />} helperText={<ErrorMessage name="cashflow_account_id" />}
@@ -57,7 +57,7 @@ export default function TransactionTypeFields() {
{/*------------ Transaction type -----------*/} {/*------------ Transaction type -----------*/}
</Col> </Col>
<Col xs={5}> <Col xs={5}>
<FastField name={'transaction_type'}> <Field name={'transaction_type'}>
{({ {({
form: { values, setFieldValue }, form: { values, setFieldValue },
field: { value }, field: { value },
@@ -86,7 +86,7 @@ export default function TransactionTypeFields() {
/> />
</FormGroup> </FormGroup>
)} )}
</FastField> </Field>
</Col> </Col>
</Row> </Row>
</div> </div>

View File

@@ -2,6 +2,7 @@ import React from 'react';
import intl from 'react-intl-universal'; import intl from 'react-intl-universal';
import { Dialog, DialogSuspense } from 'components'; import { Dialog, DialogSuspense } from 'components';
import withDialogRedux from 'components/DialogReduxConnect'; import withDialogRedux from 'components/DialogReduxConnect';
import { compose } from 'redux'; import { compose } from 'redux';
const MoneyInDialogContent = React.lazy(() => import('./MoneyInDialogContent')); const MoneyInDialogContent = React.lazy(() => import('./MoneyInDialogContent'));
@@ -14,6 +15,7 @@ function MoneyInDialog({
payload = { account_type: null, account_id: null }, payload = { account_type: null, account_id: null },
isOpen, isOpen,
}) { }) {
return ( return (
<Dialog <Dialog
name={dialogName} name={dialogName}

View File

@@ -1,4 +1,5 @@
import React from 'react'; import React from 'react';
import { useFormikContext } from 'formik';
import { Classes } from '@blueprintjs/core'; import { Classes } from '@blueprintjs/core';
import { If } from 'components'; import { If } from 'components';
@@ -12,14 +13,15 @@ import { useMoneyOutDialogContext } from './MoneyOutDialogProvider';
*/ */
function MoneyOutFormFields() { function MoneyOutFormFields() {
// Money in dialog context. // Money in dialog context.
const { accountId, accountType } = useMoneyOutDialogContext(); const { accountId } = useMoneyOutDialogContext();
const { values } = useFormikContext();
return ( return (
<div className={Classes.DIALOG_BODY}> <div className={Classes.DIALOG_BODY}>
<If condition={!accountId}> <If condition={!accountId}>
<TransactionTypeFields /> <TransactionTypeFields />
</If> </If>
<MoneyOutContentFields accountType={accountType} /> <MoneyOutContentFields accountType={values.transaction_type} />
</div> </div>
); );
} }

View File

@@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { FastField, ErrorMessage } from 'formik'; import { FastField, Field, ErrorMessage } from 'formik';
import { FormGroup } from '@blueprintjs/core'; import { FormGroup } from '@blueprintjs/core';
import classNames from 'classnames'; import classNames from 'classnames';
import { import {
@@ -32,7 +32,7 @@ function TransactionTypeFields() {
<FastField name={'cashflow_account_id'}> <FastField name={'cashflow_account_id'}>
{({ form, field: { value }, meta: { error, touched } }) => ( {({ form, field: { value }, meta: { error, touched } }) => (
<FormGroup <FormGroup
label={'Current account'} label={<T id={'cash_flow_transaction.label_current_account'} />}
labelInfo={<FieldRequiredHint />} labelInfo={<FieldRequiredHint />}
intent={inputIntent({ error, touched })} intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name="cashflow_account_id" />} helperText={<ErrorMessage name="cashflow_account_id" />}
@@ -57,7 +57,7 @@ function TransactionTypeFields() {
{/*------------ Transaction type -----------*/} {/*------------ Transaction type -----------*/}
</Col> </Col>
<Col xs={5}> <Col xs={5}>
<FastField name={'transaction_type'}> <Field name={'transaction_type'}>
{({ {({
form: { values, setFieldValue }, form: { values, setFieldValue },
field: { value }, field: { value },
@@ -86,7 +86,7 @@ function TransactionTypeFields() {
/> />
</FormGroup> </FormGroup>
)} )}
</FastField> </Field>
</Col> </Col>
</Row> </Row>
</div> </div>

View File

@@ -1388,7 +1388,8 @@
"cash_flow_transaction.other_expense_account":"Other expense account", "cash_flow_transaction.other_expense_account":"Other expense account",
"save_and_publish": "Save & Publish", "save_and_publish": "Save & Publish",
"cash_flow_transaction.label_transfer_from_account":"Transfer from account", "cash_flow_transaction.label_transfer_from_account":"Transfer from account",
"cash_flow_transaction.label_transfer_to_account":"Transfer to account" "cash_flow_transaction.label_transfer_to_account":"Transfer to account",
"cash_flow_transaction.label_current_account":"Current account"
} }