Update with signPayload for injected signer (polkadot-js#106)

* Update with signPayload for injected signer

* Bare-minimum in interface

* Cleanup linting

* Remove unused (atm) permissions

package.json

@@ -12,11 +12,11 @@
     "yarn": "^1.10.1"
   },
   "resolutions": {
-    "@polkadot/api": "^0.82.0-beta.77",
-    "@polkadot/keyring": "^0.94.1",
-    "@polkadot/types": "^0.82.0-beta.77",
-    "@polkadot/util": "^0.94.1",
-    "@polkadot/util-crypto": "^0.94.1",
+    "@polkadot/api": "^0.82.0-beta.88",
+    "@polkadot/keyring": "^0.95.0-beta.0",
+    "@polkadot/types": "^0.82.0-beta.88",
+    "@polkadot/util": "^0.95.0-beta.0",
+    "@polkadot/util-crypto": "^0.95.0-beta.0",
     "babel-core": "^7.0.0-bridge.0",
     "typescript": "^3.5.3"
   },

packages/extension-inject/src/types.ts

@@ -2,7 +2,7 @@
 // This software may be modified and distributed under the terms
 // of the Apache-2.0 license. See the LICENSE file for details.
 
-import { Signer } from '@polkadot/api/types';
+import { Signer as InjectedSigner } from '@polkadot/api/types';
 
 export type Unsubcall = () => void;
 
@@ -25,8 +25,6 @@ export interface InjectedAccounts {
   subscribe: (cb: (accounts: InjectedAccount[]) => any) => Unsubcall;
 }
 
