refactor(frontend): minor changes to make code more readable

services/frontend/src/components/Modal/Service/Create.tsx

@@ -7,7 +7,7 @@ import Environment from "./Environment";
 import Volumes from "./Volumes";
 import Labels from "./Labels";
 import { serviceConfigCanvasInitialValues } from "../../../utils";
-import { CallbackFunction, ICanvasConfig, IService } from "../../../types";
+import { CallbackFunction } from "../../../types";
 
 interface IModalServiceProps {
   onHide: CallbackFunction;
@@ -18,7 +18,6 @@ const ModalServiceCreate = (props: IModalServiceProps) => {
   const { onHide, onAddEndpoint } = props;
   const [openTab, setOpenTab] = useState("General");
   const handleCreate = (values: any, formik: any) => {
-    console.log(values);
     onAddEndpoint(values);
     formik.resetForm();
   };
@@ -103,7 +102,6 @@ const ModalServiceCreate = (props: IModalServiceProps) => {
               }}
               enableReinitialize={true}
               onSubmit={(values, formik) => {
-                console.log(values);
                 handleCreate(values, formik);
               }}
               validationSchema={validationSchema}
@@ -148,9 +146,7 @@ const ModalServiceCreate = (props: IModalServiceProps) => {
                     <button
                       className="btn-util"
                       type="button"
-                      onClick={() => {
+                      onClick={formik.submitForm}
-                        formik.submitForm();
-                      }}
                     >
                       Add
                     </button>

services/frontend/src/utils/index.ts

@@ -106,17 +106,10 @@ export const attachUUID = (key: string): string => {
   return key + "-" + uuidv4();
 };
 
-export const setNodeIcon = (nodeType: string) => {
+export const iconByNodeType: Record<string, string> = {
-  switch (nodeType) {
+  service: "ServerIcon",
-    case "service":
+  volume: "DatabaseIcon",
-      return "ServerIcon";
+  network: "ChipIcon"
-    case "volume":
-      return "DatabaseIcon";
-    case "network":
-      return "ChipIcon";
-    default:
-      return "ServerIcon";
-  }
 };
 
 export const getClientNodeItem = (
@@ -129,7 +122,8 @@ export const getClientNodeItem = (
     nodeItem.canvasConfig.node_icon &&
     nodeItem.canvasConfig.node_icon.length === 0
   ) {
-    nodeItem.canvasConfig.node_icon = setNodeIcon(nodeItem.type);
+    nodeItem.canvasConfig.node_icon =
+      iconByNodeType[nodeItem.type] || "ServerIcon";
   }
 
   return {