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

refactoring: migrating to react-query to manage service-side state.

Browse Source
This commit is contained in:
a.bouhuolia
2021-02-07 08:10:21 +02:00
parent e093be0663
commit adac2386bb
284 changed files with 8255 additions and 6610 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
client/src/containers/Accounts/AccountsChart.js
View File

@@ -1,23 +1,15 @@
import React, { useEffect, useState, useCallback } from 'react';
import { Route, Switch } from 'react-router-dom';
import { useQuery } from 'react-query';
import {
useIntl,
} from 'react-intl';
import React, { useEffect } from 'react';
import { useIntl } from 'react-intl';
import 'style/pages/Accounts/List.scss';
import DashboardPageContent from 'components/Dashboard/DashboardPageContent';
import DashboardInsider from 'components/Dashboard/DashboardInsider';
import { AccountsChartProvider } from 'containers/Accounts/AccountsChartProvider';
import AccountsViewPage from 'containers/Accounts/AccountsViewPage';
import AccountsActionsBar from 'containers/Accounts/AccountsActionsBar';
import AccountsAlerts from './AccountsAlerts';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import withResourceActions from 'containers/Resources/withResourcesActions';
import withAccountsActions from 'containers/Accounts/withAccountsActions';
import withAccountsTableActions from 'containers/Accounts/withAccountsTableActions';
import withViewsActions from 'containers/Views/withViewsActions';
import withAccounts from 'containers/Accounts/withAccounts';
import { compose } from 'utils';
@@ -29,83 +21,29 @@ function AccountsChart({
// #withDashboardActions
changePageTitle,
// #withViewsActions
requestFetchResourceViews,
// #withResourceActions
requestFetchResourceFields,
// #withAccountsTableActions
requestFetchAccountsTable,
addAccountsTableQueries,
// #withAccounts
accountsTableQuery,
accountsTableQuery
}) {
const { formatMessage } = useIntl();
// Fetch accounts resource views and fields.
const fetchResourceViews = useQuery(
['resource-views', 'accounts'],
(key, resourceName) => requestFetchResourceViews(resourceName),
);
// Fetch the accounts resource fields.
const fetchResourceFields = useQuery(
['resource-fields', 'accounts'],
(key, resourceName) => requestFetchResourceFields(resourceName),
);
// Fetch accounts list according to the given custom view id.
const fetchAccountsHook = useQuery(
['accounts-table', accountsTableQuery],
(key, q) => requestFetchAccountsTable(),
);
useEffect(() => {
changePageTitle(formatMessage({ id: 'chart_of_accounts' }));
}, [changePageTitle, formatMessage]);
// Refetches accounts data table when current custom view changed.
const handleFilterChanged = useCallback(() => {
}, []);
// Handle fetch data of accounts datatable.
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
addAccountsTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
});
},
[addAccountsTableQueries],
);
return (
<DashboardInsider
loading={fetchResourceFields.isFetching || fetchResourceViews.isFetching}
name={'accounts-chart'}
>
<AccountsActionsBar
onFilterChanged={handleFilterChanged}
/>
<AccountsChartProvider query={accountsTableQuery}>
<AccountsActionsBar />
<DashboardPageContent>
<AccountsViewPage />
</DashboardPageContent>
<AccountsAlerts />
</DashboardInsider>
</AccountsChartProvider>
);
}
export default compose(
withAccountsActions,
withAccountsTableActions,
withViewsActions,
withResourceActions,
withDashboardActions,
withAccounts(({ accountsTableQuery }) => ({
accountsTableQuery,