diff --git a/js/components/projects/index.js b/js/components/projects/index.js index 6530bd9f3..a8306c3cc 100644 --- a/js/components/projects/index.js +++ b/js/components/projects/index.js @@ -1,4 +1,4 @@ -import React, { memo, useEffect } from 'react'; +import React, { memo, useEffect, useCallback } from 'react'; import { Panel } from '../common/Surfaces/Panel'; import { Table, @@ -77,24 +77,33 @@ export const Projects = memo(({}) => { }, [dispatch]); useEffect(() => { - if (isDiscourseAvailable()) { - listOfProjects.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).forEach(project => { - if (!projectDiscourseLinks.hasOwnProperty(project.id)) { - getExistingPost(project.name) - .then(response => { - if (response.data['Post url']) { - projectDiscourseLinks[project.id] = response.data['Post url']; - dispatch(setProjectDiscourseLinks(projectDiscourseLinks)); - } - }) - .catch(err => { - console.log(err); - dispatch(setOpenDiscourseErrorModal(true)); - }); - } - }); + if (isDiscourseAvailable() && !projectDiscourseLinks) { + const tempLinks = {}; + const source = listOfProjects.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage); + processProjectItem(tempLinks, source, 0); } - }); + }, [listOfProjects, page, processProjectItem, projectDiscourseLinks, rowsPerPage]); + + const processProjectItem = useCallback( + (links, sourceData, index) => { + if (sourceData && sourceData.length >= index + 1) { + const project = sourceData[index]; + getExistingPost(project.name) + .then(response => { + if (response.data['Post url']) { + links[project.id] = response.data['Post url']; + dispatch(setProjectDiscourseLinks(links)); + processProjectItem(links, sourceData, index + 1); + } + }) + .catch(err => { + console.log(err); + dispatch(setOpenDiscourseErrorModal(true)); + }); + } + }, + [dispatch] + ); const handleChangePage = (event, newPage) => { setPage(newPage); @@ -199,7 +208,7 @@ export const Projects = memo(({}) => { { window.open(projectDiscourseLinks[project.id], '_blank'); }} diff --git a/js/components/projects/redux/reducer.js b/js/components/projects/redux/reducer.js index 79e026845..9696eeef3 100644 --- a/js/components/projects/redux/reducer.js +++ b/js/components/projects/redux/reducer.js @@ -33,7 +33,7 @@ export const INITIAL_STATE = { currentSnapshotList: null, forceCreateProject: false, isForceProjectCreated: false, - projectDiscourseLinks: {} + projectDiscourseLinks: null }; export const projectReducers = (state = INITIAL_STATE, action = {}) => { diff --git a/js/components/target/redux/reducer.js b/js/components/target/redux/reducer.js index 470ad25db..448a44338 100644 --- a/js/components/target/redux/reducer.js +++ b/js/components/target/redux/reducer.js @@ -3,7 +3,7 @@ import { constants } from './constatnts'; export const INITIAL_STATE = { oldUrl: '', isTargetLoading: false, - targetDiscourseLinks: {}, + targetDiscourseLinks: null, currentTargetLink: null }; diff --git a/js/components/target/targetList.js b/js/components/target/targetList.js index 9c63cb935..00333c574 100644 --- a/js/components/target/targetList.js +++ b/js/components/target/targetList.js @@ -2,7 +2,7 @@ * Created by abradley on 13/03/2018. */ -import React, { memo, useEffect } from 'react'; +import React, { memo, useEffect, useCallback } from 'react'; import { useSelector, useDispatch } from 'react-redux'; import { ListItemText, ListItemSecondaryAction, Grid } from '@material-ui/core'; import { List, ListItem, Panel } from '../common'; @@ -19,22 +19,30 @@ export const TargetList = memo(() => { const targetDiscourseLinks = useSelector(state => state.targetReducers.targetDiscourseLinks); useEffect(() => { - if (isDiscourseAvailable()) { - target_id_list.forEach(data => { - if (!targetDiscourseLinks.hasOwnProperty(data.id)) { - generateDiscourseTargetURL(data.title) - .then(response => { - targetDiscourseLinks[data.id] = response.data['Post url']; - dispatch(setTargetDiscourseLinks(targetDiscourseLinks)); - }) - .catch(err => { - console.log(err); - dispatch(setOpenDiscourseErrorModal(true)); - }); - } - }); + if (isDiscourseAvailable() && !targetDiscourseLinks) { + const tempLinks = {}; + processTargetItem(tempLinks, target_id_list, 0); } - }, [target_id_list, targetDiscourseLinks, dispatch]); + }, [target_id_list, targetDiscourseLinks, dispatch, processTargetItem]); + + const processTargetItem = useCallback( + (links, sourceData, index) => { + if (sourceData && sourceData.length >= index + 1) { + const data = sourceData[index]; + generateDiscourseTargetURL(data.title) + .then(response => { + links[data.id] = response.data['Post url']; + dispatch(setTargetDiscourseLinks(links)); + processTargetItem(links, sourceData, index + 1); + }) + .catch(err => { + console.log(err); + dispatch(setOpenDiscourseErrorModal(true)); + }); + } + }, + [dispatch] + ); const render_method = data => { const preview = URLS.target + data.title; @@ -55,7 +63,7 @@ export const TargetList = memo(() => { Open SGC summary )} - {discourseAvailable && targetDiscourseLinks.hasOwnProperty(data.id) && ( + {discourseAvailable && targetDiscourseLinks?.hasOwnProperty(data.id) && ( Discourse