QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-20 06:40:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

optimize filter items button.

Browse Source
This commit is contained in:
Ahmed Bouhuolia
2020-04-15 01:44:25 +02:00
parent cac6620ffe
commit 12f5945e82
2 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
client/src/components/Accounts/AccountsActionsBar.js
View File

@@ -34,6 +34,7 @@ function AccountsActionsBar({
const onClickNewAccount = () => { openDialog('account-form', {}); }; const onClickNewAccount = () => { openDialog('account-form', {}); };
const accountsFields = getResourceFields('accounts'); const accountsFields = getResourceFields('accounts');
const [filterCount, setFilterCount] = useState(0);
const viewsMenuItems = views.map((view) => { const viewsMenuItems = views.map((view) => {
return (<MenuItem href={`${path}/${view.id}/custom_view`} text={view.name} />); return (<MenuItem href={`${path}/${view.id}/custom_view`} text={view.name} />);
@@ -43,6 +44,7 @@ function AccountsActionsBar({
const filterDropdown = FilterDropdown({ const filterDropdown = FilterDropdown({
fields: accountsFields, fields: accountsFields,
onFilterChange: (filterConditions) => { onFilterChange: (filterConditions) => {
setFilterCount(filterConditions.length || 0);
addAccountsTableQueries({ addAccountsTableQueries({
filter_roles: filterConditions || '', filter_roles: filterConditions || '',
}); });
@@ -81,9 +83,8 @@ function AccountsActionsBar({
<Button <Button
className={classNames(Classes.MINIMAL, 'button--filter')} className={classNames(Classes.MINIMAL, 'button--filter')}
text="Filter" text={filterCount <= 0 ? 'Filter' : `${filterCount} filters applied`}
icon={ <Icon icon="filter" /> } /> icon={ <Icon icon="filter" /> }/>
</Popover> </Popover>
{hasSelectedRows && ( {hasSelectedRows && (
@@ -93,7 +94,6 @@ function AccountsActionsBar({
text='Archive' text='Archive'
/> />
)} )}
{hasSelectedRows && ( {hasSelectedRows && (
<Button <Button
className={Classes.MINIMAL} className={Classes.MINIMAL}

14
client/src/containers/Dashboard/Items/ItemsActionsBar.js
View File

@@ -1,4 +1,4 @@
import React, { useMemo, useCallback } from 'react'; import React, { useMemo, useCallback, useState } from 'react';
import { useRouteMatch, useHistory } from 'react-router-dom'; import { useRouteMatch, useHistory } from 'react-router-dom';
import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar'; import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
@@ -34,11 +34,10 @@ const ItemsActionsBar = ({
}) => { }) => {
const { path } = useRouteMatch(); const { path } = useRouteMatch();
const history = useHistory(); const history = useHistory();
const viewsMenuItems = views.map(view => { const [filterCount, setFilterCount] = useState(0);
return (
<MenuItem href={`${path}/${view.id}/custom_view`} text={view.name} /> const viewsMenuItems = views.map(view =>
); (<MenuItem href={`${path}/${view.id}/custom_view`} text={view.name} />));
});
const onClickNewItem = () => { const onClickNewItem = () => {
history.push('/dashboard/items/new'); history.push('/dashboard/items/new');
@@ -48,6 +47,7 @@ const ItemsActionsBar = ({
const filterDropdown = FilterDropdown({ const filterDropdown = FilterDropdown({
fields: itemsFields, fields: itemsFields,
onFilterChange: (filterConditions) => { onFilterChange: (filterConditions) => {
setFilterCount(filterConditions.length);
addItemsTableQueries({ addItemsTableQueries({
filter_roles: filterConditions || '', filter_roles: filterConditions || '',
}); });
@@ -90,7 +90,7 @@ const ItemsActionsBar = ({
> >
<Button <Button
className={classNames(Classes.MINIMAL, 'button--filter')} className={classNames(Classes.MINIMAL, 'button--filter')}
text='Filter' text={filterCount <= 0 ? 'Filter' : `${filterCount} filters applied`}
icon={<Icon icon='filter' />} icon={<Icon icon='filter' />}
/> />
</Popover> </Popover>