External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-03-02 17:28:51 -03:30
Code Issues Packages Projects Releases Wiki Activity

refactor getJobsById into useWsJobs hook

Browse Source
This commit is contained in:
Keith Grant
2020-06-19 16:38:07 -07:00
parent e50576c820
commit b4a6749699
3 changed files with 25 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
awx/ui_next/src/components/JobList/JobList.jsx
View File

@@ -42,7 +42,6 @@ function JobList({ i18n, defaultParams, showTypeColumn = false }) {
error: contentError, error: contentError,
isLoading, isLoading,
request: fetchJobs, request: fetchJobs,
setValue,
} = useRequest( } = useRequest(
useCallback( useCallback(
async () => { async () => {
@@ -58,31 +57,18 @@ function JobList({ i18n, defaultParams, showTypeColumn = false }) {
fetchJobs(); fetchJobs();
}, [fetchJobs]); }, [fetchJobs]);
const { request: addJobsById } = useRequest( // TODO: update QS_CONFIG to be safe for deps array
useCallback( const fetchJobsById = useCallback(
async ids => { async ids => {
if (!ids.length) { const params = parseQueryString(QS_CONFIG, location.search);
return; params.id__in = ids.join(',');
} const { data } = await UnifiedJobsAPI.read(params);
const params = parseQueryString(QS_CONFIG, location.search); return data.results;
params.id__in = ids.join(','); },
const { data } = await UnifiedJobsAPI.read({ ...params }); [location.search] // eslint-disable-line react-hooks/exhaustive-deps
setValue(prev => {
const deDuplicated = data.results.filter(
job => !prev.results.find(j => j.id === job.id)
);
const mergedJobsList = [...deDuplicated, ...prev.results];
return {
results: mergedJobsList.slice(0, params.page_size),
count: prev.count + data.count,
};
});
},
[location, setValue] // eslint-disable-line react-hooks/exhaustive-deps
)
); );
const jobs = useWsJobs(results, addJobsById, !!defaultParams); const jobs = useWsJobs(results, fetchJobsById, !!defaultParams);
const isAllSelected = selected.length === jobs.length && selected.length > 0; const isAllSelected = selected.length === jobs.length && selected.length > 0;
const { const {

2
awx/ui_next/src/components/JobList/JobList.test.jsx
View File

@@ -218,7 +218,7 @@ describe('<JobList />', () => {
jest.restoreAllMocks(); jest.restoreAllMocks();
}); });
test('error is shown when job not successfully deleted from api', async () => { test.only('error is shown when job not successfully deleted from api', async () => {
JobsAPI.destroy.mockImplementation(() => { JobsAPI.destroy.mockImplementation(() => {
throw new Error({ throw new Error({
response: { response: {

19
awx/ui_next/src/components/JobList/useWsJobs.js
View File

@@ -5,7 +5,7 @@ export default function useWsJobs(initialJobs, fetchJobsById, filtersApplied) {
const [jobs, setJobs] = useState(initialJobs); const [jobs, setJobs] = useState(initialJobs);
const [lastMessage, setLastMessage] = useState(null); const [lastMessage, setLastMessage] = useState(null);
const [jobsToFetch, setJobsToFetch] = useState([]); const [jobsToFetch, setJobsToFetch] = useState([]);
const throttleJobsToFetch = useThrottle(jobsToFetch, 5000); const throttledJobsToFetch = useThrottle(jobsToFetch, 5000);
useEffect(() => { useEffect(() => {
setJobs(initialJobs); setJobs(initialJobs);
@@ -17,11 +17,20 @@ export default function useWsJobs(initialJobs, fetchJobsById, filtersApplied) {
} }
}; };
useEffect(() => { useEffect(() => {
if (throttleJobsToFetch.length) { (async () => {
fetchJobsById(throttleJobsToFetch); if (!throttledJobsToFetch.length) {
return;
}
setJobsToFetch([]); setJobsToFetch([]);
} const newJobs = await fetchJobsById(throttledJobsToFetch);
}, [throttleJobsToFetch, fetchJobsById]); const deduplicated = newJobs.filter(
job => !jobs.find(j => j.id === job.id)
);
if (deduplicated.length) {
setJobs([...deduplicated, ...jobs]);
}
})();
}, [throttledJobsToFetch, fetchJobsById]); // eslint-disable-line react-hooks/exhaustive-deps
const ws = useRef(null); const ws = useRef(null);