From 7a89678c9d28aa79941064c512cdf8f70cd2feb3 Mon Sep 17 00:00:00 2001 From: ATomkivEX <121034465+ATomkivEX@users.noreply.github.com> Date: Wed, 21 Dec 2022 13:20:38 +0200 Subject: [PATCH] added list update every 6 seconds for applications and helm releases (#224) * added list update every 10 seconds for applications and helm releases * Update refresh to 6 seconds Co-authored-by: Arthur Berezin --- .../main/applications/ApplicationsTable.js | 19 ++++++++++++---- .../src/app/main/releases/ReleasesTable.js | 22 ++++++++++++++----- frontend/src/app/store/applicationsSlice.js | 10 +++++++-- frontend/src/app/store/releasesSlice.js | 13 ++++++++--- frontend/yarn.lock | 5 ----- 5 files changed, 50 insertions(+), 19 deletions(-) diff --git a/frontend/src/app/main/applications/ApplicationsTable.js b/frontend/src/app/main/applications/ApplicationsTable.js index f5cd2b96..14a83f7a 100644 --- a/frontend/src/app/main/applications/ApplicationsTable.js +++ b/frontend/src/app/main/applications/ApplicationsTable.js @@ -18,7 +18,12 @@ import { useDispatch, useSelector } from 'react-redux'; import FuseLoading from '@fuse/core/FuseLoading'; import FuseScrollbars from '@fuse/core/FuseScrollbars/FuseScrollbars'; import FuseSvgIcon from '@fuse/core/FuseSvgIcon'; -import { getApplicationsList, selectApplications, selectIsApplicationsLoading } from 'app/store/applicationsSlice'; +import { + getApplicationsList, + selectApplications, + selectIsApplicationsLoading, + setIsFirstApplicationsRequest, +} from 'app/store/applicationsSlice'; import { getContextList, selectContexts } from 'app/store/clustersSlice'; import { getTemplatesList } from 'app/store/templatesSlice'; import { selectUser } from 'app/store/userSlice'; @@ -43,11 +48,17 @@ const ApplicationsTable = () => { const user = useSelector(selectUser); useEffect(() => { - dispatch(getApplicationsList()); - dispatch(getTemplatesList()); - }, [dispatch]); + const getApplicationsTimer = setInterval(() => { + dispatch(getApplicationsList()); + }, 6000); + + return () => clearInterval(getApplicationsTimer); + }, []); useEffect(() => { + dispatch(getApplicationsList()); + dispatch(setIsFirstApplicationsRequest()); + dispatch(getTemplatesList()); dispatch(getContextList()); }, [dispatch]); diff --git a/frontend/src/app/main/releases/ReleasesTable.js b/frontend/src/app/main/releases/ReleasesTable.js index 3adf109a..41f39430 100644 --- a/frontend/src/app/main/releases/ReleasesTable.js +++ b/frontend/src/app/main/releases/ReleasesTable.js @@ -20,7 +20,12 @@ import FuseLoading from '@fuse/core/FuseLoading'; import FuseScrollbars from '@fuse/core/FuseScrollbars'; import FuseSvgIcon from '@fuse/core/FuseSvgIcon'; import withRouter from '@fuse/core/withRouter'; -import { getReleases, selectIsReleasesLoading, selectReleases } from 'app/store/releasesSlice'; +import { + getReleases, + selectIsReleasesLoading, + selectReleases, + setIsFirstReleasesRequest, +} from 'app/store/releasesSlice'; import { getReleaseHealth, getReleaseTtl } from '../../api'; import { selectUser } from '../../store/userSlice'; @@ -59,13 +64,16 @@ const ReleasesTable = () => { const isLoading = useSelector(selectIsReleasesLoading); useEffect(() => { - setReleases(releasesData); - getHealthRows(releasesData); - getTtlRows(releasesData); - }, [releasesData]); + const getReleasesTimer = setInterval(() => { + dispatch(getReleases()); + }, 6000); + + return () => clearInterval(getReleasesTimer); + }, []); useEffect(() => { dispatch(getReleases()); + dispatch(setIsFirstReleasesRequest()); }, [dispatch]); useEffect(() => { @@ -80,6 +88,10 @@ const ReleasesTable = () => { const clustersSelectOptions = getSelectItemsFromArray(uniqueClusters); setNamespaces(namespacesSelectOptions); setClusters(clustersSelectOptions); + + setReleases(releasesData); + getHealthRows(releasesData); + getTtlRows(releasesData); } }, [releasesData]); diff --git a/frontend/src/app/store/applicationsSlice.js b/frontend/src/app/store/applicationsSlice.js index 54a24d68..9f3545cb 100644 --- a/frontend/src/app/store/applicationsSlice.js +++ b/frontend/src/app/store/applicationsSlice.js @@ -56,8 +56,13 @@ const applicationsSlice = createSlice({ initialState: { isLoading: false, applications: [], + isFirstRequest: true, + }, + reducers: { + setIsFirstApplicationsRequest(state) { + state.isFirstRequest = false; + }, }, - reducers: {}, extraReducers: { [getApplicationsList.fulfilled]: (state, { payload }) => ({ applications: payload, @@ -65,7 +70,7 @@ const applicationsSlice = createSlice({ }), [getApplicationsList.pending]: (state) => ({ ...state, - isLoading: true, + isLoading: state.isFirstRequest, }), [getApplicationsList.rejected]: (state) => ({ ...state, @@ -89,4 +94,5 @@ const applicationsSlice = createSlice({ export const selectApplications = ({ applications }) => applications.applications; export const selectIsApplicationsLoading = ({ applications }) => applications.isLoading; +export const { setIsFirstApplicationsRequest } = applicationsSlice.actions; export default applicationsSlice.reducer; diff --git a/frontend/src/app/store/releasesSlice.js b/frontend/src/app/store/releasesSlice.js index 4175468d..d70b870c 100644 --- a/frontend/src/app/store/releasesSlice.js +++ b/frontend/src/app/store/releasesSlice.js @@ -7,7 +7,7 @@ import { deleteReleaseTtl as deleteReleaseTtlAPI, } from '../api'; -export const getReleases = createAsyncThunk('releases/getReleasesList', async () => { +export const getReleases = createAsyncThunk('releases/getReleasesList', async (status) => { try { const response = await getReleasesList(); const { data } = response; @@ -66,8 +66,13 @@ const releasesSlice = createSlice({ initialState: { isLoading: false, releases: [], + isFirstRequest: true, + }, + reducers: { + setIsFirstReleasesRequest(state) { + state.isFirstRequest = false; + }, }, - reducers: {}, extraReducers: { [getReleases.fulfilled]: (state, { payload }) => ({ releases: payload, @@ -75,8 +80,9 @@ const releasesSlice = createSlice({ }), [getReleases.pending]: (state) => ({ ...state, - isLoading: true, + isLoading: state.isFirstRequest, }), + [getReleases.rejected]: (state) => ({ ...state, isLoading: false, @@ -87,4 +93,5 @@ const releasesSlice = createSlice({ export const selectReleases = ({ releases }) => releases.releases; export const selectIsReleasesLoading = ({ releases }) => releases.isLoading; +export const { setIsFirstReleasesRequest } = releasesSlice.actions; export default releasesSlice.reducer; diff --git a/frontend/yarn.lock b/frontend/yarn.lock index 96fe3dcf..d7330a45 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -5804,11 +5804,6 @@ "resolved" "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz" "version" "1.0.0" -"fsevents@^2.3.2", "fsevents@~2.3.2": - "integrity" "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==" - "resolved" "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz" - "version" "2.3.2" - "function-bind@^1.1.1": "integrity" "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==" "resolved" "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz"