refactor(create-form-1-2): 🎉 update create form functions

robolaunch · Oct 25, 2023 · 6ea9f96 · 6ea9f96
1 parent 9dc59ce
commit 6ea9f96
Show file tree

Hide file tree

Showing 7 changed files with 123 additions and 76 deletions.
diff --git a/src/components/CreateFormWorkspaces/CreateFormWorkspaces.tsx b/src/components/CreateFormWorkspaces/CreateFormWorkspaces.tsx
@@ -0,0 +1,44 @@
+import React, { Fragment, ReactElement } from "react";
+import useCreateRobot from "../../hooks/useCreateRobot";
+import CreateRobotFormWorkspaceItem from "../CreateRobotFormWorkspaceItem/CreateRobotFormWorkspaceItem";
+import { FormikProps } from "formik";
+import {
+  IRobotWorkspace,
+  IRobotWorkspaces,
+} from "../../interfaces/robotInterfaces";
+
+interface ICreateFormWorkspaces {
+  formik: FormikProps<IRobotWorkspaces>;
+  responseRobot: any;
+  isImportRobot?: boolean;
+}
+
+export default function CreateFormWorkspaces({
+  formik,
+  responseRobot,
+  isImportRobot,
+}: ICreateFormWorkspaces): ReactElement {
+  const { robotData } = useCreateRobot();
+
+  return (
+    <Fragment>
+      {robotData?.step2?.workspaces?.map(
+        (workspace: IRobotWorkspace, workspaceIndex: number) => {
+          return (
+            <CreateRobotFormWorkspaceItem
+              key={workspaceIndex}
+              formik={formik}
+              workspace={workspace}
+              workspaceIndex={workspaceIndex}
+              workspaceState={responseRobot?.robotClusters?.map(
+                (cluster: any) => cluster.robotStatus,
+              )}
+              disabled={formik.isSubmitting || isImportRobot}
+              isImportRobot={isImportRobot}
+            />
+          );
+        },
+      )}
+    </Fragment>
+  );
+}
diff --git a/src/components/CreateForms/CreateRobotFormStep1.tsx b/src/components/CreateForms/CreateRobotFormStep1.tsx
@@ -2,17 +2,15 @@ import React, { Fragment, ReactElement, useEffect, useState } from "react";
 import { envOnPremiseRobot } from "../../helpers/envProvider";
 import CreateRobotRosDistrobutions from "../CreateRobotRosDistrobutions/CreateRobotRosDistrobutions";
 import CreateRobotFormCancelButton from "../CreateRobotFormCancelButton/CreateRobotFormCancelButton";
-import { CreateRobotFormStep1Validations } from "../../validations/RobotsValidations";
 import CreateRobotFormLoader from "../CreateRobotFormLoader/CreateRobotFormLoader";
+import { CreateRobotFormStep1Validations } from "../../validations/RobotsValidations";
 import CreateRobotStorage from "../CreateRobotStorage/CreateRobotStorage";
-import { addPhysicalInstanceToFleet } from "../../toolkit/InstanceSlice";
 import CreateRobotTypes from "../CreateRobotTypes/CreateRobotTypes";
 import { getGuideItem } from "../../functions/handleGuide";
+import FormInputText from "../FormInputText/FormInputText";
 import useCreateRobot from "../../hooks/useCreateRobot";
-import { createRobot } from "../../toolkit/RobotSlice";
 import InputToggle from "../InputToggle/InputToggle";
 import useFunctions from "../../hooks/useFunctions";
-import { useAppDispatch } from "../../hooks/redux";
 import TourGuide from "../TourGuide/TourGuide";
 import Seperator from "../Seperator/Seperator";
 import { useParams } from "react-router-dom";
@@ -21,7 +19,6 @@ import InfoTip from "../InfoTip/InfoTip";
 import Button from "../Button/Button";
 import { useFormik } from "formik";
 import { toast } from "sonner";
