diff --git a/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeaderGeneralPanal.js b/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeaderGeneralPanal.js
index bd194a816..0d97dde46 100644
--- a/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeaderGeneralPanal.js
+++ b/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeaderGeneralPanal.js
@@ -2,7 +2,7 @@ import React from 'react';
 import FinancialStatementDateRange from 'containers/FinancialStatements/FinancialStatementDateRange';
 import SelectDisplayColumnsBy from '../SelectDisplayColumnsBy';
 import RadiosAccountingBasis from '../RadiosAccountingBasis';
-import FinancialAccountsFilter from '../FinancialAccountsFilter';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
 
 /**
  * Balance sheet header - General panal.
@@ -12,7 +12,7 @@ export default function BalanceSheetHeaderGeneralTab({}) {
     <div>
       <FinancialStatementDateRange />
       <SelectDisplayColumnsBy />
-      <FinancialAccountsFilter
+      <FinancialStatementsFilter
         initialSelectedItem={'all-accounts'}
       />
       <RadiosAccountingBasis key={'basis'} />
diff --git a/src/containers/FinancialStatements/CashFlowStatement/CashFlowStatementGeneralPanel.js b/src/containers/FinancialStatements/CashFlowStatement/CashFlowStatementGeneralPanel.js
index 436d984d6..ed2e96e65 100644
--- a/src/containers/FinancialStatements/CashFlowStatement/CashFlowStatementGeneralPanel.js
+++ b/src/containers/FinancialStatements/CashFlowStatement/CashFlowStatementGeneralPanel.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import FinancialStatementDateRange from 'containers/FinancialStatements/FinancialStatementDateRange';
-import FinancialAccountsFilter from '../FinancialAccountsFilter';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
 import RadiosAccountingBasis from '../RadiosAccountingBasis';
 import SelectDisplayColumnsBy from '../SelectDisplayColumnsBy';
 
@@ -13,7 +13,7 @@ export default function CashFlowStatementHeaderGeneralPanel() {
     <div>
       <FinancialStatementDateRange />
       <SelectDisplayColumnsBy />
-      <FinancialAccountsFilter initialSelectedItem={'all-accounts'} />
+      <FinancialStatementsFilter initialSelectedItem={'all-accounts'} />
       <RadiosAccountingBasis key={'basis'} />
     </div>
   );
diff --git a/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryGeneralPanelContent.js b/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryGeneralPanelContent.js
index 7f17cb4ce..ae77259c2 100644
--- a/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryGeneralPanelContent.js
+++ b/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryGeneralPanelContent.js
@@ -5,6 +5,8 @@ import { Classes, FormGroup, Position, Checkbox } from '@blueprintjs/core';
 import { ContactsMultiSelect, FormattedMessage as T } from 'components';
 import classNames from 'classnames';
 import { Row, Col, FieldHint } from 'components';
+import { filterCustomersOptions } from '../common';
+
 import {
   momentFormatter,
   tansformDateValue,
@@ -12,6 +14,7 @@ import {
   handleDateChange,
 } from 'utils';
 import { useCustomersBalanceSummaryGeneralContext } from './CustomersBalanceSummaryGeneralProvider';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
 
 /**
  * Customers balance header - General panel - Content
@@ -65,6 +68,12 @@ export default function CustomersBalanceSummaryGeneralPanelContent() {
         </Col>
       </Row>
 
+      <FinancialStatementsFilter
+        items={filterCustomersOptions}
+        label={<T id={'customers.label_filter_customers'} />}
+        initialSelectedItem={'all-customers'}
+      />
+
       <Row>
         <Col xs={5}>
           <Field name={'customersIds'}>
@@ -80,7 +89,7 @@ export default function CustomersBalanceSummaryGeneralPanelContent() {
                 <ContactsMultiSelect
                   items={customers}
                   onItemSelect={(contacts) => {
-                    const customersIds = contacts.map(contact => contact.id);
+                    const customersIds = contacts.map((contact) => contact.id);
                     setFieldValue('customersIds', customersIds);
                   }}
                 />
diff --git a/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryHeader.js b/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryHeader.js
index d1d7e9874..8f74bc42b 100644
--- a/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryHeader.js
+++ b/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryHeader.js
@@ -26,7 +26,6 @@ function CustomersBalanceSummaryHeader({
   // #withCustomersBalanceSummaryActions
   toggleCustomerBalanceFilterDrawer,
 }) {
-
   // validation schema.
   const validationSchema = Yup.object().shape({
     asDate: Yup.date().required().label('asDate'),
@@ -34,15 +33,20 @@ function CustomersBalanceSummaryHeader({
 
   // Default form values.
   const defaultValues = {
+    ...pageFilter,
     asDate: moment().toDate(),
     customersIds: [],
   };
 
   // Filter form initial values.
-  const initialValues = transformToForm({
-    ...pageFilter,
-    asDate: moment(pageFilter.asDate).toDate(),
-  }, defaultValues);
+  const initialValues = transformToForm(
+    {
+      ...defaultValues,
+      ...pageFilter,
+      asDate: moment(pageFilter.asDate).toDate(),
+    },
+    defaultValues,
+  );
 
   // handle form submit.
   const handleSubmit = (values, { setSubmitting }) => {
diff --git a/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeader.js b/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeader.js
index 166de3ee1..bcfd1774e 100644
--- a/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeader.js
+++ b/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeader.js
@@ -30,22 +30,25 @@ function CustomersTransactionsHeader({
 }) {
   // Default form values.
   const defaultValues = {
+    ...pageFilter,
     fromDate: moment().toDate(),
     toDate: moment().toDate(),
     customersIds: [],
   };
   // Initial form values.
-  const initialValues = transformToForm({
-    ...pageFilter,
-    fromDate: moment(pageFilter.fromDate).toDate(),
-    toDate: moment(pageFilter.toDate).toDate(),
-  }, defaultValues);
+  const initialValues = transformToForm(
+    {
+      ...defaultValues,
+      ...pageFilter,
+      fromDate: moment(pageFilter.fromDate).toDate(),
+      toDate: moment(pageFilter.toDate).toDate(),
+    },
+    defaultValues,
+  );
 
   // Validation schema.
   const validationSchema = Yup.object().shape({
-    fromDate: Yup.date()
-      .required()
-      .label(intl.get('fromDate')),
+    fromDate: Yup.date().required().label(intl.get('fromDate')),
     toDate: Yup.date()
       .min(Yup.ref('fromDate'))
       .required()
@@ -59,7 +62,9 @@ function CustomersTransactionsHeader({
     setSubmitting(false);
   };
   // Handle drawer close action.
-  const handleDrawerClose = () => { toggleFilterDrawer(false); };
+  const handleDrawerClose = () => {
+    toggleFilterDrawer(false);
+  };
 
   return (
     <FinancialStatementHeader
diff --git a/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeaderGeneralPanel.js b/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeaderGeneralPanel.js
index b2a6c350e..5536d29cc 100644
--- a/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeaderGeneralPanel.js
+++ b/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeaderGeneralPanel.js
@@ -3,12 +3,15 @@ import classNames from 'classnames';
 import { Field } from 'formik';
 import { Classes, FormGroup } from '@blueprintjs/core';
 import FinancialStatementDateRange from 'containers/FinancialStatements/FinancialStatementDateRange';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
 import {
   Row,
   Col,
   ContactsMultiSelect,
   FormattedMessage as T,
 } from '../../../components';
+import { filterCustomersOptions } from '../common';
+
 import {
   CustomersTransactionsGeneralPanelProvider,
   useCustomersTransactionsGeneralPanelContext,
@@ -34,7 +37,11 @@ function CustomersTransactionsHeaderGeneralPanelContent() {
   return (
     <div>
       <FinancialStatementDateRange />
-
+      <FinancialStatementsFilter
+        items={filterCustomersOptions}
+        label={<T id={'customers.label_filter_customers'} />}
+        initialSelectedItem={'all-customers'}
+      />
       <Row>
         <Col xs={5}>
           <Field name={'customersIds'}>
diff --git a/src/containers/FinancialStatements/FinancialAccountsFilter.js b/src/containers/FinancialStatements/FinancialStatementsFilter.js
similarity index 85%
rename from src/containers/FinancialStatements/FinancialAccountsFilter.js
rename to src/containers/FinancialStatements/FinancialStatementsFilter.js
index f640aee5f..d6dc4a127 100644
--- a/src/containers/FinancialStatements/FinancialAccountsFilter.js
+++ b/src/containers/FinancialStatements/FinancialStatementsFilter.js
@@ -15,14 +15,18 @@ import { Col, Row, ListSelect, MODIFIER } from 'components';
 import { filterAccountsOptions } from './common';
 
 
-export default function FinancialAccountsFilter({ ...restProps }) {
+export default function FinancialStatementsFilter({
+  items = filterAccountsOptions,
+  label = <T id={'filter_accounts'} />,
+  ...restProps
+}) {
   const SUBMENU_POPOVER_MODIFIERS = {
     flip: { boundariesElement: 'viewport', padding: 20 },
     offset: { offset: '0, 10' },
     preventOverflow: { boundariesElement: 'viewport', padding: 40 },
   };
 
-  const filterAccountRenderer = (item, { handleClick, modifiers, query }) => {
+  const filterRenderer = (item, { handleClick, modifiers, query }) => {
     return (
       <Tooltip
         interactionKind={PopoverInteractionKind.HOVER}
@@ -44,13 +48,13 @@ export default function FinancialAccountsFilter({ ...restProps }) {
         <FastField name={'accountsFilter'}>
           {({ form: { setFieldValue }, field: { value } }) => (
             <FormGroup
-              label={<T id={'filter_accounts'} />}
+              label={label}
               className="form-group--select-list bp3-fill"
               inline={false}
             >
               <ListSelect
-                items={filterAccountsOptions}
-                itemRenderer={filterAccountRenderer}
+                items={items}
+                itemRenderer={filterRenderer}
                 popoverProps={{ minimal: true }}
                 filterable={false}
                 selectedItem={value}
diff --git a/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerHeaderGeneralPane.js b/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerHeaderGeneralPane.js
index e48638aef..5f78cfa43 100644
--- a/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerHeaderGeneralPane.js
+++ b/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerHeaderGeneralPane.js
@@ -7,7 +7,7 @@ import { AccountsMultiSelect, Row, Col } from 'components';
 
 import FinancialStatementDateRange from 'containers/FinancialStatements/FinancialStatementDateRange';
 import RadiosAccountingBasis from '../RadiosAccountingBasis';
-import FinancialAccountsFilter from '../FinancialAccountsFilter';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
 import { GLHeaderGeneralPanelProvider } from './GLHeaderGeneralPaneProvider';
 
 import { filterAccountsOptions } from './common';
@@ -33,7 +33,7 @@ function GLHeaderGeneralPaneContent() {
   return (
     <React.Fragment>
       <FinancialStatementDateRange />
-      <FinancialAccountsFilter
+      <FinancialStatementsFilter
         items={filterAccountsOptions}
         initialSelectedItem={'all-accounts'}
       />
diff --git a/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeader.js b/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeader.js
index f7812ec62..dfdfbf964 100644
--- a/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeader.js
+++ b/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeader.js
@@ -33,12 +33,14 @@ function InventoryValuationHeader({
 
   // Default values.
   const defaultValues = {
+    ...pageFilter,
     asDate: moment().toDate(),
     itemsIds: [],
   };
   // Initial values.
   const initialValues = transformToForm({
     ...pageFilter,
+    ...defaultValues,
     asDate: moment(pageFilter.asDate).toDate(),
   }, defaultValues);
 
diff --git a/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeaderGeneralPanel.js b/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeaderGeneralPanel.js
index 6a6af2922..4b32b6690 100644
--- a/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeaderGeneralPanel.js
+++ b/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeaderGeneralPanel.js
@@ -11,6 +11,8 @@ import {
   Col,
   FieldHint,
 } from '../../../components';
+import { filterInventoryValuationOptions } from '../common';
+
 import {
   momentFormatter,
   tansformDateValue,
@@ -21,6 +23,7 @@ import {
   InventoryValuationGeneralPanelProvider,
   useInventoryValuationGeneralPanelContext,
 } from './InventoryValuationHeaderGeneralPanelProvider';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
 
 /**
  * Inventory valuation - Drawer Header - General panel.
@@ -66,6 +69,11 @@ function InventoryValuationHeaderGeneralPanelContent() {
           </FastField>
         </Col>
       </Row>
+      <FinancialStatementsFilter
+        items={filterInventoryValuationOptions}
+        label={<T id={'items.label_filter_items'} />}
+        initialSelectedItem={'all-items'}
+      />
 
       <Row>
         <Col xs={5}>
diff --git a/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetHeaderGeneralPane.js b/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetHeaderGeneralPane.js
index 2853b54dc..fd332705f 100644
--- a/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetHeaderGeneralPane.js
+++ b/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetHeaderGeneralPane.js
@@ -3,7 +3,7 @@ import React from 'react';
 import FinancialStatementDateRange from 'containers/FinancialStatements/FinancialStatementDateRange';
 import SelectDisplayColumnsBy from '../SelectDisplayColumnsBy';
 import RadiosAccountingBasis from '../RadiosAccountingBasis';
-import FinancialAccountsFilter from '../FinancialAccountsFilter';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
 
 /**
  * Profit/Loss sheet - Drawer header - General panel.
@@ -13,7 +13,7 @@ export default function ProfitLossSheetHeaderGeneralPane({}) {
     <div>
       <FinancialStatementDateRange />
       <SelectDisplayColumnsBy />
-      <FinancialAccountsFilter initialSelectedItem={'all-accounts'} />
+      <FinancialStatementsFilter initialSelectedItem={'all-accounts'} />
       <RadiosAccountingBasis key={'basis'} />
     </div>
   );
diff --git a/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsGeneralPanel.js b/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsGeneralPanel.js
index 6c2e33ad1..e8c90d2b4 100644
--- a/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsGeneralPanel.js
+++ b/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsGeneralPanel.js
@@ -9,6 +9,8 @@ import {
 } from '../../../components';
 import classNames from 'classnames';
 import FinancialStatementDateRange from 'containers/FinancialStatements/FinancialStatementDateRange';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
+import { filterItemsOptions } from '../common';
 
 import {
   PurchasesByItemsGeneralPanelProvider,
@@ -35,6 +37,11 @@ function PurchasesByItemsGeneralPanelContent() {
   return (
     <div>
       <FinancialStatementDateRange />
+      <FinancialStatementsFilter
+        items={filterItemsOptions}
+        label={<T id={'items.label_filter_items'} />}
+        initialSelectedItem={'all-items'}
+      />
 
       <Row>
         <Col xs={4}>
diff --git a/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsHeader.js b/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsHeader.js
index 6b15ac729..0ada94130 100644
--- a/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsHeader.js
+++ b/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsHeader.js
@@ -47,6 +47,7 @@ function PurchasesByItemsHeader({
   // Initial form values.
   const initialValues = transformToForm(
     {
+      ...defaultValues,
       ...pageFilter,
       fromDate: moment(pageFilter.fromDate).toDate(),
       toDate: moment(pageFilter.toDate).toDate(),
diff --git a/src/containers/FinancialStatements/SalesByItems/SalesByItemsHeaderGeneralPanel.js b/src/containers/FinancialStatements/SalesByItems/SalesByItemsHeaderGeneralPanel.js
index 22168e2b2..974d48dcd 100644
--- a/src/containers/FinancialStatements/SalesByItems/SalesByItemsHeaderGeneralPanel.js
+++ b/src/containers/FinancialStatements/SalesByItems/SalesByItemsHeaderGeneralPanel.js
@@ -2,10 +2,11 @@ import React from 'react';
 import { FormGroup, Classes } from '@blueprintjs/core';
 import { Field } from 'formik';
 import classNames from 'classnames';
-import { get } from 'lodash';
+import { filterItemsOptions } from '../common';
 
 import { Row, Col, ItemsMultiSelect, FormattedMessage as T } from 'components';
 import FinancialStatementDateRange from 'containers/FinancialStatements/FinancialStatementDateRange';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
 import {
   SalesByItemGeneralPanelProvider,
   useSalesByItemsGeneralPanelContext,
@@ -32,6 +33,12 @@ function SalesByItemsHeaderGeneralPanelContent() {
     <div>
       <FinancialStatementDateRange />
 
+      <FinancialStatementsFilter
+        items={filterItemsOptions}
+        label={<T id={'items.label_filter_items'} />}
+        initialSelectedItem={'all-items'}
+      />
+
       <Row>
         <Col xs={4}>
           <Field name={'itemsIds'}>
diff --git a/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetHeaderGeneralPanel.js b/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetHeaderGeneralPanel.js
index 766567c73..eccd65a0b 100644
--- a/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetHeaderGeneralPanel.js
+++ b/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetHeaderGeneralPanel.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import FinancialStatementDateRange from 'containers/FinancialStatements/FinancialStatementDateRange';
 import RadiosAccountingBasis from '../RadiosAccountingBasis';
-import FinancialAccountsFilter from '../FinancialAccountsFilter';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
 
 /**
  * Trial balance sheet - Drawer header - General panel.
@@ -12,7 +12,7 @@ export default function TrialBalanceSheetHeaderGeneralPanel({
   return (
     <div>
       <FinancialStatementDateRange />
-      <FinancialAccountsFilter initialSelectedItem={'all-accounts'} />
+      <FinancialStatementsFilter initialSelectedItem={'all-accounts'} />
       <RadiosAccountingBasis />
     </div>
   );
diff --git a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeader.js b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeader.js
index 5474aa4f7..4dbbf10c1 100644
--- a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeader.js
+++ b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeader.js
@@ -33,14 +33,20 @@ function VendorsBalanceSummaryHeader({
 
   // filter form initial values.
   const defaultValues = {
+    ...pageFilter,
     asDate: moment().toDate(),
     vendorsIds: [],
   };
   // Initial form values.
-  const initialValues = transformToForm({
-    ...pageFilter,
-    asDate: moment(pageFilter.asDate).toDate(),
-  }, defaultValues);
+  const initialValues = transformToForm(
+    {
+      ...defaultValues,
+
+      ...pageFilter,
+      asDate: moment(pageFilter.asDate).toDate(),
+    },
+    defaultValues,
+  );
 
   // handle form submit.
   const handleSubmit = (values, { setSubmitting }) => {
diff --git a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeaderGeneralContent.js b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeaderGeneralContent.js
index 4ea6bf884..c5d81eadb 100644
--- a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeaderGeneralContent.js
+++ b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeaderGeneralContent.js
@@ -11,6 +11,8 @@ import {
   FieldHint,
   FormattedMessage as T,
 } from '../../../components';
+import { filterVendorsOptions } from '../common';
+
 import {
   momentFormatter,
   tansformDateValue,
@@ -18,6 +20,7 @@ import {
   handleDateChange,
 } from 'utils';
 import { useVendorsBalanceSummaryGeneralPanelContext } from './VendorsBalanceSummaryHeaderGeneralProvider';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
 
 /**
  * Vendors balance header - General panel - Content.
@@ -71,6 +74,12 @@ export default function VendorsBalanceSummaryHeaderGeneralContent() {
         </Col>
       </Row>
 
+      <FinancialStatementsFilter
+        items={filterVendorsOptions}
+        label={<T id={'vendors.label_filter_vendors'} />}
+        initialSelectedItem={'all-vendors'}
+      />
+
       <Row>
         <Col xs={4}>
           <Field name={'vendorsIds'}>
diff --git a/src/containers/FinancialStatements/VendorsTransactions/VendorsTransactionsHeader.js b/src/containers/FinancialStatements/VendorsTransactions/VendorsTransactionsHeader.js
index d3e29f513..7f03e51d2 100644
--- a/src/containers/FinancialStatements/VendorsTransactions/VendorsTransactionsHeader.js
+++ b/src/containers/FinancialStatements/VendorsTransactions/VendorsTransactionsHeader.js
@@ -31,23 +31,26 @@ function VendorsTransactionsHeader({
 }) {
   // Default form values.
   const defaultValues = {
+    ...pageFilter,
     fromDate: moment().toDate(),
     toDate: moment().toDate(),
     vendorsIds: [],
   };
 
   // Initial form values.
-  const initialValues = transformToForm({
-    ...pageFilter,
-    fromDate: moment(pageFilter.fromDate).toDate(),
-    toDate: moment(pageFilter.toDate).toDate(),
-  }, defaultValues);
+  const initialValues = transformToForm(
+    {
+      ...defaultValues,
+      ...pageFilter,
+      fromDate: moment(pageFilter.fromDate).toDate(),
+      toDate: moment(pageFilter.toDate).toDate(),
+    },
+    defaultValues,
+  );
 
   // Validation schema.
   const validationSchema = Yup.object().shape({
-    fromDate: Yup.date()
-      .required()
-      .label(intl.get('fromDate')),
+    fromDate: Yup.date().required().label(intl.get('fromDate')),
     toDate: Yup.date()
       .min(Yup.ref('fromDate'))
       .required()
@@ -62,7 +65,9 @@ function VendorsTransactionsHeader({
   };
 
   // Handle drawer close action.
-  const handleDrawerClose = () => { toggleFilterDrawer(false); };
+  const handleDrawerClose = () => {
+    toggleFilterDrawer(false);
+  };
 
   return (
     <FinancialStatementHeader
diff --git a/src/containers/FinancialStatements/VendorsTransactions/VendorsTransactionsHeaderGeneralPanel.js b/src/containers/FinancialStatements/VendorsTransactions/VendorsTransactionsHeaderGeneralPanel.js
index 85c655ae3..b7bfacfa2 100644
--- a/src/containers/FinancialStatements/VendorsTransactions/VendorsTransactionsHeaderGeneralPanel.js
+++ b/src/containers/FinancialStatements/VendorsTransactions/VendorsTransactionsHeaderGeneralPanel.js
@@ -4,12 +4,16 @@ import classNames from 'classnames';
 import { Classes, FormGroup } from '@blueprintjs/core';
 
 import FinancialStatementDateRange from '../FinancialStatementDateRange';
+import FinancialStatementsFilter from '../FinancialStatementsFilter';
+
 import {
   Row,
   Col,
   ContactsMultiSelect,
   FormattedMessage as T,
 } from '../../../components';
+import { filterVendorsOptions } from '../common';
+
 import {
   VendorsTransactionsGeneralPanelProvider,
   useVendorsTransactionsGeneralPanelContext,
@@ -35,7 +39,11 @@ function VendorsTransactionsHeaderGeneralPanelContent() {
   return (
     <div>
       <FinancialStatementDateRange />
-
+      <FinancialStatementsFilter
+        items={filterVendorsOptions}
+        label={<T id={'vendors.label_filter_vendors'} />}
+        initialSelectedItem={'all-vendors'}
+      />
       <Row>
         <Col xs={5}>
           <Field name={'vendorsIds'}>
diff --git a/src/containers/FinancialStatements/common.js b/src/containers/FinancialStatements/common.js
index 102cede08..64dc89365 100644
--- a/src/containers/FinancialStatements/common.js
+++ b/src/containers/FinancialStatements/common.js
@@ -65,8 +65,83 @@ export const filterAccountsOptions = [
   },
 ];
 
+export const filterItemsOptions = [
+  {
+    key: 'all-items',
+    name: intl.get('all_items'),
+    hint: intl.get('items.option_all_items.hint'),
+  },
+  {
+    key: 'with-transactions',
+    name: intl.get('items.option_with_transactions'),
+    hint: intl.get('items.option_with_transactions.hint'),
+  },
+  {
+    key: 'with-only-active',
+    name: intl.get('items.option.only_active'),
+  },
+];
+
+export const filterCustomersOptions = [
+  {
+    key: 'all-customers',
+    name: intl.get('all_customers'),
+    hint: intl.get('customers.option_all_customers.hint'),
+  },
+  {
+    key: 'without-zero-balance',
+    name: intl.get('customers.option_without_zero_balance'),
+    hint: intl.get('customers.option_without_zero_balance.hint'),
+  },
+  {
+    key: 'with-transactions',
+    name: intl.get('customers.option_with_transactions'),
+    hint: intl.get('customers.option_with_transactions.hint'),
+  },
+];
+
+export const filterVendorsOptions = [
+  {
+    key: 'all-vendors',
+    name: intl.get('all_vendors'),
+    hint: intl.get('vendors.option_all_vendors.hint'),
+  },
+  {
+    key: 'without-zero-balance',
+    name: intl.get('vendors.option_without_zero_balance'),
+    hint: intl.get('vendors.option_without_zero_balance.hint'),
+  },
+  {
+    key: 'with-transactions',
+    name: intl.get('vendors.option_with_transactions'),
+    hint: intl.get('vendors.option_with_transactions.hint'),
+  },
+];
+
+export const filterInventoryValuationOptions = [
+  {
+    key: 'all-items',
+    name: intl.get('all_items'),
+    hint: intl.get('items.option_all_items.hint'),
+  },
+  {
+    key: 'with-transactions',
+    name: intl.get('items.option_with_transactions'),
+    hint: intl.get('items.option_with_transactions.hint'),
+  },
+  {
+    key: 'without-zero-balance',
+    name: intl.get('items.option_without_zero_balance'),
+    hint: intl.get('items.option_without_zero_balance.hint'),
+  },
+  {
+    key: 'with-only-active',
+    name: intl.get('items.option.only_active'),
+  },
+]
+
 /**
- * Associate display columns by and type properties to query object. 
+ * Associate display columns by and type properties to query object.
  */
 export const transformDisplayColumnsType = (form) => {
   const columnType = displayColumnsByOptions.find(
@@ -87,15 +162,13 @@ const setNoneZeroTransactions = (form) => {
     ...form,
     noneZero: form.accountsFilter === 'without-zero-balance',
     noneTransactions: form.accountsFilter === 'with-transactions',
+    onlyActive: form.accountsFilter === 'with-only-active',
   };
-}
+};
 
 export const transformAccountsFilter = (form) => {
-  return R.compose(
-    R.omit(['accountsFilter']),
-    setNoneZeroTransactions,
-  )(form)
-}
+  return R.compose(R.omit(['accountsFilter']), setNoneZeroTransactions)(form);
+};
 
 /**
  * Transform filter form to http query.
diff --git a/src/lang/ar/index.json b/src/lang/ar/index.json
index 74a273c46..416b10b34 100644
--- a/src/lang/ar/index.json
+++ b/src/lang/ar/index.json
@@ -1369,7 +1369,34 @@
   "filter.enter_date": "أدخل تاريخ",
   "filter.value": "قيمة",
   "payment_made.empty_status.title": "المنشأة لم تدفع اي اموال إلي الموردين ، إلي حد الأن!.",
-  "estimate.delete.error.estimate_converted_to_invoice":"لا يمكن حذف عملية عرض اسعار الذي تم تحويلها إلي فاتورة بيع."
+  "estimate.delete.error.estimate_converted_to_invoice":"لا يمكن حذف عملية عرض اسعار الذي تم تحويلها إلي فاتورة بيع.",
+  
+  "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.hint": "قم بتضمين الاصناف واستبعاد تلك التي لديها رصيد صفري.",
+  "items.label_filter_items": "تصفية الاصناف",
+
+  "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_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.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_with_transactions": "Vendors with transactions",
+  "vendors.option_with_transactions.hint": "Include vendors that onces have transactions on the given date period only."
+
+
+
+
 }
 
 
diff --git a/src/lang/en/index.json b/src/lang/en/index.json
index 45df1e03b..41980f8ee 100644
--- a/src/lang/en/index.json
+++ b/src/lang/en/index.json
@@ -619,7 +619,6 @@
   "contact_us_technical_support": "Contact us - Technical Support",
   "organization_details": "Organization details",
   "financial_starting_date": "Financial starting date ",
-
   "save_continue": "Save & Continue",
   "organization_register": "Organization Register",
   "fiscal_year_": "Fiscal year",
@@ -1058,7 +1057,6 @@
   "products_you_buy_and_or_sell": "<strong> Inventory :</strong> Products you buy and/or sell and that you track quantities of.",
   "products_you_buy_and_or_sell_but_don_t_need": "<strong> Non-Inventory:</strong> Products you buy and/or sell but don’t need to (or can’t) track quantities of, for example, nuts and bolts used in an installation.",
   "there_is_no_items_in_the_table_yet": "There is no items in the table yet.",
-
   "mr": "Mr.",
   "mrs": "Mrs.",
   "ms": "Ms.",
@@ -1112,7 +1110,6 @@
   "Initializing": "Initializing",
   "Getting started": "Getting started",
   "Congratulations": "Congratulations",
-
   "manual_journal_number": "Manual journal {number}",
   "conditions_and_terms": "Conditions and terms",
   "allocate_landed_coast": "Allocate landed cost",
@@ -1342,5 +1339,26 @@
   "filter.enter_date": "Enter date",
   "filter.value": "Value",
   "payment_made.empty_status.title": "The organization doesn't pay to vendors, yet!",
-  "estimate.delete.error.estimate_converted_to_invoice":"Could not delete sale estimate that converted to invoice"
-}
+  "estimate.delete.error.estimate_converted_to_invoice": "Could not delete sale estimate that converted to invoice",
+  "items.option.only_active": "Only active",
+  "items.option_all_items.hint": "All items, including that ones have zero-balance.",
+  "items.option_with_transactions": "Items with transactions",
+  "items.option_without_zero_balance": "Items without zero-balance",
+  "items.option_without_zero_balance.hint": "Include items and exclude that ones have zero-balance.",
+  "items.option_with_transactions.hint": "Include items that onces have transactions on the given date period only.",
+  "items.label_filter_items": "Filter items",
+  "customers.option_all_customers.hint":"All customers, including that ones have zero-balance.",
+  "customers.label_filter_customers": "Filter customers",
+  "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_with_transactions": "Customers with transactions",
+  "customers.option_with_transactions.hint": "Include customers that onces have transactions on the given date period only.",
+  "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_with_transactions": "Vendors with transactions",
+  "vendors.option_with_transactions.hint": "Include vendors that onces have transactions on the given date period only."
+
+
+}
\ No newline at end of file
diff --git a/src/style/pages/FinancialStatements/ContactsBalanceSummary.scss b/src/style/pages/FinancialStatements/ContactsBalanceSummary.scss
index a9d63287b..5a2ce5c5e 100644
--- a/src/style/pages/FinancialStatements/ContactsBalanceSummary.scss
+++ b/src/style/pages/FinancialStatements/ContactsBalanceSummary.scss
@@ -32,7 +32,8 @@
 .financial-statement--balance-summary {
   .financial-header-drawer {
     .bp3-drawer {
-      max-height: 350px;
+      // max-height: 350px;
+      max-height: 415px;
     }
   }
 }
diff --git a/src/style/pages/FinancialStatements/ContactsTransactions.scss b/src/style/pages/FinancialStatements/ContactsTransactions.scss
index 6a5f293b3..74774d49e 100644
--- a/src/style/pages/FinancialStatements/ContactsTransactions.scss
+++ b/src/style/pages/FinancialStatements/ContactsTransactions.scss
@@ -84,7 +84,8 @@
 .financial-statement--transactions {
   .financial-header-drawer {
     .bp3-drawer {
-      max-height: 350px;
+      // max-height: 350px;
+      max-height: 415px;
     }
   }
 }
diff --git a/src/style/pages/FinancialStatements/SalesAndPurchasesSheet.scss b/src/style/pages/FinancialStatements/SalesAndPurchasesSheet.scss
index f3a0976a1..9e1c57d46 100644
--- a/src/style/pages/FinancialStatements/SalesAndPurchasesSheet.scss
+++ b/src/style/pages/FinancialStatements/SalesAndPurchasesSheet.scss
@@ -19,7 +19,7 @@
           padding-bottom: 0.4rem;
         }
         .tr.row_type--total .td {
-          border-top: 1px solid #BBB;
+          border-top: 1px solid #bbb;
           font-weight: 500;
           border-bottom: 3px double #000;
         }
@@ -29,21 +29,19 @@
 }
 
 .financial-statement--sales-by-items,
-.financial-statement--purchases-by-items{
-
-  .financial-header-drawer{
-    .bp3-drawer{
-      max-height: 400px;
+.financial-statement--purchases-by-items {
+  .financial-header-drawer {
+    .bp3-drawer {
+      // max-height: 400px;
+      max-height: 415px;
     }
   }
 }
 
-
-.financial-statement--inventory-valuation{
-
-  .financial-header-drawer{
-    .bp3-drawer{
+.financial-statement--inventory-valuation {
+  .financial-header-drawer {
+    .bp3-drawer {
       max-height: 350px;
     }
   }
-}
\ No newline at end of file
+}