Multple cards can now be added at once

Inside of application context add app was adjusted to
render multiple cards at once. Each cards data is added
to an object that is iterated over

Author: mdtagg

app/containers/SidebarContainer.tsx

@@ -32,34 +32,39 @@ const SidebarContainer = React.memo(() => {
 
     setExample(true)
 
-    // const examplesData = {
-    //   microServicesFields: {
-    //     typeOfService: 'Microservices',
-    //     database: 'MongoDB',
-    //     URI: "mongodb://127.0.0.1:27017/?directConnection=true&serverSelectionTimeoutMS=2000&appName=mongosh+2.2.5",
-    //     name: 'Microservices',
-    //     description: 'Example'
-    //   },
-      
-    //   ,
-    //   dockerData: {
-    //     typeOfService: 'Docker',
-    //     database: 'MongoDB',
-    //     URI: "mongodb://127.0.0.1:27017/?directConnection=true&serverSelectionTimeoutMS=2000&appName=mongosh+2.2.5",
-    //     name: 'Docker',
-    //     description: 'Example'
-    //   }
-    // }
-    
-    const fields = {
-      typeOfService: 'Microservices',
-      database: 'MongoDB',
-      URI: "mongodb://127.0.0.1:27017/?directConnection=true&serverSelectionTimeoutMS=2000&appName=mongosh+2.2.5",
-      name: 'Microservices',
-      description: 'Example'
+    const examplesData = {
+      microServicesMongoFields: {
+        typeOfService: 'Microservices',
+        database: 'MongoDB',
+        URI: "mongodb://127.0.0.1:27017/?directConnection=true&serverSelectionTimeoutMS=2000&appName=mongosh+2.2.5",
+        name: 'Microservices-Mongo',
+        description: 'Mongo Microservices Example'
+      },
+      microServicesSQLFields: {
+        typeOfService: 'Microservices',
+        database: 'SQL',
+        URI: "mongodb://127.0.0.1:27017/?directConnection=true&serverSelectionTimeoutMS=2000&appName=mongosh+2.2.5",
+        name: 'Microservices-SQL',
+        description: 'SQL Microservices Example'
+      }
+      ,
+      dockerMongoData: {
+        typeOfService: 'Docker',
+        database: 'MongoDB',
+        URI: "mongodb://127.0.0.1:27017/?directConnection=true&serverSelectionTimeoutMS=2000&appName=mongosh+2.2.5",
+        name: 'Docker-Mongo',
+        description: 'Docker Example'
+      },
+      dockerSQLData: {
+        typeOfService: 'Docker',
+        database: 'SQL',
+        URI: "mongodb://127.0.0.1:27017/?directConnection=true&serverSelectionTimeoutMS=2000&appName=mongosh+2.2.5",
+        name: 'Docker-SQL',
+        description: 'Docker Example'
+      }
     }
 
-    addApp(fields)
+    addApp(examplesData)
   }
 
   const handleExitExample = () => {

app/context/DashboardContext.tsx

@@ -57,15 +57,19 @@ const DashboardContextProvider = React.memo((props: any) => {
   }, []);
 
   const addApp = useCallback((fields: IFields) => {
-    const { typeOfService, database, URI, name, description } = fields;
 
-    const result = ipcRenderer.sendSync(
-      'addApp',
-      JSON.stringify([name, database, URI, description, typeOfService])
-    );
-    setApplications(result);
-    // console.log({result})
-    // console.log('the current application that was added is : ', result);
+    for(let field of Object.keys(fields)) {
+      const { typeOfService, database, URI, name, description } = fields[field];
+      const result = ipcRenderer.sendSync(
+        'addApp',
+        JSON.stringify([name, database, URI, description, typeOfService])
+      );
+      setApplications(result);
+      // console.log({result})
+      // console.log('the current application that was added is : ', result);
+    }
+    
+    
   }, []);
 
   const addAwsApp = useCallback((awsFields: AwsFields) => {

app/modals/AddModal/AddModal.tsx

@@ -39,7 +39,7 @@ const AddModal: React.FC<TModalSetter> = React.memo(({ setModal }) => {
     event.preventDefault();
     // const newApp = [name, database, URI, description, typeOfService];
     // setApplications(prev => [...prev, ...newApp])
-    addApp(fields);
+    addApp({fields});
     setModal({isOpen:false,type:''})
   };