feat: balance sheet report.

feat: trial balance sheet.
feat: general ledger report.
feat: journal report.
feat: profit/loss report.

client/src/containers/FinancialStatements/GeneralLedger/GeneralLedger.js

@@ -1,14 +1,13 @@
-import React, { useEffect, useCallback, useState} from 'react';
+import React, { useEffect, useCallback, useState } from 'react';
 import moment from 'moment';
-import GeneralLedgerTable from 'containers/FinancialStatements/GeneralLedger/GeneralLedgerTable';
 import { useQuery } from 'react-query';
 import { useIntl } from 'react-intl';
+import { queryCache } from 'react-query';
 
+import GeneralLedgerTable from 'containers/FinancialStatements/GeneralLedger/GeneralLedgerTable';
 import GeneralLedgerHeader from './GeneralLedgerHeader';
 
-import { compose } from 'utils';
-
-import DashboardInsider from 'components/Dashboard/DashboardInsider'
+import DashboardInsider from 'components/Dashboard/DashboardInsider';
 import DashboardPageContent from 'components/Dashboard/DashboardPageContent';
 import GeneralLedgerActionsBar from './GeneralLedgerActionsBar';
 
@@ -17,73 +16,101 @@ import withDashboardActions from 'containers/Dashboard/withDashboardActions';
 import withAccountsActions from 'containers/Accounts/withAccountsActions';
 import withSettings from 'containers/Settings/withSettings';
 
+import { compose } from 'utils';
 
+import { transformFilterFormToQuery } from 'containers/FinancialStatements/common';
+import withGeneralLedger from './withGeneralLedger';
+
+/**
+ * General Ledger (GL) sheet.
+ */
 function GeneralLedger({
   // #withDashboardActions
   changePageTitle,
+  setDashboardBackLink,
 
   // #withGeneralLedgerActions
   fetchGeneralLedger,
-  
+  refreshGeneralLedgerSheet,
+
   // #withAccountsActions
   requestFetchAccounts,
 
+  // #withGeneralLedger
+  generalLedgerSheetRefresh,
+
   // #withSettings
-  organizationSettings,
+  organizationName,
 }) {
-  const { formatMessage } = useIntl()
+  const { formatMessage } = useIntl();
   const [filter, setFilter] = useState({
-    from_date: moment().startOf('year').format('YYYY-MM-DD'),
-    to_date: moment().endOf('year').format('YYYY-MM-DD'),
+    fromDate: moment().startOf('year').format('YYYY-MM-DD'),
+    toDate: moment().endOf('year').format('YYYY-MM-DD'),
     basis: 'accural',
-    none_zero: true,
   });
 
   // Change page title of the dashboard.
   useEffect(() => {
-    changePageTitle(formatMessage({id:'general_ledger'}));
-  }, [changePageTitle,formatMessage]);
+    changePageTitle(formatMessage({ id: 'general_ledger' }));
+  }, [changePageTitle, formatMessage]);
 