-export type InjectedSigner = Signer;
-
 export interface InjectedExtensionInfo {
   name: string;
   version: string;

packages/extension-ui/src/Popup/Signing/Details.tsx

@@ -6,7 +6,7 @@ import React from 'react';
 import styled from 'styled-components';
 import fromMetadata from '@polkadot/api-metadata/extrinsics/fromMetadata';
 import findChain from '@polkadot/extension/chains';
-import { Metadata, Method, ExtrinsicEra } from '@polkadot/types';
+import { BlockNumber, ExtrinsicEra, Metadata, Method, SignaturePayload } from '@polkadot/types';
 import { formatNumber } from '@polkadot/util';
 
 interface MethodJson {
@@ -15,13 +15,12 @@ interface MethodJson {
 }
 
 interface Props {
-  blockNumber: number;
+  blockNumber: BlockNumber;
   className?: string;
-  era?: string;
   genesisHash: string;
   isDecoded: boolean;
   method: string;
-  nonce: string;
+  payload: SignaturePayload;
   url: string;
 }
 
@@ -64,7 +63,7 @@ function renderMethod (data: string, meta?: Metadata | null): React.ReactNode {
   );
 }
 
-function renderMortality (era: ExtrinsicEra, blockNumber: number): string {
+function renderMortality (era: ExtrinsicEra, blockNumber: BlockNumber): string {
   if (era.isImmortalEra) {
     return 'immortal';
   }
@@ -74,9 +73,8 @@ function renderMortality (era: ExtrinsicEra, blockNumber: number): string {
   return `mortal, valid from #${formatNumber(mortal.birth(blockNumber))} to #${formatNumber(mortal.death(blockNumber))}`;
 }
 
-function Details ({ blockNumber, className, genesisHash, isDecoded, era, method, nonce, url }: Props): React.ReactElement<Props> {
+function Details ({ blockNumber, className, genesisHash, isDecoded, method, payload: { era, nonce, tip }, url }: Props): React.ReactElement<Props> {
   const chain = findChain(genesisHash);
-  const eera = new ExtrinsicEra(era);
 
   return (
     <table className={className}>
@@ -91,12 +89,18 @@ function Details ({ blockNumber, className, genesisHash, isDecoded, era, method,
         </tr>
         <tr>
           <td className='label'>nonce</td>
-          <td className='data'>{nonce}</td>
+          <td className='data'>{formatNumber(nonce)}</td>
         </tr>
+        {!tip.isEmpty && (
+          <tr>
+            <td className='label'>tip</td>
+            <td className='data'>{formatNumber(tip)}</td>
+          </tr>
+        )}
         {renderMethod(method, (chain && isDecoded) ? chain.meta : null)}
         <tr>
-          <td className='label'>mortality</td>
-          <td className='data'>{renderMortality(eera, blockNumber)}</td>
+          <td className='label'>lifetime</td>
+          <td className='data'>{renderMortality(era, blockNumber)}</td>
         </tr>
       </tbody>
     </table>

packages/extension-ui/src/Popup/Signing/Request.tsx

@@ -6,6 +6,7 @@ import { MessageExtrinsicSign } from '@polkadot/extension/background/types';
 import { OnActionFromCtx } from '../../components/types';
 
 import React from 'react';
+import { SignaturePayload, BlockNumber } from '@polkadot/types';
 
 import { ActionBar, Address, Link, withOnAction } from '../../components';
 import { approveSignRequest, cancelSignRequest } from '../../messaging';
@@ -20,24 +21,25 @@ interface Props {
   url: string;
 }
 
-function Request ({ isFirst, onAction, request: { address, blockNumber, era, genesisHash, method, nonce }, signId, url }: Props): React.ReactElement<Props> {
+function Request ({ isFirst, onAction, request, signId, url }: Props): React.ReactElement<Props> {
   const onCancel = (): Promise<void> =>
     cancelSignRequest(signId)
       .then((): void => onAction())
       .catch(console.error);
   const onSign = (password: string): Promise<void> =>
     approveSignRequest(signId, password)
       .then((): void => onAction());
+  const blockNumber = new BlockNumber(request.blockNumber);
+  const payload = new SignaturePayload(request, { version: request.version });
 
   return (
-    <Address address={address}>
+    <Address address={request.address}>
       <Details
         blockNumber={blockNumber}
-        era={era}
-        genesisHash={genesisHash}
+        genesisHash={request.genesisHash}
         isDecoded={isFirst}
-        method={method}
-        nonce={nonce}
+        method={request.method}
+        payload={payload}
         url={url}
       />
       <ActionBar>

packages/extension/manifest.json

@@ -3,8 +3,9 @@
   "description": "Manage your Polkadot accounts outside of dapps. Injects the accounts and allows signing transactions for a specific account.",
   "homepage_url": "https://github.com/polkadot-js/extension",
   "name": "polkadot{.js} extension",
+  "short_name": "polkadot{.js}",
   "manifest_version": 2,
-  "permissions": ["activeTab", "storage"],
+  "permissions": ["storage"],
   "background": {
     "scripts": ["background.js"],
     "persistent": true

packages/extension/package.json

@@ -5,13 +5,13 @@
   "author": "Jaco Greeff <[email protected]>",
   "license": "Apache-2",
   "dependencies": {
-    "@polkadot/api": "^0.82.0-beta.77",
+    "@polkadot/api": "^0.82.0-beta.88",
     "@polkadot/extension-ui": "^0.5.0-beta.4",
     "@polkadot/ui-keyring": "^0.42.0-beta.16"
   },
   "devDependencies": {
     "@babel/runtime": "^7.5.5",
-    "@polkadot/keyring": "^0.94.1",
+    "@polkadot/keyring": "^0.95.0-beta.0",
     "@types/chrome": "^0.0.86",
     "@types/firefox-webext-browser": "^67.0.1",
     "extensionizer": "^1.0.1",

packages/extension/src/background/handlers/Extension.ts

@@ -8,9 +8,9 @@ import { AuthorizeRequest, MessageTypes, MessageAccountCreate, MessageAccountEdi
 
 import keyring from '@polkadot/ui-keyring';
 import accountsObservable from '@polkadot/ui-keyring/observable/accounts';
-import { SignaturePayloadRaw } from '@polkadot/types';
+import { SignaturePayload } from '@polkadot/types';
 import { mnemonicGenerate, mnemonicValidate } from '@polkadot/util-crypto';
-import { assert, u8aToHex } from '@polkadot/util';
+import { assert } from '@polkadot/util';
 
 import State from './State';
 import { createSubscription, unsubscribe } from './subscriptions';
@@ -137,8 +137,8 @@ export default class Extension {
 
     assert(queued, 'Unable to find request');
 
-    const { request: { address, blockHash, era, method, nonce }, resolve, reject } = queued;
-    const pair = keyring.getPair(address);
+    const { request, resolve, reject } = queued;
+    const pair = keyring.getPair(request.address);
 
     if (!pair) {
       reject(new Error('Unable to find pair'));
@@ -148,14 +148,14 @@ export default class Extension {
 
     pair.decodePkcs8(password);
 
-    const payload = new SignaturePayloadRaw({ blockHash, era, method, nonce });
-    const signature = u8aToHex(payload.sign(pair));
+    const payload = new SignaturePayload(request, { version: request.version });
+    const result = payload.sign(pair);
 
     pair.lock();
 
     resolve({
       id,
-      signature
+      ...result
     });
 
     return true;

packages/extension/src/background/types.ts

@@ -2,6 +2,7 @@
 // This software may be modified and distributed under the terms
 // of the Apache-2.0 license. See the LICENSE file for details.
 
+import { SignerPayload } from '@polkadot/api/types';
 import { KeypairType } from '@polkadot/util-crypto/types';
 
 export type MessageTypes = 'authorize.approve' | 'authorize.reject' | 'authorize.requests' | 'authorize.subscribe' | 'authorize.tab' | 'accounts.create' | 'accounts.edit' | 'accounts.forget' | 'accounts.list' | 'accounts.subscribe' | 'extrinsic.sign' | 'seed.create' | 'seed.validate' | 'signing.approve' | 'signing.cancel' | 'signing.requests' | 'signing.subscribe';
@@ -63,15 +64,7 @@ export interface MessageExtrinsicSignCancel {
   id: string;
 }
 
-export interface MessageExtrinsicSign {
-  address: string;
-  blockHash: string;
-  blockNumber: number;
-  era?: string;
-  genesisHash: string;
-  method: string;
-  nonce: string;
-}
+export type MessageExtrinsicSign = SignerPayload;
 
 export interface MessageExtrinsicSignResponse {
   id: string;

packages/extension/src/page/Signer.ts

@@ -2,42 +2,33 @@
 // This software may be modified and distributed under the terms
 // of the Apache-2.0 license. See the LICENSE file for details.
 
-import { SignerOptions } from '@polkadot/api/types';
-import { InjectedSigner } from '@polkadot/extension-inject/types';
-import { IExtrinsic } from '@polkadot/types/types';
+import { Signer as SignerInterface, SignerPayload, SignerResult } from '@polkadot/api/types';
 import { SendRequest } from './types';
 
-import { SubmittableResult } from '@polkadot/api/SubmittableExtrinsic';
-import { Hash } from '@polkadot/types';
-
-const DEFAULT_ERA = new Uint8Array();
-
 let sendRequest: SendRequest;
+let nextId = 0;
 
-export default class Signer implements InjectedSigner {
+export default class Signer implements SignerInterface {
   public constructor (_sendRequest: SendRequest) {
     sendRequest = _sendRequest;
   }
 
-  public async sign (extrinsic: IExtrinsic, address: string, { blockHash, blockNumber, era, genesisHash, nonce }: SignerOptions): Promise<number> {
-    // Bit of a hack - with this round-about way, we skip any keyring deps
-    const { id, signature } = await sendRequest('extrinsic.sign', JSON.parse(JSON.stringify({
-      address,
-      blockHash,
-      blockNumber: blockNumber.toNumber(),
-      era,
-      genesisHash,
-      method: extrinsic.method.toHex(),
-      nonce
-    })));
-
-    extrinsic.addSignature(address, signature, nonce, era || DEFAULT_ERA);
-
-    return id;
+  public async signPayload (payload: SignerPayload): Promise<SignerResult> {
+    const id = ++nextId;
+    const result = await sendRequest('extrinsic.sign', payload);
+
+    // we add an internal id (number) - should have a mapping from the
+    // extension id (string) -> internal id (number) if we wish to provide
+    // updated via the update functionality (noop at this point)
+    return {
+      ...result,
+      id
+    };
   }
 
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  public update (id: number, status: Hash | SubmittableResult): void {
-    // something
-  }
+  // We don't listen to updates at all, if we do we can interpret the result
+  // as provided by the API here
+  // public update (id: number, status: Hash | SubmittableResult): void {
+  //   // ignore
+  // }
 }

tsconfig.json

@@ -1,10 +1,8 @@
 {
   "extends": "./node_modules/@polkadot/dev/config/tsconfig",
-  "compilerOptions":
-  {
+  "compilerOptions": {
     "baseUrl": ".",
-    "paths":
-    {
+    "paths": {
       "@polkadot/extension": ["packages/extension/src"],
       "@polkadot/extension/*": ["packages/extension/src/*"],
       "@polkadot/extension-dapp": ["packages/extension-dapp/src"],
@@ -18,5 +16,8 @@
       "./node_modules/@polkadot/ts",
       "./node_modules/@types"
     ]
-  }
+  },
+  "exclude": [
+    "**/build/*"
+  ]
 }