refactor grpc input to disallow nodeIntegration

Author: nickhealy

main.js

@@ -40,6 +40,9 @@ const { InMemoryCache } = require("apollo-cache-inmemory");
 const { createHttpLink } = require("apollo-link-http");
 const { ApolloLink } = require("apollo-link");
 
+// proto-parser func for parsing .proto files
+const protoParserFunc = require('./src/client/protoParser.js');
+
 // require menu file
 require("./menu/mainMenu");
 
@@ -481,6 +484,36 @@ ipcMain.on('confirm-clear-history', (event) => {
     mainWindow.webContents.send('clear-history-response', response)
   })
   .catch(err => console.log(`Error on 'confirm-clear-history': ${err}`)); 
+});
+
+ipcMain.on('import-proto', (event) => {
+  console.log('import-proto event fired!!')
+  let importedProto;
+  dialog.showOpenDialog({
+    buttonLabel : "Import Proto File",
+    properties: ['openFile', 'multiSelections'],
+    filters: [ { name: 'Protos', extensions: ['proto'] } ]
+  })
+  .then(filePaths => {
+    if (!filePaths) return undefined;
+    // read uploaded proto file & save protoContent in the store
+    fs.readFile(filePaths.filePaths[0], 'utf-8', (err, file) => {
+      // handle read error
+      if (err) {
+        return console.log('error reading file : ', err);
+      };
+      importedProto = file; 
+      protoParserFunc(importedProto)
+      .then(protoObj => {
+        console.log('finished with logic. about to send importedProto : ', importedProto, ' and protoObj : ', protoObj)
+        mainWindow.webContents.send('proto-info', importedProto, protoObj)
+      })
+    });
+  })
+  .catch(err => {
+    console.log(err);
+  })
+ 
 })
 
 // ipcMain listener that

preload.js

