refactor: rewrite useFlows as useConnectionFlows and useAppFlows with RQ

This commit is contained in:
Rıdvan Akca
2024-03-19 18:53:20 +03:00
parent ec87c7f21c
commit 316bda8c3f
8 changed files with 64 additions and 113 deletions

View File

@@ -1,7 +1,5 @@
import PropTypes from 'prop-types';
import { useQuery } from '@apollo/client';
import { Link, useSearchParams } from 'react-router-dom';
import { GET_FLOWS } from 'graphql/queries/get-flows';
import Pagination from '@mui/material/Pagination';
import PaginationItem from '@mui/material/PaginationItem';
@@ -9,31 +7,31 @@ import * as URLS from 'config/urls';
import AppFlowRow from 'components/FlowRow';
import NoResultFound from 'components/NoResultFound';
import useFormatMessage from 'hooks/useFormatMessage';
import useConnectionFlows from 'hooks/useConnectionFlows';
import useAppFlows from 'hooks/useAppFlows';
const FLOW_PER_PAGE = 10;
const getLimitAndOffset = (page) => ({
limit: FLOW_PER_PAGE,
offset: (page - 1) * FLOW_PER_PAGE,
});
function AppFlows(props) {
const { appKey } = props;
const formatMessage = useFormatMessage();
const [searchParams, setSearchParams] = useSearchParams();
const connectionId = searchParams.get('connectionId') || undefined;
const page = parseInt(searchParams.get('page') || '', 10) || 1;
const isConnectionFlowEnabled = !!connectionId;
const isAppFlowEnabled = !!appKey && !connectionId;
const { data } = useQuery(GET_FLOWS, {
variables: {
appKey,
connectionId,
...getLimitAndOffset(page),
},
});
const connectionFlows = useConnectionFlows(
{ connectionId, page },
{ enabled: isConnectionFlowEnabled },
);
const getFlows = data?.getFlows || {};
const { pageInfo, edges } = getFlows;
const flows = edges?.map(({ node }) => node);
const appFlows = useAppFlows({ appKey, page }, { enabled: isAppFlowEnabled });
const flows = isConnectionFlowEnabled
? connectionFlows?.data?.data || []
: appFlows?.data?.data || [];
const pageInfo = isConnectionFlowEnabled
? connectionFlows?.data?.meta || []
: appFlows?.data?.meta || [];
const hasFlows = flows?.length;
if (!hasFlows) {