Merge pull request #6 from xkiso/master

Fixed Async Database Issue

Author: patpat20

app/context/ApplicationContext.tsx

@@ -19,8 +19,20 @@ const ApplicationContextProvider: React.FC = ({ children }) => {
   /**
    * Connect to database provided by user at 'index'
    */
-  const connectToDB = async (index: number) => {
+  const connectToDB = async (index: number, application: string) => {
+    ipcRenderer.removeAllListeners('databaseConnected');
     await ipcRenderer.send('connect', index);
+    console.log(`${__dirname}/ApplicationContext.tsx/connectToDB: ** between connect & servicesRequest`);
+    
+    // Response
+    ipcRenderer.on('databaseConnected', (event: Electron.Event, data: any) => {
+      // Parse JSON response
+      const result = data;
+      if (result.length)
+        console.log(`${__dirname}/ApplicationContext.tsx/connectToDB: ${result}`);
+
+      fetchServicesNames(application);
+    });
   };
 
   /**
@@ -39,6 +51,7 @@ const ApplicationContextProvider: React.FC = ({ children }) => {
 
       // Set local state
       setServicesData(result);
+      ipcRenderer.removeAllListeners('servicesResponse');
     });
   };
 

app/modals/ServicesModal.tsx

@@ -19,28 +19,16 @@ const ServicesModal: React.SFC<ServicesModalProps> = ({ i, app }) => {
   );
 
   useEffect(() => {
-    connectToDB(i);
-    fetchServicesNames(app);
+    connectToDB(i, app);
+    // fetchServicesNames(app);
 
     return () => {
       setServicesData([]);
     };
   }, [i]);
 
-  /**
-   * TEMPORARY fix to allow us to fetch service names
-   * AFTER we connect to the Mongo Database. This error does
-   * not occur with PostgreSQL databases.
-   *
-   * Just click on the whitespace of the modal to run another
-   * fetch request for service names
-   */
-  const fetchStuff = () => {
-    fetchServicesNames(app);
-  };
-
   return (
-    <div className="servicesContainer" onClick={() => fetchStuff()}>
+    <div className="services-container">
       {!servicesData.length ? (
         <div className="loadingMessageModal">
           <h2 id="loadingMessage">Loading...</h2>

electron/databases/mongo.ts

@@ -2,14 +2,21 @@ import mongoose from 'mongoose';
 import { MongoError } from 'mongodb';
 
 // Mongoose connection wrapped in function that takes the index of the selected database as the parameter. This index is used to target the correct database for querying.
-const connectMongoose = (i: number, URI: string) => {
-  return mongoose.connect(
-    URI,
-    { useNewUrlParser: true, useUnifiedTopology: true },
-    (err: MongoError) => {
-      if (err) console.log(err);
-      console.log('Connected to Mongo database!');
-    }
-  );
+const connectMongoose = async (i: number, URI: string) => {
+  try {
+    const db = await mongoose.connect(
+      URI,
+      { useNewUrlParser: true, useUnifiedTopology: true }
+      // ,
+      // (err: MongoError) => {
+      //   if (err) console.log(err);
+      //   console.log('Connected to Mongo database!');
+      // }
+    );
+    console.log(`${__dirname}/mongo.ts/connectMongoose: connected!`);
+    return db;
+  } catch(err) {
+    console.log(`${__dirname}/mongo.ts/connectMongoose: ${err}`);
+  }
 };
 export default connectMongoose;

electron/routes/data.ts

@@ -21,7 +21,7 @@ let currentDatabaseType: string;
  */
 ipcMain.on('connect', async (message: Electron.IpcMainEvent, index: number) => {
   try {
-    console.log('Attempting to connect to DB');
+    console.log('electron/routes/data.ts, ipcMain.on(connect): 1 Attempting to connect to DB');
     // Extract databaseType and URI from settings.json at particular index
     // get index from application context
     const fileContents = fs.readFileSync(path.resolve(__dirname, '../user/settings.json'), 'utf8');
@@ -30,14 +30,18 @@ ipcMain.on('connect', async (message: Electron.IpcMainEvent, index: number) => {
     // We get index from sidebar container: which is the mapplication (DEMO)
     const [databaseType, URI] = [userDatabase[1], userDatabase[2]];
 
+    console.log('electron/routes/data.ts, ipcMain.on(connect): 2 pre-connect');
+
     // Connect to the proper database
     if (databaseType === 'MongoDB') await connectMongo(index, URI);
     if (databaseType === 'SQL') pool = await connectPostgres(index, URI);
 
-    console.log('connected?');
+    console.log('electron/routes/data.ts, ipcMain.on(connect): 3 connected');
 
     // Currently set to a global variable
     currentDatabaseType = databaseType;
+
+    message.sender.send('databaseConnected', 'connected!');
   } catch ({ message }) {
     console.log('Error in "connect" event', message);
   }
@@ -49,7 +53,7 @@ ipcMain.on('connect', async (message: Electron.IpcMainEvent, index: number) => {
  */
 ipcMain.on('servicesRequest', async (message: Electron.IpcMainEvent) => {
   try {
-    console.log('Requesting application microservices');
+    console.log('electron/routes/data.ts, ipcMain.on(servicesRequest): 4 Requesting application microservices');
     let result: any;
 
     // Mongo Database

electron/user/settings.json

@@ -1,27 +1,21 @@
 {
   "setupRequired": false,
   "services": [
-    [
-      "myPostgres",
-      "SQL",
-      "postgres://zwezmnqm:[email protected]:5432/zwezmnqm",
-      "Online bookstore with that keeps track of orders and customers",
-      "Jun 28, 2020 4:58 PM"
-    ],
-    [
-      "myMongo",
-      "MongoDB",
-      "mongodb+srv://chronos:[email protected]/chronos?retryWrites=true&w=majority",
-      "E-commerce website for buying and selling clothes",
-      "Jul 01, 2020 10:33 PM"
-    ],
     [
       "ToddDB",
       "MongoDB",
       "mongodb+srv://tdwolf6:[email protected]/Chronos?retryWrites=true&w=majority",
       "Web app deployed on AWS",
       "Jul 3, 2020 7:12AM"
     ],
+    [
+
+      "myPostgres",
+      "SQL",
+      "postgres://zwezmnqm:[email protected]:5432/zwezmnqm",
+      "Online bookstore with that keeps track of orders and customers",
+      "Jun 28, 2020 4:58 PM"
+     ],
     [
       "pattyDB",
       "MongoDB",