chore: remove unused modules, minor cleanup

services/frontend/.eslintrc

@@ -15,6 +15,9 @@
     "no-console": 1, // Means warning
     "prettier/prettier": 2, // Means error
     "no-empty-function": 1,
-    "@typescript-eslint/no-empty-function": 1
+    "@typescript-eslint/no-empty-function": 1,
+    "@typescript-eslint/no-explicit-any": [
+      "off"
+    ]
   }
 }

services/frontend/package.json

@@ -18,9 +18,6 @@
     "@codemirror/search": "^0.19.0",
     "@codemirror/stream-parser": "^0.19.9",
     "@codemirror/view": "^0.19.0",
-    "@emotion/react": "^11.9.3",
-    "@emotion/styled": "^11.9.3",
-    "@headlessui/react": "^1.6.4",
     "@heroicons/react": "^1.0.5",
     "@jsplumb/browser-ui": "^5.5.2",
     "@jsplumb/common": "^5.5.2",
@@ -38,7 +35,6 @@
     "d3": "^7.3.0",
     "formik": "^2.2.9",
     "lodash": "^4.17.21",
-    "random-words": "^1.2.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-hot-toast": "^2.2.0",

services/frontend/src/components/GridColumn.tsx

@@ -1,5 +1,5 @@
-import { styled } from "@mui/joy";
 import { FunctionComponent, ReactElement } from "react";
+import { styled } from "@mui/joy";
 import { useSuperForm } from "../hooks";
 import { IFormField } from "../types";
 

services/frontend/src/components/GridRow.tsx

@@ -1,5 +1,5 @@
-import { styled } from "@mui/joy";
 import { FunctionComponent, ReactElement, ReactNode } from "react";
+import { styled } from "@mui/joy";
 import { useSuperForm } from "../hooks";
 import { IFormField } from "../types";
 

services/frontend/src/components/Project/index.tsx

@@ -3,7 +3,6 @@ import { useParams } from "react-router-dom";
 import { debounce, Dictionary, omit } from "lodash";
 import YAML from "yaml";
 import { GlobeAltIcon, CubeIcon, FolderAddIcon } from "@heroicons/react/solid";
