feat(cashflow & journal sheet): add branch multi select.

src/containers/FinancialStatements/CashFlowStatement/CashFlowStatementDimensionsPanel.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import intl from 'react-intl-universal';
+import { FormGroup, Classes } from '@blueprintjs/core';
+import { BranchMultiSelect, Row, Col } from 'components';
+import { FinancialHeaderLoadingSkeleton } from '../FinancialHeaderLoadingSkeleton';
+import { useBranches } from 'hooks/query';
+
+/**
+ * Cash flow statement dismension panel.
+ * @returns
+ */
+export default function CashFlowStatementDimensionsPanel() {
+  // Fetches the branches list.
+  const { isLoading: isBranchesLoading, data: branches } = useBranches();
+
+  return (
+    <Row>
+      <Col xs={4}>
+        <FormGroup
+          label={intl.get('branches_multi_select.label')}
+          className={Classes.FILL}
+        >
+          <BranchMultiSelect name={'branchesIds'} branches={branches} />
+        </FormGroup>
+      </Col>
+    </Row>
+  );
+}

src/containers/FinancialStatements/CashFlowStatement/CashFlowStatementHeader.js

@@ -14,6 +14,7 @@ import withCashFlowStatementActions from './withCashFlowStatementActions';
 
 import { getDefaultCashFlowSheetQuery } from './utils';
 import { compose, transformToForm } from 'utils';
+import CashFlowStatementDimensionsPanel from './CashFlowStatementDimensionsPanel';
 
 /**
  * Cash flow statement header.
@@ -33,18 +34,19 @@ function CashFlowStatementHeader({
   const defaultValues = getDefaultCashFlowSheetQuery();
 
   // Initial form values.
-  const initialValues = transformToForm({
-    ...pageFilter,
-    fromDate: moment(pageFilter.fromDate).toDate(),
-    toDate: moment(pageFilter.toDate).toDate(),
-  }, defaultValues);
+  const initialValues = transformToForm(
+    {
+      ...pageFilter,
+      fromDate: moment(pageFilter.fromDate).toDate(),
+      toDate: moment(pageFilter.toDate).toDate(),
+    },
+    defaultValues,
+  );
 
   // Validation schema.
   const validationSchema = Yup.object().shape({
     dateRange: Yup.string().optional(),
-    fromDate: Yup.date()
-      .required()
-      .label(intl.get('fromDate')),
+    fromDate: Yup.date().required().label(intl.get('fromDate')),
     toDate: Yup.date()
       .min(Yup.ref('fromDate'))
       .required()
@@ -81,6 +83,11 @@ function CashFlowStatementHeader({
               title={<T id={'general'} />}
               panel={<CashFlowStatementGeneralPanel />}
             />
+            <Tab
+              id="dimensions"
+              title={<T id={'dimensions'} />}
+              panel={<CashFlowStatementDimensionsPanel />}
+            />
           </Tabs>
 
           <div class="financial-header-drawer__footer">

src/containers/FinancialStatements/CashFlowStatement/utils.js

@@ -10,5 +10,6 @@ export const getDefaultCashFlowSheetQuery = () => {
     basis: 'cash',
     displayColumnsType: 'total',
     filterByOption: 'with-transactions',
+    branchesIds: [],
   };
 };