Merge pull request #1396 from jdi-testing/issue_1344

issue 1344: improve versions errors handling

src/app/components/Guide.tsx

@@ -7,8 +7,8 @@ import { useDispatch, useSelector } from "react-redux";
 import readme from "../../../README.md";
 import { BackendStatus } from "../types/mainSlice.types";
 import { RootState } from "../store/store";
-import { defineServer } from "../reducers/defineServer.thunk";
 import { useGuideRehype } from "../utils/useGuideRehype";
+import { redefineServer } from "../reducers/redefineServer.thunk";
 
 const splitMD = (source: string) => source.match(/^#+ [^#]*/gm);
 
@@ -19,10 +19,8 @@ const serverGuide = (splittedMD: Array<string>) =>
 
 export const Guide = () => {
   const backendStatus = useSelector((_state: RootState) => _state.main.backendAvailable);
-  const step =
-    backendStatus === BackendStatus.OutdatedServerLocal || backendStatus === BackendStatus.AccessFailed ? 1 : 0;
-  const [isSettingsChecking, setSettingsChecking] = useState(false);
-  const [currentStep, setCurrentStep] = useState(step);
+  const isSettingsChecking = backendStatus === BackendStatus.Retry;
+  const [currentStep, setCurrentStep] = useState(0);
   const [pluginGuideComponent, setPluginGuide] = useGuideRehype();
   const [serverGuideComponent, setServerGuide] = useGuideRehype();
   const dispatch = useDispatch();
@@ -34,6 +32,13 @@ export const Guide = () => {
     setServerGuide(serverGuide(splittedMD));
   }, []);
 
+  useEffect(() => {
+    if (backendStatus === BackendStatus.Retry) return;
+    const _step =
+      backendStatus === BackendStatus.OutdatedServerLocal || backendStatus === BackendStatus.AccessFailed ? 1 : 0;
+    setCurrentStep(_step);
+  }, [backendStatus]);
+
   const steps = [
     {
       title: "Step 1",
@@ -65,8 +70,7 @@ export const Guide = () => {
   };
 
   const onCheckButtonClick = async () => {
-    setSettingsChecking(true);
-    dispatch(defineServer());
+    dispatch(redefineServer());
   };
 
   return (

src/app/main.slice.ts

@@ -3,6 +3,7 @@ import { defineServerReducer } from "./reducers/defineServer.thunk";
 import { PageObjectId } from "../features/pageObjects/types/pageObjectSlice.types";
 import { BackendStatus, MainState, Notification, PageType } from "./types/mainSlice.types";
 import { removeAllReducer } from "./reducers/removeAll.thunk";
+import { redefineServerReducer } from "./reducers/redefineServer.thunk";
 
 const initialState: MainState = {
   backendAvailable: BackendStatus.TryToAccess,
@@ -62,7 +63,7 @@ const mainSlice = createSlice({
     },
   },
   extraReducers: (builder) => {
-    defineServerReducer(builder), removeAllReducer(builder);
+    defineServerReducer(builder), redefineServerReducer(builder), removeAllReducer(builder);
   },
 });
 

src/app/reducers/defineServer.thunk.ts

@@ -4,7 +4,7 @@ import { toInteger } from "lodash";
 import { BackendStatus, BaseUrl, MainState } from "../types/mainSlice.types";
 import { LocalUrl, RemoteUrl } from "../utils/constants";
 import { HttpEndpoint, request } from "../../services/backend";
-import { compatibleBuildVer, compatibleMajorVer, compatibleMinorVer } from "../../common/constants/compatibleVersions";
+import { compatibleBuildVer, compatibleMajorVer, compatibleMinorVer } from "../utils/compatibleVersions";
 
 export const defineServer = createAsyncThunk("main/defineServer", async () => {
   const checkVersion = (request: Promise<AxiosResponse<BaseUrl>>, isRemote: boolean) =>

src/app/reducers/redefineServer.thunk.ts

@@ -0,0 +1,13 @@
+import { ActionReducerMapBuilder, createAsyncThunk } from "@reduxjs/toolkit";
+import { BackendStatus, MainState } from "../types/mainSlice.types";
+import { defineServer } from "./defineServer.thunk";
+
+export const redefineServer = createAsyncThunk("main/redefineServer", async (_, thunkApi) => {
+  thunkApi.dispatch(defineServer());
+});
+
+export const redefineServerReducer = (builder: ActionReducerMapBuilder<MainState>) => {
+  return builder.addCase(redefineServer.pending, (state) => {
+    state.backendAvailable = BackendStatus.Retry;
+  });
+};

src/app/types/mainSlice.types.ts

@@ -43,6 +43,7 @@ export enum BackendStatus {
   OutdatedPluginLocal = "Plugin version need to be updated.",
   IncompatibleVersionRemote = "Remote server version is incompatible. Please, update plugin",
   IncompatibleVersions = "Remote and local server versions are incompatible. Please, update plugin or local server, or try to connect the remote server.",
+  Retry = "Retrying...",
 }
 
 export enum PageType {