-  const fetchAccounts = useQuery(['accounts-list'],
-    () => requestFetchAccounts());
+  useEffect(() => {
+    // Show the back link on dashboard topbar.
+    setDashboardBackLink(true);
 
-  const fetchSheet = useQuery(['general-ledger', filter],
-    (key, query) => fetchGeneralLedger(query),
-    { manual: true });
-
-  // Handle fetch data of trial balance table.
-  const handleFetchData = useCallback(() => {
-    fetchSheet.refetch({ force: true });
-  }, []);
-  
-  // Handle financial statement filter change.
-  const handleFilterSubmit = useCallback((filter) => {
-    const parsedFilter = {
-      ...filter,
-      from_date: moment(filter.from_date).format('YYYY-MM-DD'),
-      to_date: moment(filter.to_date).format('YYYY-MM-DD'),
+    return () => {
+      // Hide the back link on dashboard topbar.
+      setDashboardBackLink(false);
     };
-    setFilter(parsedFilter);
-  }, [setFilter]);
+  });
 
-  const handleFilterChanged = () => { };
+  // Observes the GL sheet refresh to invalid the query to refresh it.
+  useEffect(() => {
+    if (generalLedgerSheetRefresh) {
+      queryCache.invalidateQueries('general-ledger');
+      refreshGeneralLedgerSheet(false);
+    }
+  }, [generalLedgerSheetRefresh, refreshGeneralLedgerSheet]);
+
+  // Fetches accounts list.
+  const fetchAccounts = useQuery(['accounts-list'], () =>
+    requestFetchAccounts(),
+  );
+  // Fetches the general ledger sheet.
+  const fetchSheet = useQuery(['general-ledger', filter], (key, q) =>
+    fetchGeneralLedger({ ...transformFilterFormToQuery(q) }),
+  );
+
+  // Handle financial statement filter change.
+  const handleFilterSubmit = useCallback(
+    (filter) => {
+      const parsedFilter = {
+        ...filter,
+        fromDate: moment(filter.fromDate).format('YYYY-MM-DD'),
+        toDate: moment(filter.toDate).format('YYYY-MM-DD'),
+      };
+      setFilter(parsedFilter);
+      refreshGeneralLedgerSheet(true);
+    },
+    [setFilter, refreshGeneralLedgerSheet],
+  );
 
   return (
     <DashboardInsider>
-      <GeneralLedgerActionsBar
-        onFilterChanged={handleFilterChanged} />
+      <GeneralLedgerActionsBar />
 
       <DashboardPageContent>
         <div class="financial-statement financial-statement--general-ledger">
           <GeneralLedgerHeader
             pageFilter={filter}
-            onSubmitFilter={handleFilterSubmit} />
+            onSubmitFilter={handleFilterSubmit}
+          />
 
           <div class="financial-statement__body">
             <GeneralLedgerTable
-              companyName={organizationSettings.name}
+              companyName={organizationName}
               generalLedgerQuery={filter}
-              onFetchData={handleFetchData} />
+            />
           </div>
         </div>
       </DashboardPageContent>
@@ -95,5 +122,10 @@ export default compose(
   withGeneralLedgerActions,
   withDashboardActions,
   withAccountsActions,
-  withSettings,
-)(GeneralLedger);
+  withGeneralLedger(({ generalLedgerSheetRefresh }) => ({
+    generalLedgerSheetRefresh,
+  })),
+  withSettings(({ organizationSettings }) => ({
+    organizationName: organizationSettings.name,
+  })),
+)(GeneralLedger);

client/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerActionsBar.js

@@ -9,11 +9,10 @@ import {
   Position,
 } from '@blueprintjs/core';
 import { FormattedMessage as T } from 'react-intl';
-import Icon from 'components/Icon';
-import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar'
-import { If } from 'components';
 import classNames from 'classnames';
-import FilterDropdown from 'components/FilterDropdown';
+
+import Icon from 'components/Icon';
+import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
 
 import withGeneralLedger from './withGeneralLedger';
 import withGeneralLedgerActions from './withGeneralLedgerActions';
@@ -21,7 +20,7 @@ import withGeneralLedgerActions from './withGeneralLedgerActions';
 import { compose } from 'utils';
 
 /**
- * General ledger actions bar.
+ * General ledger - Actions bar.
  */
 function GeneralLedgerActionsBar({
   // #withGeneralLedger
@@ -29,12 +28,13 @@ function GeneralLedgerActionsBar({
 
   // #withGeneralLedgerActions
   toggleGeneralLedgerSheetFilter,
-  refreshGeneralLedgerSheet
+  refreshGeneralLedgerSheet,
 }) {
-  const handleFilterClick = () => {
+  // Handle customize button click.
+  const handleCustomizeClick = () => {
     toggleGeneralLedgerSheetFilter();
   };
-
+  // Handle re-calculate button click.
   const handleRecalcReport = () => {
     refreshGeneralLedgerSheet(true);
   };
@@ -43,62 +43,50 @@ function GeneralLedgerActionsBar({
     <DashboardActionsBar>
       <NavbarGroup>
         <Button
-          className={classNames(Classes.MINIMAL, 'button--table-views')}
-          icon={<Icon icon='cog-16' iconSize={16} />}
-          text={<T id={'customize_report'}/>}
-        />
-
-        <NavbarDivider />
-
-        <Button
-          className={classNames(
-            Classes.MINIMAL,
-            'button--gray-highlight',
-          )}
-          text={'Re-calc Report'}
+          className={classNames(Classes.MINIMAL, 'button--gray-highlight')}
+          text={<T id={'recalc_report'} />}
           onClick={handleRecalcReport}
           icon={<Icon icon="refresh-16" iconSize={16} />}
         />
+        <NavbarDivider />
 
-        <If condition={generalLedgerSheetFilter}>
-          <Button
-            className={Classes.MINIMAL}
-            text={<T id={'hide_filter'} />}
-            icon={<Icon icon="arrow-to-top" />}
-            onClick={handleFilterClick}
-          />
-        </If>
-
-        <If condition={!generalLedgerSheetFilter}>
-          <Button
-            className={Classes.MINIMAL}
-            text={<T id={'show_filter'} />}
-            icon={<Icon icon="arrow-to-bottom" />}
-            onClick={handleFilterClick}
-          />
-        </If>
+        <Button
+          className={classNames(Classes.MINIMAL, 'button--table-views')}
+          icon={<Icon icon="cog-16" iconSize={16} />}
+          text={
+            generalLedgerSheetFilter ? (
+              <T id={'hide_customizer'} />
+            ) : (
+              <T id={'customize_report'} />
+            )
+          }
+          onClick={handleCustomizeClick}
+          active={generalLedgerSheetFilter}
+        />
+        <NavbarDivider />
 
         <Popover
           interactionKind={PopoverInteractionKind.CLICK}
-          position={Position.BOTTOM_LEFT}>
-
+          position={Position.BOTTOM_LEFT}
+        >
           <Button
             className={classNames(Classes.MINIMAL, 'button--filter')}
-            text={<T id={'filter'}/>}
-            icon={<Icon icon="filter-16" iconSize={16} /> } />
+            text={<T id={'filter'} />}
+            icon={<Icon icon="filter-16" iconSize={16} />}
+          />
         </Popover>
 
         <NavbarDivider />
 
         <Button
           className={Classes.MINIMAL}
-          icon={<Icon icon='print-16' iconSize={16} />}
-          text={<T id={'print'}/>}
+          icon={<Icon icon="print-16" iconSize={16} />}
+          text={<T id={'print'} />}
         />
         <Button
           className={Classes.MINIMAL}
-          icon={<Icon icon='file-export-16' iconSize={16} />}
-          text={<T id={'export'}/>}
+          icon={<Icon icon="file-export-16" iconSize={16} />}
+          text={<T id={'export'} />}
         />
       </NavbarGroup>
     </DashboardActionsBar>
@@ -106,6 +94,8 @@ function GeneralLedgerActionsBar({
 }
 
 export default compose(
-  withGeneralLedger(({ generalLedgerSheetFilter }) => ({ generalLedgerSheetFilter })),
+  withGeneralLedger(({ generalLedgerSheetFilter }) => ({
+    generalLedgerSheetFilter,
+  })),
   withGeneralLedgerActions,
-)(GeneralLedgerActionsBar);
+)(GeneralLedgerActionsBar);

client/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerHeader.js

@@ -1,113 +1,100 @@
-import React, { useEffect, useCallback } from 'react';
-import { Button, FormGroup, Classes } from '@blueprintjs/core';
-import { Row, Col, Visible } from 'react-grid-system';
+import React from 'react';
 import moment from 'moment';
 import * as Yup from 'yup';
-import { useFormik } from 'formik';
+import { Formik, Form } from 'formik';
+import { Tabs, Tab, Button, Intent } from '@blueprintjs/core';
 import { FormattedMessage as T } from 'react-intl';
 
-import AccountsMultiSelect from 'components/AccountsMultiSelect';
 import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader';
-import withAccounts from 'containers/Accounts/withAccounts';
-
-import classNames from 'classnames';
-import FinancialStatementDateRange from 'containers/FinancialStatements/FinancialStatementDateRange';
-import RadiosAccountingBasis from '../RadiosAccountingBasis';
+import GeneralLedgerHeaderGeneralPane from './GeneralLedgerHeaderGeneralPane';
 
 import withGeneralLedger from './withGeneralLedger';
 import withGeneralLedgerActions from './withGeneralLedgerActions';
 
 import { compose } from 'utils';
 
-
+/**
+ * Geenral Ledger (GL) - Header.
+ */
 function GeneralLedgerHeader({
+  // #ownProps
   onSubmitFilter,
   pageFilter,
 
-  // #withAccounts
-  accountsList,
-
   // #withGeneralLedgerActions
-  refreshGeneralLedgerSheet,
+  toggleGeneralLedgerSheetFilter,
 
   // #withGeneralLedger
   generalLedgerSheetFilter,
-  generalLedgerSheetRefresh
 }) {
-  const formik = useFormik({
-    enableReinitialize: true,
-    initialValues: {
-      ...pageFilter,
-      from_date: moment(pageFilter.from_date).toDate(),
-      to_date: moment(pageFilter.to_date).toDate(),
-    },
-    validationSchema: Yup.object().shape({
-      from_date: Yup.date().required(),
-      to_date: Yup.date().min(Yup.ref('from_date')).required(),
-    }),
-    onSubmit(values, actions) {
-      onSubmitFilter(values);
-      actions.setSubmitting(false);
-    },
+  // Initial values.
+  const initialValues = {
+    ...pageFilter,
+    fromDate: moment(pageFilter.fromDate).toDate(),
+    toDate: moment(pageFilter.toDate).toDate(),
+  };
+
+  // Validation schema.
+  const validationSchema = Yup.object().shape({
+    dateRange: Yup.string().optional(),
+    fromDate: Yup.date().required(),
+    toDate: Yup.date().min(Yup.ref('fromDate')).required(),
   });
 
-  const onAccountSelected = useCallback((selectedAccounts) => {
-    formik.setFieldValue('accounts_ids', Object.keys(selectedAccounts));
-  }, [formik.setFieldValue]);
+  // Handle form submit.
+  const handleSubmit = (values, { setSubmitting }) => {
+    onSubmitFilter(values);
+    toggleGeneralLedgerSheetFilter();
+    setSubmitting(false);
+  };
 
-  const handleAccountingBasisChange = useCallback(
-    (value) => {
-      formik.setFieldValue('basis', value);
-    },
-    [formik],
-  );
-  
-  // handle submit filter submit button.
-  useEffect(() => {
-    if (generalLedgerSheetRefresh) {
-      formik.submitForm();
-      refreshGeneralLedgerSheet(false);
-    }
-  }, [formik, generalLedgerSheetRefresh])
+  // Handle cancel button click.
+  const handleCancelClick = () => {
+    toggleGeneralLedgerSheetFilter(false);
+  };
+
+  // Handle drawer close action.
+  const handleDrawerClose = () => {
+    toggleGeneralLedgerSheetFilter(false);
+  };
 
   return (
-    <FinancialStatementHeader show={generalLedgerSheetFilter}>
-      <Row>
-        <FinancialStatementDateRange formik={formik} />
-
-        <Visible xl><Col width={'100%'} /></Visible>
-
-        <Col width={260}>
-          <FormGroup
-            label={<T id={'specific_accounts'} />}
-            className={classNames('form-group--select-list', Classes.FILL)}
-          >
-            <AccountsMultiSelect
-              accounts={accountsList}
-              onAccountSelected={onAccountSelected}
+    <FinancialStatementHeader
+      isOpen={generalLedgerSheetFilter}
+      drawerProps={{ onClose: handleDrawerClose }}
+    >
+      <Formik
+        validationSchema={validationSchema}
+        initialValues={initialValues}
+        onSubmit={handleSubmit}
+      >
+        <Form>
+          <Tabs animate={true} vertical={true} renderActiveTabPanelOnly={true}>
+            <Tab
+              id="general"
+              title={<T id={'general'} />}
+              panel={<GeneralLedgerHeaderGeneralPane />}
             />
-          </FormGroup>
-        </Col>
+          </Tabs>
 
-        <Col width={260}>
-          <RadiosAccountingBasis
-            onChange={handleAccountingBasisChange}
-            selectedValue={formik.values.basis}
-          />
-        </Col>
+          <div class="financial-header-drawer__footer">
+            <Button className={'mr1'} intent={Intent.PRIMARY} type={'submit'}>
+              <T id={'calculate_report'} />
+            </Button>
 
-      </Row>
+            <Button onClick={handleCancelClick} minimal={true}>
+              <T id={'cancel'} />
+            </Button>
+          </div>
+        </Form>
+      </Formik>
     </FinancialStatementHeader>
   );
 }
 
 export default compose(
-  withAccounts(({ accountsList }) => ({
-    accountsList,
-  })),
-  withGeneralLedger(({ generalLedgerSheetFilter, generalLedgerSheetRefresh }) => ({
+  withGeneralLedger(({ generalLedgerSheetFilter }) => ({
     generalLedgerSheetFilter,
-    generalLedgerSheetRefresh,
   })),
   withGeneralLedgerActions,
 )(GeneralLedgerHeader);

client/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerHeaderGeneralPane.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import { FormGroup, Classes } from '@blueprintjs/core';
+import { FormattedMessage as T } from 'react-intl';
+import classNames from 'classnames';
+
+import { AccountsMultiSelect, Row, Col } from 'components';
+
+import FinancialStatementDateRange from 'containers/FinancialStatements/FinancialStatementDateRange';
+import RadiosAccountingBasis from '../RadiosAccountingBasis';
+
+import withAccounts from 'containers/Accounts/withAccounts';
+
+import { compose } from 'redux';
+
+/**
+ * General ledger (GL) - Header - General panel.
+ */
+function GeneralLedgerHeaderGeneralPane({
+  // #withAccounts
+  accountsList,
+}) {
+  return (
+    <div>
+      <FinancialStatementDateRange />
+
+      <Row>
+        <Col xs={4}>
+          <FormGroup
+            label={<T id={'specific_accounts'} />}
+            className={classNames('form-group--select-list', Classes.FILL)}
+          >
+            <AccountsMultiSelect accounts={accountsList} />
+          </FormGroup>
+        </Col>
+      </Row>
+
+      <RadiosAccountingBasis key={'basis'} />
+    </div>
+  );
+}
+
+export default compose(withAccounts(({ accountsList }) => ({ accountsList })))(
+  GeneralLedgerHeaderGeneralPane,
+);

client/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerTable.js

@@ -1,6 +1,5 @@
 import React, { useCallback, useMemo } from 'react';
 import moment from 'moment';
-import { connect } from 'react-redux';
 import { defaultExpanderReducer, compose } from 'utils';
 import { useIntl } from 'react-intl';
 
@@ -8,7 +7,6 @@ import FinancialSheet from 'components/FinancialSheet';
 import DataTable from 'components/DataTable';
 import Money from 'components/Money';
 
-import { getFinancialSheetIndexByQuery } from 'store/financialStatement/financialStatements.selectors';
 import withGeneralLedger from './withGeneralLedger';
 
 const ROW_TYPE = {
@@ -20,7 +18,6 @@ const ROW_TYPE = {
 
 function GeneralLedgerTable({
   companyName,
-  onFetchData,
 
   generalLedgerSheetLoading,
   generalLedgerTableRows,
@@ -29,35 +26,29 @@ function GeneralLedgerTable({
   const { formatMessage } = useIntl();
 
   // Account name column accessor.
-  const accountNameAccessor = useCallback(
-    (row) => {
-      switch (row.rowType) {
-        case ROW_TYPE.OPENING_BALANCE:
-          return 'Opening Balance';
-        case ROW_TYPE.CLOSING_BALANCE:
-          return 'Closing Balance';
-        default:
-          return row.name;
-      }
-    },
-    [ROW_TYPE],
-  );
+  const accountNameAccessor = (row) => {
+    switch (row.rowType) {
+      case ROW_TYPE.OPENING_BALANCE:
+        return 'Opening Balance';
+      case ROW_TYPE.CLOSING_BALANCE:
+        return 'Closing Balance';
+      default:
+        return row.name;
+    }
+  };
 
   // Date accessor.
-  const dateAccessor = useCallback(
-    (row) => {
-      const TYPES = [
-        ROW_TYPE.OPENING_BALANCE,
-        ROW_TYPE.CLOSING_BALANCE,
-        ROW_TYPE.TRANSACTION,
-      ];
+  const dateAccessor = (row) => {
+    const TYPES = [
+      ROW_TYPE.OPENING_BALANCE,
+      ROW_TYPE.CLOSING_BALANCE,
+      ROW_TYPE.TRANSACTION,
+    ];
 
-      return TYPES.indexOf(row.rowType) !== -1
-        ? moment(row.date).format('DD MMM YYYY')
-        : '';
-    },
-    [moment, ROW_TYPE],
-  );
+    return TYPES.indexOf(row.rowType) !== -1
+      ? moment(row.date).format('DD MMM YYYY')
+      : '';
+  };
 
   // Amount cell
   const amountCell = useCallback(({ cell }) => {
@@ -73,10 +64,6 @@ function GeneralLedgerTable({
     return <Money amount={transaction.amount} currency={'USD'} />;
   }, []);
 
-  const referenceLink = useCallback((row) => {
-    return <a href="">{row.referenceId}</a>;
-  });
-
   const columns = useMemo(
     () => [
       {
@@ -99,7 +86,7 @@ function GeneralLedgerTable({
       },
       {
         Header: formatMessage({ id: 'trans_num' }),
-        accessor: referenceLink,
+        accessor: 'reference_id',
         className: 'transaction_number',
         width: 110,
       },
@@ -125,10 +112,6 @@ function GeneralLedgerTable({
     [],
   );
 
-  const handleFetchData = useCallback(() => {
-    onFetchData && onFetchData();
-  }, [onFetchData]);
-
   // Default expanded rows of general ledger table.
   const expandedRows = useMemo(
     () => defaultExpanderReducer(generalLedgerTableRows, 1),
@@ -140,12 +123,11 @@ function GeneralLedgerTable({
   return (
     <FinancialSheet
       companyName={companyName}
-      // sheetType={formatMessage({ id: 'general_ledger_sheet' })}
+      sheetType={formatMessage({ id: 'general_ledger_sheet' })}
       fromDate={generalLedgerQuery.from_date}
       toDate={generalLedgerQuery.to_date}
       name="general-ledger"
       loading={generalLedgerSheetLoading}
-      minimal={true}
       fullWidth={true}
     >
       <DataTable
@@ -155,7 +137,6 @@ function GeneralLedgerTable({
         })}
         columns={columns}
         data={generalLedgerTableRows}
-        onFetchData={handleFetchData}
         rowClassNames={rowClassNames}
         expanded={expandedRows}
         virtualizedRows={true}
@@ -169,21 +150,7 @@ function GeneralLedgerTable({
   );
 }
 
-const mapStateToProps = (state, props) => {
-  const { generalLedgerQuery } = props;
-
-  return {
-    generalLedgerIndex: getFinancialSheetIndexByQuery(
-      state.financialStatements.generalLedger.sheets,
-      generalLedgerQuery,
-    ),
-  };
-};
-
-const withGeneralLedgerTable = connect(mapStateToProps);
-
 export default compose(
-  withGeneralLedgerTable,
   withGeneralLedger(
     ({
       generalLedgerTableRows,

client/src/containers/FinancialStatements/GeneralLedger/withGeneralLedger.js

@@ -1,27 +1,20 @@
 import { connect } from 'react-redux';
 import {
-  getFinancialSheet,
-  getFinancialSheetQuery,
-  getFinancialSheetTableRows,
+  getFinancialSheetFactory,
+  getFinancialSheetQueryFactory,
+  getFinancialSheetTableRowsFactory,
 } from 'store/financialStatement/financialStatements.selectors';
 
 export default (mapState) => {
   const mapStateToProps = (state, props) => {
-    const { generalLedgerIndex } = props;
+    const getGeneralLedgerSheet = getFinancialSheetFactory('generalLedger');
+    const getSheetTableRows = getFinancialSheetTableRowsFactory('generalLedger');
+    const getSheetQuery = getFinancialSheetQueryFactory('generalLedger');
 
     const mapped = {
-      generalLedgerSheet: getFinancialSheet(
-        state.financialStatements.generalLedger.sheets,
-        generalLedgerIndex,
-      ),
-      generalLedgerTableRows: getFinancialSheetTableRows(
-        state.financialStatements.generalLedger.sheets,
-        generalLedgerIndex,
-      ),
-      generalLedgerQuery: getFinancialSheetQuery(
-        state.financialStatements.generalLedger.sheets,
-        generalLedgerIndex,
-      ),
+      generalLedgerSheet: getGeneralLedgerSheet(state, props),
+      generalLedgerTableRows: getSheetTableRows(state, props),
+      generalLedgerQuery: getSheetQuery(state, props),
       generalLedgerSheetLoading:
         state.financialStatements.generalLedger.loading,
       generalLedgerSheetFilter: state.financialStatements.generalLedger.filter,