From 7a7a3ba6ed440c750233f0eec1c68fc2d9e1e726 Mon Sep 17 00:00:00 2001 From: Nesterovskiy Date: Tue, 13 Aug 2024 14:39:04 +0300 Subject: [PATCH] feature/ADH-4865 create/reapeat rule/action dialog keep opent until successful response --- .../pages/ActionsPage/ActionsDialogs/ActionCreateDialog.tsx | 5 ++++- .../pages/ActionsPage/ActionsDialogs/ActionRepeatDialog.tsx | 3 +++ .../ActionsTable/ActionActionsCell/ActionActionsCell.tsx | 2 +- .../pages/RulesPage/RulesDialogs/RuleCreateDialog.tsx | 5 ++++- .../pages/RulesPage/RulesDialogs/RuleDeleteDialog.tsx | 4 ++-- .../app/src/store/adh/actions/actionsActionsSlice.ts | 4 ++-- smart-frontend/app/src/store/adh/rules/rulesActionsSlice.ts | 2 +- 7 files changed, 17 insertions(+), 8 deletions(-) diff --git a/smart-frontend/app/src/components/pages/ActionsPage/ActionsDialogs/ActionCreateDialog.tsx b/smart-frontend/app/src/components/pages/ActionsPage/ActionsDialogs/ActionCreateDialog.tsx index 59cbac4429..56786c3b45 100644 --- a/smart-frontend/app/src/components/pages/ActionsPage/ActionsDialogs/ActionCreateDialog.tsx +++ b/smart-frontend/app/src/components/pages/ActionsPage/ActionsDialogs/ActionCreateDialog.tsx @@ -19,10 +19,12 @@ import React, { useEffect, useState } from 'react'; import { useDispatch, useStore } from '@hooks'; import { closeCreateActionDialog, createActionWithUpdate } from '@store/adh/actions/actionsActionsSlice'; import { FooterDialog, MultilineInput } from '@uikit'; +import { SpinnerPanel } from '@uikit/Spinner/Spinner'; const ActionCreateDialog: React.FC = () => { const dispatch = useDispatch(); const isOpen = useStore(({ adh }) => adh.actionsActions.createDialog.isOpen); + const isActionInProgress = useStore(({ adh }) => adh.actionsActions.isActionInProgress); const [actionText, setActionText] = useState(''); @@ -53,7 +55,8 @@ const ActionCreateDialog: React.FC = () => { actionButtonLabel="Run" onAction={handleRun} > - + + {isActionInProgress && } ); }; diff --git a/smart-frontend/app/src/components/pages/ActionsPage/ActionsDialogs/ActionRepeatDialog.tsx b/smart-frontend/app/src/components/pages/ActionsPage/ActionsDialogs/ActionRepeatDialog.tsx index 00b95445d1..f2871901d5 100644 --- a/smart-frontend/app/src/components/pages/ActionsPage/ActionsDialogs/ActionRepeatDialog.tsx +++ b/smart-frontend/app/src/components/pages/ActionsPage/ActionsDialogs/ActionRepeatDialog.tsx @@ -19,10 +19,12 @@ import React, { useEffect, useState } from 'react'; import { useDispatch, useStore } from '@hooks'; import { closeUpdateActionDialog, repeatActionWithUpdate } from '@store/adh/actions/actionsActionsSlice'; import { FooterDialog, MultilineInput } from '@uikit'; +import { SpinnerPanel } from '@uikit/Spinner/Spinner'; const ActionRepeatDialog: React.FC = () => { const dispatch = useDispatch(); const action = useStore(({ adh }) => adh.actionsActions.updateDialog.action); + const isActionInProgress = useStore(({ adh }) => adh.actionsActions.isActionInProgress); const isOpen = !!action; const [actionText, setActionText] = useState(''); @@ -59,6 +61,7 @@ const ActionRepeatDialog: React.FC = () => { onAction={handleRun} > + {isActionInProgress && } ); }; diff --git a/smart-frontend/app/src/components/pages/ActionsPage/ActionsTable/ActionActionsCell/ActionActionsCell.tsx b/smart-frontend/app/src/components/pages/ActionsPage/ActionsTable/ActionActionsCell/ActionActionsCell.tsx index ed1f1ed9a2..f84bb8fdfc 100644 --- a/smart-frontend/app/src/components/pages/ActionsPage/ActionsTable/ActionActionsCell/ActionActionsCell.tsx +++ b/smart-frontend/app/src/components/pages/ActionsPage/ActionsTable/ActionActionsCell/ActionActionsCell.tsx @@ -36,7 +36,7 @@ const ActionActionsCell: React.FC = ({ action }) => { return ( - + ); diff --git a/smart-frontend/app/src/components/pages/RulesPage/RulesDialogs/RuleCreateDialog.tsx b/smart-frontend/app/src/components/pages/RulesPage/RulesDialogs/RuleCreateDialog.tsx index bb528a8f24..5596042613 100644 --- a/smart-frontend/app/src/components/pages/RulesPage/RulesDialogs/RuleCreateDialog.tsx +++ b/smart-frontend/app/src/components/pages/RulesPage/RulesDialogs/RuleCreateDialog.tsx @@ -19,10 +19,12 @@ import React, { useEffect, useState } from 'react'; import { useDispatch, useStore } from '@hooks'; import { closeCreateRuleDialog, createRuleWithUpdate } from '@store/adh/rules/rulesActionsSlice'; import { FooterDialog, MultilineInput } from '@uikit'; +import { SpinnerPanel } from '@uikit/Spinner/Spinner'; const RuleCreateDialog: React.FC = () => { const dispatch = useDispatch(); const isOpen = useStore(({ adh }) => adh.rulesActions.createDialog.isOpen); + const isActionInProgress = useStore(({ adh }) => adh.rulesActions.isActionInProgress); const [ruleText, setRuleText] = useState(''); @@ -53,7 +55,8 @@ const RuleCreateDialog: React.FC = () => { actionButtonLabel="Create" onAction={handleCreate} > - + + {isActionInProgress && } ); }; diff --git a/smart-frontend/app/src/components/pages/RulesPage/RulesDialogs/RuleDeleteDialog.tsx b/smart-frontend/app/src/components/pages/RulesPage/RulesDialogs/RuleDeleteDialog.tsx index 421f325c72..29bfc88d1c 100644 --- a/smart-frontend/app/src/components/pages/RulesPage/RulesDialogs/RuleDeleteDialog.tsx +++ b/smart-frontend/app/src/components/pages/RulesPage/RulesDialogs/RuleDeleteDialog.tsx @@ -18,7 +18,7 @@ import React from 'react'; import { Dialog } from '@uikit'; import { useDispatch, useStore } from '@hooks'; -import { closeCreateRuleDialog, deleteRuleWithUpdate } from '@store/adh/rules/rulesActionsSlice'; +import { closeDeleteRuleDialog, deleteRuleWithUpdate } from '@store/adh/rules/rulesActionsSlice'; const RuleDeleteDialog: React.FC = () => { const dispatch = useDispatch(); @@ -26,7 +26,7 @@ const RuleDeleteDialog: React.FC = () => { const isOpen = !!rule; const closeDialog = () => { - dispatch(closeCreateRuleDialog()); + dispatch(closeDeleteRuleDialog()); }; const handleDelete = () => { if (rule) { diff --git a/smart-frontend/app/src/store/adh/actions/actionsActionsSlice.ts b/smart-frontend/app/src/store/adh/actions/actionsActionsSlice.ts index c162537ed7..12f34810e3 100644 --- a/smart-frontend/app/src/store/adh/actions/actionsActionsSlice.ts +++ b/smart-frontend/app/src/store/adh/actions/actionsActionsSlice.ts @@ -27,10 +27,10 @@ import { AdhActionsApi } from '@api'; const createAction = createAsyncThunk('adh/actionsActions/createAction', async (text: string, thunkAPI) => { thunkAPI.dispatch(setIsActionInProgress(true)); - thunkAPI.dispatch(closeCreateActionDialog()); try { await AdhActionsApi.createAction(text); thunkAPI.dispatch(showSuccess({ message: 'New action was performed successfully' })); + thunkAPI.dispatch(closeCreateActionDialog()); } catch (error) { thunkAPI.dispatch(showError({ message: getErrorMessage(error as RequestError) })); return thunkAPI.rejectWithValue(error); @@ -41,11 +41,11 @@ const createAction = createAsyncThunk('adh/actionsActions/createAction', async ( const repeatAction = createAsyncThunk('adh/actionsActions/repeatAction', async (text: string, thunkAPI) => { thunkAPI.dispatch(setIsActionInProgress(true)); - thunkAPI.dispatch(closeUpdateActionDialog()); try { // in really, repeat action is recreate new action await AdhActionsApi.createAction(text); thunkAPI.dispatch(showSuccess({ message: 'Action was repeated successfully' })); + thunkAPI.dispatch(closeUpdateActionDialog()); } catch (error) { thunkAPI.dispatch(showError({ message: getErrorMessage(error as RequestError) })); return thunkAPI.rejectWithValue(error); diff --git a/smart-frontend/app/src/store/adh/rules/rulesActionsSlice.ts b/smart-frontend/app/src/store/adh/rules/rulesActionsSlice.ts index b7a45e0bff..b0712f8b47 100644 --- a/smart-frontend/app/src/store/adh/rules/rulesActionsSlice.ts +++ b/smart-frontend/app/src/store/adh/rules/rulesActionsSlice.ts @@ -29,9 +29,9 @@ import type { PayloadAction } from '@reduxjs/toolkit'; const createRule = createAsyncThunk('adh/rulesActions/createRule', async (text: string, thunkAPI) => { thunkAPI.dispatch(setIsActionInProgress(true)); - thunkAPI.dispatch(closeCreateRuleDialog()); try { await AdhRulesApi.createRule(text); + thunkAPI.dispatch(closeCreateRuleDialog()); thunkAPI.dispatch(showSuccess({ message: 'New rule was created and applied successfully' })); } catch (error) { thunkAPI.dispatch(showError({ message: getErrorMessage(error as RequestError) }));