@@ -4,15 +4,15 @@ contextBridge.exposeInMainWorld(
   'api', {
     send: (channel, data) => {
       // allowlist channels
-      const allowedChannels = ['toMain', 'confirm-clear-history' ];
+      const allowedChannels = ['toMain', 'confirm-clear-history', 'import-proto' ];
       if (allowedChannels.includes(channel)) {
         ipcRenderer.send(channel, data); 
       }
     },
     receive: (channel, cb) => {
       console.log('listening on channel : ', channel)
       // allowlist channels
-      const allowedChannels = ['fromMain', 'add-collection', 'clear-history-response'];
+      const allowedChannels = ['fromMain', 'add-collection', 'clear-history-response', 'proto-info'];
       if (allowedChannels.includes(channel)){
         ipcRenderer.on(channel, (event, ...args) => cb(...args));
       }

src/client/components/composer/ComposerContainer.jsx

@@ -3,7 +3,7 @@ import { connect } from "react-redux";
 import * as actions from "../../actions/actions";
 
 import ComposerNewRequest from "./NewRequest/ComposerNewRequest.jsx";
-import ComposerWarning from "./Warning/ComposerWarning.jsx";
+// import ComposerWarning from "./Warning/ComposerWarning.jsx";
 
 const mapStateToProps = (store) => ({
   reqResArray: store.business.reqResArray,
@@ -99,12 +99,12 @@ class ComposerContainer extends Component {
         break;
       }
       case "Warning": {
-        composerContents = (
-          <ComposerWarning
-            warningMessage={this.props.warningMessage}
-            setComposerDisplay={this.props.setComposerDisplay}
-          />
-        );
+        // composerContents = (
+        //   // <ComposerWarning
+        //   //   warningMessage={this.props.warningMessage}
+        //   //   setComposerDisplay={this.props.setComposerDisplay}
+        //   // />
+        // );
         break;
       }
       default:

src/client/components/composer/NewRequest/GRPCProtoEntryForm.jsx

@@ -1,10 +1,12 @@
 import React, { Component } from 'react';
-import { remote } from 'electron';
-import fs from 'fs';
+// import { remote } from 'electron';
+// import fs from 'fs';
 import GRPCAutoInputForm from "./GRPCAutoInputForm.jsx";
-import protoParserFunc from "../../../../client/protoParser.js";
+// import protoParserFunc from "../../../protoParser.js";
 import dropDownArrow from '../../../../assets/icons/arrow_drop_down_white_192x192.png';
 
+const { api } = window; 
+
 class GRPCProtoEntryForm extends Component {
   constructor(props) {
     super(props);
@@ -44,30 +46,43 @@ class GRPCProtoEntryForm extends Component {
         protoContent: ''
       });
     }
-    // use electron dialog to import files that has .proto ext only
-    remote.dialog.showOpenDialog({
-      buttonLabel : "Import Proto File",
-      properties: ['openFile', 'multiSelections'],
-      filters: [ { name: 'Protos', extensions: ['proto'] } ]
-    })
-    .then(filePaths => {
-      if (!filePaths) return;
-      // read uploaded proto file & save protoContent in the store
-      const importedProto = fs.readFileSync(filePaths.filePaths[0], 'utf-8');
+
+    api.receive('proto-info', (readProto, parsedProto) => {
+      console.log('received from main readProto : ', readProto, 'and parsed Proto : ', parsedProto)
       this.props.setNewRequestStreams({
         ...this.props.newRequestStreams,
-        protoContent: importedProto
+        protoContent: readProto,
+        services: parsedProto.serviceArr,
+        protoPath: parsedProto.protoPath
       });
-      // parse proto file via protoParserFunc imported from protoParser.js & save parsed proto file details in the store
-      protoParserFunc(this.props.newRequestStreams.protoContent)
-      .then(data => {
-        this.props.setNewRequestStreams({
-          ...this.props.newRequestStreams,
-          services: data.serviceArr,
-          protoPath: data.protoPath
-        })
-      }).catch((err) => console.log(err));
     });
+
+    api.send('import-proto');
+
+    // // use electron dialog to import files that has .proto ext only
+    // remote.dialog.showOpenDialog({
+    //   buttonLabel : "Import Proto File",
+    //   properties: ['openFile', 'multiSelections'],
+    //   filters: [ { name: 'Protos', extensions: ['proto'] } ]
+    // })
+    // .then(filePaths => {
+    //   if (!filePaths) return;
+    //   // read uploaded proto file & save protoContent in the store
+    //   const importedProto = fs.readFileSync(filePaths.filePaths[0], 'utf-8');
+    //   this.props.setNewRequestStreams({
+    //     ...this.props.newRequestStreams,
+    //     protoContent: importedProto
+    //   });
+    //   // parse proto file via protoParserFunc imported from protoParser.js & save parsed proto file details in the store
+    //   protoParserFunc(this.props.newRequestStreams.protoContent)
+    //   .then(data => {
+    //     this.props.setNewRequestStreams({
+    //       ...this.props.newRequestStreams,
+    //       services: data.serviceArr,
+    //       protoPath: data.protoPath
+    //     })
+    //   }).catch((err) => console.log(err));
+    // });
   }
 
   // saves protoContent in the store whenever client make changes to proto file or pastes a copy

src/client/components/containers/SidebarContainer.jsx

@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
-// import ComposerContainer from '../composer/ComposerContainer.jsx';
+import ComposerContainer from '../composer/ComposerContainer.jsx';
 import HistoryContainer from './HistoryContainer.jsx';
-// import CollectionsContainer from './CollectionsContainer.jsx';
+import CollectionsContainer from './CollectionsContainer.jsx';
 
 class SidebarContainer extends Component {
   constructor(props) {
@@ -11,8 +11,8 @@ class SidebarContainer extends Component {
   render(props) {
     return (
       <div className="sidebar_composer-console">
-        {/* <ComposerContainer />
-        <CollectionsContainer /> */}
+        <ComposerContainer />
+        <CollectionsContainer />
         <HistoryContainer />
       </div>
     );

src/client/protoParser.js

@@ -2,7 +2,7 @@ const fs = require("fs");
 const grpc = require("@grpc/grpc-js");
 const protoLoader = require("@grpc/proto-loader");
 const path = require("path");
-const uuid = require("uuid");
+// const uuid = require("uuid");
 
 async function protoParserFunc(protoBodyData) {
   // define storage for .proto parsed content
@@ -169,4 +169,4 @@ async function protoParserFunc(protoBodyData) {
 
 // console.log(tempData);
 // protoParserFunc(tempData).catch((err) => console.log(err));
-export default protoParserFunc;
+module.exports = protoParserFunc;