-import FormInputText from "../FormInputText/FormInputText";
 
 interface ICreateRobotFormStep1 {
   isImportRobot?: boolean;
@@ -33,8 +30,8 @@ export default function CreateRobotFormStep1({
   const { robotData, setRobotData } = useCreateRobot();
   const { selectedState, handleCreateRobotNextStep } = useMain();
   const [responseRobot, setResponseRobot] = useState<any>(undefined);
-  const dispatch = useAppDispatch();
-  const { getRobot, getEnvironment } = useFunctions();
+  const { getRobot, getEnvironment, updateRobot, addPhysicalInstanceToFleet } =
+    useFunctions();
   const url = useParams();
 
   useEffect(() => {
@@ -87,29 +84,7 @@ export default function CreateRobotFormStep1({
       formik.setSubmitting(true);
 
       if (isImportRobot) {
-        await dispatch(
-          createRobot({
-            organizationId: selectedState?.organization?.organizationId!,
-            roboticsCloudName: selectedState?.roboticsCloud?.name!,
-            instanceId: selectedState?.instance?.instanceId,
-            region: selectedState?.roboticsCloud?.region!,
-            fleetName: selectedState?.fleet?.name,
-            robotName: formik.values?.robotName,
-            physicalInstanceName: robotData?.step1?.isVirtualRobot
-              ? undefined
-              : robotData?.step1?.physicalInstanceName,
-            distributions: formik.values?.rosDistros,
-            bridgeEnabled: formik.values?.isEnabledROS2Bridge,
-            vdiEnabled: formik.values?.remoteDesktop?.isEnabled,
-            vdiSessionCount: formik.values?.remoteDesktop?.sessionCount,
-            ideEnabled: formik.values?.isEnabledIde,
-            storageAmount: formik.values?.robotStorage,
-            gpuEnabledForCloudInstance:
-              formik.values?.gpuEnabledForCloudInstance,
-            workspaces: responseRobot?.robotWorkspaces,
-          }),
-        );
-
+        updateRobot();
         toast.success(
           "Robot updated successfully. Redirecting to fleet page...",
         );
@@ -120,18 +95,11 @@ export default function CreateRobotFormStep1({
             ?.name}/${selectedState?.fleet?.name}/${robotData?.step1
             ?.robotName}}`;
         }, 2000);
-      } else if (!formik.values?.isVirtualRobot) {
-        await dispatch(
-          addPhysicalInstanceToFleet({
-            organizationId: selectedState?.organization?.organizationId,
-            roboticsCloudName: selectedState?.roboticsCloud?.name,
-            instanceId: selectedState?.instance?.instanceId,
-            region: selectedState?.roboticsCloud?.region,
-            robolaunchPhysicalInstancesName:
-              formik.values?.physicalInstanceName,
-            robolaunchFederatedFleetsName: selectedState?.fleet?.name,
-          }),
-        );
+        return;
+      }
+
+      if (!formik.values?.isVirtualRobot) {
+        addPhysicalInstanceToFleet();
       }
 
       formik.setSubmitting(false);

diff --git a/src/components/CreateForms/CreateRobotFormStep2.tsx b/src/components/CreateForms/CreateRobotFormStep2.tsx
@@ -3,25 +3,25 @@ import {
   envOnPremiseFleet,
   envOnPremiseRobot,
 } from "../../helpers/envProvider";
-import CreateRobotFormWorkspaceItem from "../CreateRobotFormWorkspaceItem/CreateRobotFormWorkspaceItem";
 import CreateRobotFormCancelButton from "../CreateRobotFormCancelButton/CreateRobotFormCancelButton";
 import { CreateEnvironmentFormStep2Validations } from "../../validations/EnvironmentsValidations";
 import CreateRobotFormAddButton from "../CreateRobotFormAddButton/CreateRobotFormAddButton";
-import { CreateRobotFormStep2Validations } from "../../validations/RobotsValidations";
 import CreateRobotFormLoader from "../CreateRobotFormLoader/CreateRobotFormLoader";
+import CreateFormWorkspaces from "../CreateFormWorkspaces/CreateFormWorkspaces";
+import { CreateRobotFormStep2Validations } from "../../validations/RobotsValidations";
 import { IRobotWorkspaces } from "../../interfaces/robotInterfaces";
 import { createEnvironment } from "../../toolkit/EnvironmentSlice";
+import { getGuideItem } from "../../functions/handleGuide";
 import useCreateRobot from "../../hooks/useCreateRobot";
 import { createRobot } from "../../toolkit/RobotSlice";
 import useFunctions from "../../hooks/useFunctions";
 import { useAppDispatch } from "../../hooks/redux";
 import { FormikProps, useFormik } from "formik";
+import TourGuide from "../TourGuide/TourGuide";
 import { useParams } from "react-router-dom";
 import useMain from "../../hooks/useMain";
 import Button from "../Button/Button";
 import { toast } from "sonner";
-import TourGuide from "../TourGuide/TourGuide";
-import { getGuideItem } from "../../functions/handleGuide";
 
 interface ICreateRobotFormStep2 {
   isImportRobot?: boolean;
@@ -31,14 +31,14 @@ export default function CreateRobotFormStep2({
   isImportRobot,
 }: ICreateRobotFormStep2): ReactElement {
   const [responseFleet, setResponseFleet] = useState<any>(undefined);
+  const [responseRobot, setResponseRobot] = useState<any>(undefined);
   const { selectedState, handleCreateRobotNextStep, setSidebarState } =
     useMain();
   const { robotData, setRobotData, handleAddWorkspaceStep } = useCreateRobot();
-  const dispatch = useAppDispatch();
   const [isLoadingImportRobot, setIsLoadingImportRobot] =
     useState<boolean>(true);
   const { getRobot, getFleet, getEnvironment, getNamespace } = useFunctions();
-  const [responseRobot, setResponseRobot] = useState<any>(undefined);
+  const dispatch = useAppDispatch();
   const url = useParams();
 
   const formik: FormikProps<IRobotWorkspaces> = useFormik<IRobotWorkspaces>({
@@ -286,23 +286,11 @@ export default function CreateRobotFormStep2({
           data-tut="create-robot-step2-workspaces"
           className="flex flex-col gap-2"
         >
-          {robotData?.step2?.workspaces?.map(
-            (workspace: any, workspaceIndex: number) => {
-              return (
-                <CreateRobotFormWorkspaceItem
-                  key={workspaceIndex}
-                  formik={formik}
-                  workspace={workspace}
-                  workspaceIndex={workspaceIndex}
-                  workspaceState={responseRobot?.robotClusters?.map(
-                    (cluster: any) => cluster.robotStatus,
-                  )}
-                  disabled={formik.isSubmitting || isImportRobot}
-                  isImportRobot={isImportRobot}
-                />
-              );
-            },
-          )}
+          <CreateFormWorkspaces
+            formik={formik}
+            responseRobot={responseRobot}
+            isImportRobot={isImportRobot}
+          />
         </div>
 
         <div data-tut="create-robot-step2-workspace-add-button">

diff --git a/src/components/CreateForms/CreateRobotFormStep3.tsx b/src/components/CreateForms/CreateRobotFormStep3.tsx
@@ -6,20 +6,20 @@ import CreateRobotFormAddButton from "../CreateRobotFormAddButton/CreateRobotFor
 import CreateRobotFormLoader from "../CreateRobotFormLoader/CreateRobotFormLoader";
 import { IRobotBuildSteps } from "../../interfaces/robotInterfaces";
 import { createBuildManager } from "../../toolkit/RobotSlice";
+import { getGuideItem } from "../../functions/handleGuide";
 import useCreateRobot from "../../hooks/useCreateRobot";
 import SidebarInfo from "../SidebarInfo/SidebarInfo";
 import useFunctions from "../../hooks/useFunctions";
 import { useAppDispatch } from "../../hooks/redux";
 import InputError from "../InputError/InputError";
 import { FormikProps, useFormik } from "formik";
 import InputText from "../InputText/InputText";
+import TourGuide from "../TourGuide/TourGuide";
 import useMain from "../../hooks/useMain";
 import InfoTip from "../InfoTip/InfoTip";
 import Button from "../Button/Button";
 import { toast } from "sonner";
 import * as Yup from "yup";
-import TourGuide from "../TourGuide/TourGuide";
-import { getGuideItem } from "../../functions/handleGuide";
 
 interface ICreateRobotFormStep3 {
   isImportRobot?: boolean;

diff --git a/src/components/CreateForms/CreateRobotFormStep4.tsx b/src/components/CreateForms/CreateRobotFormStep4.tsx
@@ -11,12 +11,14 @@ import CreateRobotFormEnvItem from "../CreateRobotFormEnvItem/CreateRobotFormEnv
 import CreateRobotFormLoader from "../CreateRobotFormLoader/CreateRobotFormLoader";
 import { organizationNameViewer } from "../../functions/GeneralFunctions";
 import { createLaunchManager } from "../../toolkit/RobotSlice";
+import { getGuideItem } from "../../functions/handleGuide";
 import useCreateRobot from "../../hooks/useCreateRobot";
 import InputSelect from "../InputSelect/InputSelect";
 import useFunctions from "../../hooks/useFunctions";
 import { useAppDispatch } from "../../hooks/redux";
 import InputError from "../InputError/InputError";
 import { FormikProps, useFormik } from "formik";
+import TourGuide from "../TourGuide/TourGuide";
 import InputText from "../InputText/InputText";
 import { Editor } from "@monaco-editor/react";
 import { useParams } from "react-router-dom";
@@ -25,8 +27,6 @@ import InfoTip from "../InfoTip/InfoTip";
 import Button from "../Button/Button";
 import { toast } from "sonner";
 import * as Yup from "yup";
-import TourGuide from "../TourGuide/TourGuide";
-import { getGuideItem } from "../../functions/handleGuide";
 
 interface ICreateRobotFormStep4 {
   isImportRobot?: boolean;
@@ -322,9 +322,6 @@ export default function CreateRobotFormStep4({
                     ],
               });
             }}
-            isVisiblePhysicalInstanceCheckbox={
-              robotData?.step1?.physicalInstanceName
-            }
             error={
               // @ts-ignore
               formik?.errors?.instancesName

diff --git a/src/contexts/FunctionsContext.tsx b/src/contexts/FunctionsContext.tsx
@@ -27,6 +27,7 @@ import {
   getRobots as getRobotsDispatch,
   getBuildManagers as getBuildManagerDispatch,
   getLaunchManagers as getLaunchManagerDispatch,
+  createRobot as createRobotDispatch,
 } from "../toolkit/RobotSlice";
 import {
   getFederatedFleets,
@@ -42,7 +43,10 @@ import {
   getEnvironment as getEnvironmentDispatch,
 } from "../toolkit/EnvironmentSlice";
 import { getRoboticsClouds as getRoboticsCloudDispatch } from "../toolkit/RoboticsCloudSlice";
-import { getPhysicalInstances as getAllPhysicalInstances } from "../toolkit/InstanceSlice";
+import {
+  getPhysicalInstances as getAllPhysicalInstances,
+  addPhysicalInstanceToFleet as addPhysicalInstanceToFleetDispatch,
+} from "../toolkit/InstanceSlice";
 import { getOrganizations as getAllOrganizations } from "../toolkit/OrganizationSlice";
 import { getInstances as getAllInstances } from "../toolkit/InstanceSlice";
 import { getIP as getCurrentIP } from "../toolkit/TrialSlice";
@@ -59,10 +63,15 @@ export const FunctionsContext: any = createContext<any>(null);
 // eslint-disable-next-line
 export default ({ children }: any) => {
   const dispatch = useAppDispatch();
-  const { setTrialState, setSelectedState, pagesState, setPagesState } =
-    useMain();
+  const {
+    setTrialState,
+    selectedState,
+    setSelectedState,
+    pagesState,
+    setPagesState,
+  } = useMain();
   const navigate = useNavigate();
-  const { setRobotData } = useCreateRobot();
+  const { robotData, setRobotData } = useCreateRobot();
 
   async function getOrganizations(parameters?: ImultipleGetParameters) {
     await dispatch(getAllOrganizations()).then((organizationsResponse: any) => {
@@ -1151,6 +1160,43 @@ export default ({ children }: any) => {
     });
   }
 
+  async function addPhysicalInstanceToFleet() {
+    await dispatch(
+      addPhysicalInstanceToFleetDispatch({
+        organizationId: selectedState?.organization?.organizationId,
+        roboticsCloudName: selectedState?.roboticsCloud?.name,
+        instanceId: selectedState?.instance?.instanceId,
+        region: selectedState?.roboticsCloud?.region,
+        robolaunchFederatedFleetsName: selectedState?.fleet?.name,
+        robolaunchPhysicalInstancesName: robotData.step1.physicalInstanceName,
+      }),
+    );
+  }
+
+  async function updateRobot() {
+    await dispatch(
+      createRobotDispatch({
+        organizationId: selectedState?.organization?.organizationId!,
+        roboticsCloudName: selectedState?.roboticsCloud?.name!,
+        instanceId: selectedState?.instance?.instanceId,
+        region: selectedState?.roboticsCloud?.region!,
+        fleetName: selectedState?.fleet?.name,
+        robotName: robotData.step1.robotName,
+        physicalInstanceName: robotData?.step1?.isVirtualRobot
+          ? undefined
+          : robotData?.step1?.physicalInstanceName,
+        distributions: robotData.step1.rosDistros,
+        bridgeEnabled: robotData.step1.isEnabledROS2Bridge,
+        vdiEnabled: robotData.step1.remoteDesktop.isEnabled,
+        vdiSessionCount: robotData.step1.remoteDesktop.sessionCount,
+        ideEnabled: robotData.step1.isEnabledIde,
+        storageAmount: robotData.step1.robotStorage,
+        gpuEnabledForCloudInstance: robotData.step1.gpuEnabledForCloudInstance,
+        workspaces: robotData.step2.workspaces,
+      }),
+    );
+  }
+
   async function getIP() {
     await dispatch(getCurrentIP()).then((response: any) => {
       setTrialState((prevState: any) => {
@@ -1188,6 +1234,8 @@ export default ({ children }: any) => {
         getLaunchManagers,
         getEnvironments,
         getEnvironment,
+        addPhysicalInstanceToFleet,
+        updateRobot,
         getIP,
       }}
     >

diff --git a/src/interfaces/useFunctionsInterfaces.ts b/src/interfaces/useFunctionsInterfaces.ts
@@ -208,6 +208,8 @@ export interface IuseFunctions {
     values: IgetEnvironmentRequest,
     parameters?: IsingleGetEnviromentParameters,
   ) => void;
+  addPhysicalInstanceToFleet: () => void;
+  updateRobot: () => void;
   getIP: () => void;
   handleSetterCurrentOrganization: (
     urlOrganizationName: string | undefined,