-import randomWords from "random-words";
 import {
   IProjectPayload,
   IServiceNodeItem,
@@ -79,14 +78,7 @@ export default function Project(props: IProjectProps) {
   const [nodes, setNodes] = useState<Record<string, any>>({});
   const [connections, setConnections] = useState<[[string, string]] | []>([]);
   const [networks, setNetworks] = useState<Record<string, any>>({});
-  const [projectName, setProjectName] = useState(
-    () =>
-      randomWords({
-        wordsPerString: 2,
-        exactly: 1,
-        separator: "-"
-      } as any)[0]
-  );
+  const [projectName, setProjectName] = useState("Untitled");
 
   const [canvasPosition, setCanvasPosition] = useState({
     top: 0,

services/frontend/src/components/Projects/index.tsx

@@ -49,7 +49,7 @@ const Projects = () => {
         />
       ) : null}
 
-      <div className="md:pl-16 flex flex-col flex-1">
+      <div className="md:pl-16 flex flex-col flex-1 h-screen">
         <main>
           <div className="py-6">
             <div className="flex flex-col sm:flex-row justify-between px-4 sm:px-6 md:px-8">

services/frontend/src/components/Records.tsx

@@ -1,5 +1,5 @@
-import { styled } from "@mui/joy";
 import { Fragment, FunctionComponent, ReactElement, useCallback } from "react";
+import { styled } from "@mui/joy";
 import {
   ChevronDownIcon,
   ChevronUpIcon,

services/frontend/src/components/ScrollView.tsx

@@ -1,5 +1,5 @@
-import { styled } from "@mui/joy";
 import { FunctionComponent, HTMLProps, ReactElement, ReactNode } from "react";
+import { styled } from "@mui/joy";
 
 export interface IScrollViewProps extends HTMLProps<HTMLDivElement> {
   children: ReactNode;

services/frontend/src/components/SuperForm.tsx

@@ -1,5 +1,5 @@
-import { styled } from "@mui/joy";
 import { FunctionComponent, ReactElement } from "react";
+import { styled } from "@mui/joy";
 import { useSuperForm } from "../hooks";
 import { IFormField, TFinalFormField } from "../types";
 

services/frontend/src/components/Tab.tsx

@@ -1,5 +1,4 @@
 import { useCallback } from "react";
-
 import { styled } from "@mui/joy";
 import { useTabContext } from "../hooks";
 

services/frontend/src/components/Tabs.tsx

@@ -1,5 +1,5 @@
-import { styled } from "@mui/joy";
 import { FunctionComponent, ReactElement, ReactNode } from "react";
+import { styled } from "@mui/joy";
 import { TabContext } from "../contexts";
 
 export interface ITabsProps {

services/frontend/src/components/global/FormElements/TextField.tsx

@@ -1,7 +1,7 @@
-import lodash from "lodash";
-import { useFormikContext } from "formik";
 import { FunctionComponent, ReactElement } from "react";
 import { styled } from "@mui/joy";
+import lodash from "lodash";
+import { useFormikContext } from "formik";
 
 export interface ITextFieldProps {
   name: string;

services/frontend/src/components/modals/docker-compose/network/CreateNetworkModal.tsx

@@ -1,10 +1,10 @@
 import { FunctionComponent, ReactElement, useMemo, useState } from "react";
 import { Formik } from "formik";
+import { Button, styled } from "@mui/joy";
 import General from "./General";
 import IPAM from "./IPAM";
 import { CallbackFunction } from "../../../../types";
 import { getInitialValues, tabs, validationSchema } from "./form-utils";
-import { Button, styled } from "@mui/joy";
 import { reportErrorsAndSubmit } from "../../../../utils/forms";
 import { ScrollView } from "../../../ScrollView";
 import Tabs from "../../../Tabs";

services/frontend/src/components/modals/docker-compose/network/EditNetworkModal.tsx

@@ -1,10 +1,10 @@
 import { useMemo, useState } from "react";
 import { Formik } from "formik";
+import { Button, styled } from "@mui/joy";
 import General from "./General";
 import IPAM from "./IPAM";
 import { CallbackFunction } from "../../../../types";
 import { getInitialValues, tabs, validationSchema } from "./form-utils";
-import { Button, styled } from "@mui/joy";
 import { reportErrorsAndSubmit } from "../../../../utils/forms";
 import { ScrollView } from "../../../ScrollView";
 import Tabs from "../../../Tabs";

services/frontend/src/components/modals/docker-compose/network/IPAM.tsx

@@ -1,6 +1,5 @@
 import { FunctionComponent, ReactElement } from "react";
 import { styled } from "@mui/joy";
-
 import TextField from "../../../global/FormElements/TextField";
 import { IFieldType } from "../../../Record";
 import Records from "../../../Records";

services/frontend/src/components/modals/docker-compose/network/index.tsx

@@ -1,4 +1,5 @@
 import { useCallback, useState } from "react";
+import { styled } from "@mui/joy";
 import CreateNetworkModal from "./CreateNetworkModal";
 import { CallbackFunction, IEditNetworkForm } from "../../../../types";
 import EditNetworkModal from "./EditNetworkModal";
@@ -6,7 +7,6 @@ import { attachUUID, toaster } from "../../../../utils";
 import { getFinalValues } from "./form-utils";
 import EmptyNetworks from "./EmptyNetworks";
 import NetworkList from "./NetworkList";
-import { styled } from "@mui/joy";
 import Modal from "../../../Modal";
 
 interface IModalNetworkProps {

services/frontend/src/components/modals/docker-compose/volume/General.tsx

@@ -1,5 +1,4 @@
 import { styled } from "@mui/joy";
-
 import TextField from "../../../global/FormElements/TextField";
 import Records from "../../../Records";
 

services/frontend/src/components/modals/import/index.tsx

@@ -37,7 +37,7 @@ const ModalImport = (props: IModalImportProps) => {
   const { onHide, onImport, importing } = props;
 
   const handleCreate = useCallback(
-    (values: IImportForm, formik: any) => {
+    (values: IImportForm) => {
       const result = getFinalValues(values);
       onImport(result);
       toaster(`Importing...`, "success");