Merge branch 'master' of github.com:krimlabs/eiphop

README.md

@@ -145,40 +145,56 @@ emit('hip', {empty: 'payload'})
 
 This module was built for react and redux applications. Here is a simple React example :
 
-```import React from 'react';  
-import {emit} from 'eiphop';
+```import React from 'react';
+import {setupFrontendListener, emit, pendingRequests} from 'eiphop';
+
+const electron = window.electron; // or require('electron')  
+setupFrontendListener(electron);
 
 class App extends React.Component {  
-  constructor() {  
+  constructor(props) {  
+    super(props);
     this.state = {pingRes: '', hipRes: ''}  
   }
 
-render() {  
+  render() {  
     const {pingRes, hipRes} = this.state;  
-    return (<div>  
+    return (<div>
       Ping Res = {JSON.stringify(pingRes)}  
       <br/>  
       Hip Res = {JSON.stringify(hipRes)}  
       <br/>
 
-<button onClick={() => {  
+      <button onClick={() => {  
         emit('ping')  
-          .then(res => this.setState({pingRes: res}))  
+          .then((res) => {
+            this.setState({pingRes: res})
+            console.log(pendingRequests);
+          });
         ;  
       }}>  
         Ping  
       </button>
 
-<button onClick={() => {  
+      <button onClick={() => {  
         emit('hip')  
-          .then(res => this.setState({pingRes: res}))  
+          .then((res) => {
+            this.setState({hipRes: res})
+            console.log(pendingRequests);
+          })  
         ;  
       }}>  
         Hip  
       </button>  
+      <br/>
+
+      (Check console for pending requests)
     </div>);  
   }  
 }
+
+export default App;
+
 ```
 
 You can similarly use this with Redux (and other solutions).
@@ -199,16 +215,10 @@ If you want to know how I structure React apps in general, Fractal is the way to
 
 Thanks for reading :)
 
-PS:
-
-#### I’m looking for new projects to take up. If you have an idea and need a dev team, feel free to [email me.](http://href%3D%22mailto:[email protected]/?subject=I%20have%20an%20idea%20that%20needs%20a%20dev%20team&body=Hi%20Shivek%2C%20%0A%0AI%27m%20%28%23%20your%20name%2C%20company%2C%20intro.%29%0A%0AThere%20is%20this%20idea%20that%20I%20think%20will%20be%20the%20next%20big%20thing.%20%28%23%20give%20details%20if%20possible%29.%0A%0AI%20need%20someone%20with%20technical%20expertise%20to%20build%20this.%20I%27m%20considering%20options%20and%20you%20are%20one%20of%20them.%20When%20would%20you%20be%20available%20for%20a%2020%20minutes%20call%20%3F%20%0A%0AThanks%20and%20Regards%22)
-
-_I also run a slack community (which has 15 members as of September 21, 2018) where you can help others or receive help regarding frontend, backend and development in general._ [_Let me know_](http://href%3D%22mailto:[email protected]/?subject=Add%20me%20to%20the%20slack%20community&body=Hi%20Shivek%2C%20%0A%0AI%20read%20your%20post%20on%20medium%20and%20would%20like%20to%20join%20the%20slack%20community.%0A%0A%28%23%20any%20other%20details%20you%27d%20like%20to%20add%29.%0A%0AThanks%22) _if you’d like to be a part of it._
-
 ----------
 MIT License
 
-Copyright (c) [2018] [Shivek Khurana]
+Copyright (c) [2019] [Shivek Khurana]
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

example/main/package.json

@@ -9,5 +9,8 @@
   },
   "devDependencies": {
     "electron": "^3.0.0"
+  },
+  "dependencies": {
+    "eiphop": "../.."
   }
 }

example/main/src/index.js

@@ -1,4 +1,27 @@
-const {app, BrowserWindow} = require('electron');
+const electron = require('electron');
+const {app, BrowserWindow} = electron;
+const {setupMainHandler} = require('eiphop');
+
+const hipActions = {  
+  hip: async (req, res) => {  
+    const {payload} = req;  
+    await new Promise(done => setTimeout(done, 800));
+    res.send({msg: 'hop-' + Date()});
+
+    // or res.error({msg: 'failed'})  
+  }  
+};
+
+const pingActions = {  
+  ping: (req, res) => {  
+    const {payload} = req;  
+    res.send({msg: 'pong-' + Date()});  
+    // or res.error({msg: 'failed'})
+  }  
+};
+
+setupMainHandler(electron, {...hipActions, ...pingActions}, true);
+
 let win;
 function createWindow () {
   win = new BrowserWindow({

example/main/yarn.lock

@@ -150,6 +150,9 @@ ecc-jsbn@~0.1.1:
     jsbn "~0.1.0"
     safer-buffer "^2.1.0"
 
+eiphop@../..:
+  version "1.0.6"
+
 electron-download@^4.1.0:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/electron-download/-/electron-download-4.1.1.tgz#02e69556705cc456e520f9e035556ed5a015ebe8"

example/renderer/package.json

@@ -3,6 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "eiphop": "../..",
     "react": "^16.5.2",
     "react-dom": "^16.5.2",
     "react-scripts": "1.1.5"
@@ -11,4 +12,4 @@
     "start": "BROWSER=none NODE_PATH=./src react-scripts start",
     "build": "NODE_PATH=./src react-scripts build"
   }
-}
+}

example/renderer/src/App.js

@@ -1,21 +1,47 @@
-import React, { Component } from 'react';
-import logo from './logo.svg';
-import './App.css';
+import React from 'react';
+import {setupFrontendListener, emit} from 'eiphop';
 
-class App extends Component {
-  render() {
-    return (
-      <div className="App">
-        <header className="App-header">
-          <img src={logo} className="App-logo" alt="logo" />
-          <h1 className="App-title">Welcome to React</h1>
-        </header>
-        <p className="App-intro">
-          To get started, edit <code>src/App.js</code> and save to reload.
-        </p>
-      </div>
-    );
+const electron = window.electron; // or require('electron')  
+setupFrontendListener(electron);
+
+class App extends React.Component {  
+  constructor(props) {  
+    super(props);
+    this.state = {pingRes: '', hipRes: ''}
   }
+
+  render() {  
+    const {pingRes, hipRes} = this.state;  
+    return (<div>
+      Ping Res = {JSON.stringify(pingRes)}  
+      <br/>  
+      Hip Res = {JSON.stringify(hipRes)}  
+      <br/>
+
+      <button onClick={() => {  
+        emit('ping')  
+          .then((res) => {
+            this.setState({pingRes: res})
+          });
+        ;  
+      }}>  
+        Ping  
+      </button>
+
+      <button onClick={() => {  
+        emit('hip')  
+          .then((res) => {
+            this.setState({hipRes: res})
+          })  
+        ;  
+      }}>  
+        Hip  
+      </button>  
+      <br/>
+
+      (Check console for pending requests)
+    </div>);  
+  }  
 }
 
 export default App;

example/renderer/src/index.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import './index.css';
 import App from './App';
 import registerServiceWorker from './registerServiceWorker';
 

example/renderer/yarn.lock

@@ -2112,6 +2112,9 @@ [email protected]:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d"
 
+eiphop@../..:
+  version "1.0.6"
+
 electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.30:
   version "1.3.70"
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.70.tgz#ded377256d92d81b4257d36c65aa890274afcfd2"
@@ -5492,14 +5495,14 @@ react-dev-utils@^5.0.2:
     strip-ansi "3.0.1"
     text-table "0.2.0"
 
-[email protected]:
-  version "16.5.2"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.5.2.tgz#b69ee47aa20bab5327b2b9d7c1fe2a30f2cfa9d7"
+react-dom@^16.5.2:
+  version "16.8.6"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.8.6.tgz#71d6303f631e8b0097f56165ef608f051ff6e10f"
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
     prop-types "^15.6.2"
-    schedule "^0.5.0"
+    scheduler "^0.13.6"
 
 react-error-overlay@^4.0.1:
   version "4.0.1"
@@ -5550,14 +5553,14 @@ [email protected]:
   optionalDependencies:
     fsevents "^1.1.3"
 
-[email protected]:
-  version "16.5.2"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.5.2.tgz#19f6b444ed139baa45609eee6dc3d318b3895d42"
+react@^16.5.2:
+  version "16.8.6"
+  resolved "https://registry.yarnpkg.com/react/-/react-16.8.6.tgz#ad6c3a9614fd3a4e9ef51117f54d888da01f2bbe"
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
     prop-types "^15.6.2"
-    schedule "^0.5.0"
+    scheduler "^0.13.6"
 
 read-pkg-up@^1.0.1:
   version "1.0.1"
@@ -5914,10 +5917,11 @@ sax@^1.2.1, sax@^1.2.4, sax@~1.2.1:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
 
-schedule@^0.5.0:
-  version "0.5.0"
-  resolved "https://registry.yarnpkg.com/schedule/-/schedule-0.5.0.tgz#c128fffa0b402488b08b55ae74bb9df55cc29cc8"
+scheduler@^0.13.6:
+  version "0.13.6"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.13.6.tgz#466a4ec332467b31a91b9bf74e5347072e4cd889"
   dependencies:
+    loose-envify "^1.1.0"
     object-assign "^4.1.1"
 
 schema-utils@^0.3.0:

src/index.js

@@ -1,4 +1,4 @@
 import {setupMainHandler} from './main';
-import {emit, setupFrontendListener} from './renderer';
+import {emit, setupFrontendListener, pendingRequests} from './renderer';
 
-export {emit, setupMainHandler, setupFrontendListener};
+export {emit, setupMainHandler, setupFrontendListener, pendingRequests};

src/renderer.js

@@ -9,6 +9,15 @@ let ipcRenderer = null;
 
 // singleton requests map 
 let pendingRequests = {};
+export {pendingRequests};
+
+const removePendingRequestId = (requestId) => {
+  pendingRequests = Object.keys(pendingRequests)
+    .filter(k => k !== requestId)
+    .map(k => ({[k]: pendingRequests[k]}))
+    .reduce((accumulator, current) => ({...accumulator, ...current}), {})
+  ;
+};
 
 const randomId = () => `${Date.now().toString(36)}${Math.random().toString(36).substr(2, 5)}`;
 
@@ -17,8 +26,8 @@ const randomId = () => `${Date.now().toString(36)}${Math.random().toString(36).s
 class Deferred {
   constructor() {
     this.promise = new Promise((resolve, reject)=> {
-      this.reject = reject
-      this.resolve = resolve
+      this.reject = reject;
+      this.resolve = resolve;
     })
   }
 }
@@ -46,18 +55,13 @@ export const setupFrontendListener = (electronModule) => {
   // expect all responses on asyncResponse channel
   ipcRenderer.on('asyncResponse', (event, requestId, res) => {
     const {dfd, action} = pendingRequests[requestId];
+    removePendingRequestId(requestId);
     dfd.resolve(res);
-
-    // remove the pendingRequest
-    pendingRequests = Object.keys(pendingRequests)
-      .filter(k => k !== requestId)
-      .map(k => ({[k]: pendingRequests[k]}))
-      .reduce((accumulator, current) => ({...accumulator, ...current}), {})
-    ;
   });
 
   ipcRenderer.on('errorResponse', (event, requestId, err) => {
     const {dfd, action} = pendingRequests[requestId];
+    removePendingRequestId(requestId);
     dfd.reject(err);
   });
 }