Reserved Name Claims (#357)

* reserved: add rpc methods to node and wallet clients

* reserved: add reserved name claim interface

* reserved: add routes to reserved name claim page and clean up details

* reserved: recognize claims in history and display spendable balance

* Style claim button

* reserved: add method 3 (airgapped sign and paste TXT+RRSIG)

* reserved: add method 4 (paste entire base64 blob, sendrawclaim)

* reserved: success modal with claim ID

* reserved: do not confirm on ledger

* wip

* add TXT flow

* Finish adding all claim options

* remove dup button

* reserved: UI nits

Co-authored-by: Fernando Falci <fernando.falci@adevinta.com>
Co-authored-by: Chi Kei Chan <chikeichan@gmail.com>

app/background/node/client.js

@@ -26,4 +26,6 @@ export const clientStub = ipcRendererInjector => makeClient(ipcRendererInjector,
   'getDir',
   'getAPIKey',
   'getHNSPrice',
+  'getDNSSECProof',
+  'sendRawClaim',
 ]);

app/background/node/service.js

@@ -347,6 +347,14 @@ export class NodeService extends EventEmitter {
     }
   }
 
+  async getDNSSECProof(url) {
+    return this._execRPC('getdnssecproof', [url, true]);
+  }
+
+  async sendRawClaim(base64) {
+    return this._execRPC('sendrawclaim', [base64]);
+  }
+
   async _ensureStarted() {
     return new Promise((resolve, reject) => {
       if (this.client) {
@@ -430,6 +438,8 @@ const methods = {
   setNoDns: data => service.setNoDns(data),
   getDir: () => service.getDir(),
   getHNSPrice: () => service.getHNSPrice(),
+  getDNSSECProof: (url) => service.getDNSSECProof(url),
+  sendRawClaim: (base64) => service.sendRawClaim(base64),
 };
 
 export async function start(server) {

app/background/wallet/client.js

@@ -59,4 +59,6 @@ export const clientStub = ipcRendererInjector => makeClient(ipcRendererInjector,
   'rpcGetWalletInfo',
   'listWallets',
   'getStats',
+  'createClaim',
+  'sendClaim',
 ]);

app/background/wallet/service.js

@@ -429,6 +429,18 @@ class WalletService {
     return value - amount;
   };
 
+  createClaim = (name) => this._ledgerProxy(
+    () => this._executeRPC('createclaim', [name]),
+    () => this._executeRPC('createclaim', [name]),
+    false
+  );
+
+  sendClaim = (name) => this._ledgerProxy(
+    () => this._executeRPC('sendclaim', [name]),
+    () => this._executeRPC('sendclaim', [name]),
+    false
+  );
+
   sendOpen = (name) => this._ledgerProxy(
     () => this._executeRPC('createopen', [name]),
     () => this._executeRPC('sendopen', [name], this.lock),
@@ -1386,6 +1398,8 @@ const methods = {
   rpcGetWalletInfo: service.rpcGetWalletInfo,
   listWallets: service.listWallets,
   getStats: service.getStats,
+  createClaim: service.createClaim,
+  sendClaim: service.sendClaim,
 };
 
 export async function start(server) {

app/components/Modal/index.js

@@ -16,11 +16,22 @@ class Modal extends Component {
     className: '',
   };
 
+  onClose = e => {
+    const selected = window.getSelection().toString();
+    if (selected || !this.props.onClose) {
+      return;
+    }
+    this.props.onClose();
+  };
+
   render() {
     const { className, onClose, children } = this.props;
 
     return ReactDOM.createPortal(
-      <div className="modal__overlay" onClick={onClose}>
+      <div
+        className="modal__overlay"
+        onClick={this.onClose}
+      >
         <div className={`modal__wrapper ${className}`} onClick={e => e.stopPropagation()}>
           {children}
         </div>