Merge pull request LedgerHQ#157 from LedgerHQ/refine-genuine-check

Add more events in genuineCheck
BuildOnViction · Mar 5, 2019 · 438fe45 · 438fe45
2 parents b1ed4d9 + bb00a8c
commit 438fe45
Show file tree

Hide file tree

Showing 17 changed files with 253 additions and 242 deletions.
diff --git a/demo/package.json b/demo/package.json
@@ -3,15 +3,15 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@ledgerhq/hw-transport": "^4.41.1",
-    "@ledgerhq/hw-transport-u2f": "^4.41.1",
-    "@ledgerhq/hw-transport-web-ble": "^4.41.1",
-    "@ledgerhq/hw-transport-webusb": "^4.41.1",
+    "@ledgerhq/hw-transport": "^4.43.0",
+    "@ledgerhq/hw-transport-u2f": "^4.43.0",
+    "@ledgerhq/hw-transport-web-ble": "^4.43.0",
+    "@ledgerhq/hw-transport-webusb": "^4.43.0",
     "@ledgerhq/live-common": "file:..",
     "axios": "^0.18.0",
     "babel-polyfill": "^6.26.0",
     "bignumber.js": "^7.2.1",
-    "flow-bin": "^0.73.0",
+    "flow-bin": "^0.94.0",
     "material-ui": "^1.0.0-beta.44",
     "qrcode": "^1.3.0",
     "react": "^16.8.3",

diff --git a/demo/src/demos/transports/index.js b/demo/src/demos/transports/index.js
@@ -18,7 +18,7 @@ class SelectTransport extends Component<*> {
   render() {
     return (
       <label>
-        Transport:{" "}<br/>
+        Transport: <br />
         <select onChange={this.onChange} value={this.props.value}>
           {transports.map(key => (
             <option key={key} value={key}>
@@ -31,7 +31,7 @@ class SelectTransport extends Component<*> {
   }
 }
 
-class ArbitraryAPDU extends Component<*,*> {
+class ArbitraryAPDU extends Component<*, *> {
   state = {
     apdu: "",
     error: "",
@@ -40,7 +40,7 @@ class ArbitraryAPDU extends Component<*,*> {
   };
 
   onClear = () => {
-    this.setState({log:[]});
+    this.setState({ log: [] });
   };
 
   onClick = () => {
@@ -57,7 +57,11 @@ class ArbitraryAPDU extends Component<*,*> {
     ).subscribe({
       next: result => {
         this.setState(prevState => ({
-          log: [...prevState.log, `<= ${result.toString("hex")}`,`<= ${result}`]
+          log: [
+            ...prevState.log,
+            `<= ${result.toString("hex")}`,
+            `<= ${result}`
+          ]
         }));
         this.setState({ running: false, error: null, result });
       },
@@ -66,62 +70,79 @@ class ArbitraryAPDU extends Component<*,*> {
           log: [...prevState.log, "<!= Error"]
         }));
 
-        console.log(error);
         this.setState({ running: false, error, result: "" });
       }
     });
-  }
+  };
 
-  onChange = (event) => {
-    this.setState({apdu:event.target.value});
-  }
+  onChange = event => {
+    this.setState({ apdu: event.target.value });
+  };
 
   render() {
     const { running } = this.state;
     return (
       <RightBar>
-      <div><textarea style={{width:"100%"}} onChange={this.onChange} value={this.state.apdu} disabled={running} placeholder={"APDU"}/></div>
-      <div>
-        <button onClick={this.onClick} disabled={running} >Run APDU</button>
-        <button onClick={this.onClear}>Clear log</button>
-      </div>
-      <div>
-        <Log>
-          {this.state.log.map(val=><pre>{val}</pre>)}
-        </Log>
-      </div>
+        <div>
+          <textarea
+            style={{ width: "100%" }}
+            onChange={this.onChange}
+            value={this.state.apdu}
+            disabled={running}
+            placeholder={"APDU"}
+          />
+        </div>
+        <div>
+          <button onClick={this.onClick} disabled={running}>
+            Run APDU
+          </button>
+          <button onClick={this.onClear}>Clear log</button>
+        </div>
+        <div>
+          <Log>
+            {this.state.log.map(val => (
+              <pre key={val}>{val}</pre>
+            ))}
+          </Log>
+        </div>
       </RightBar>
     );
   }
 }
 
-class TextToData extends Component<*>{
+class TextToData extends Component<*> {
   /**
    * The data we pass to the dongle follows something like {length}{hexData}
    * This is a little utility to convert raw text to/from that format
    */
   state = {
-    value: "",
+    value: ""
   };
 
   toData = () => {
     const hexString = Buffer.from(this.state.value).toString("hex");
-    const contentLength = `${hexString.length/2}`.padStart(2,"0");
-    this.setState({value:contentLength+hexString});
-  }
+    const contentLength = `${hexString.length / 2}`.padStart(2, "0");
+    this.setState({ value: contentLength + hexString });
+  };
 
   toText = () => {
-    this.setState({value:Buffer.from(this.state.value.substr(2)).toString()});
-  }
+    this.setState({
+      value: Buffer.from(this.state.value.substr(2)).toString()
+    });
+  };
 
   render() {
     return (
       <div>
-        <input type="text" onChange={(event)=>this.setState({value:event.target.value})} value={this.state.value}/>
+        <input
+          type="text"
+          onChange={event => this.setState({ value: event.target.value })}
+          value={this.state.value}
+        />
         <button onClick={this.toData}>ToData</button>
         <button onClick={this.toText}>ToText</button>
       </div>
-    )
+    );
   }
 }
 class GenuineCheckButton extends Component<*, *> {
@@ -159,7 +180,7 @@ class GenuineCheckButton extends Component<*, *> {
         </button>
         {running ? <em>...</em> : null}
         <em style={{ color: "red" }}>{error && error.message}</em>
-        <strong>{result}</strong>
+        <strong>{result.payload || result.type}</strong>
       </p>
     );
   }
@@ -170,21 +191,21 @@ const Main = styled.div`
   display:flex;
   padding: 40px;
   flex-shrink:1
-  border-right:1px dashed gray; 
+  border-right:1px dashed gray;
 `;
 
 const Wrapper = styled.div`
-  flex-direction:row;
-  display:flex;
+  flex-direction: row;
+  display: flex;
 `;
 const RightBar = styled.div`
   padding: 40px;
-  flex:1;
+  flex: 1;
 `;
 const Log = styled.div`
-  flex-grow:1;
-  paddint:16px;
-  background:#f3f3f3
+  flex-grow: 1;
+  paddint: 16px;
+  background: #f3f3f3;
 `;
 
 class Transports extends Component<*, *> {
@@ -209,10 +230,10 @@ class Transports extends Component<*, *> {
           <h1>APDU</h1>
           <SelectTransport value={transportId} onChange={this.onTransportId} />
           <h3>Tools</h3>
-          <TextToData/>
+          <TextToData />
           <GenuineCheckButton transportId={transportId} />
         </Main>
-        <ArbitraryAPDU transportId={transportId}/>
+        <ArbitraryAPDU transportId={transportId} />
       </Wrapper>
     );
   }