From 36dd0354e777e6786ae0d2284ffcb1adbc6d85f7 Mon Sep 17 00:00:00 2001 From: bitpshr Date: Mon, 10 Sep 2018 17:11:57 -0400 Subject: Implement latest EIP-712 protocol --- ui/app/components/signature-request.js | 30 +++++++++++++++++----- ui/app/css/itcss/components/request-signature.scss | 19 ++++++++++++++ 2 files changed, 42 insertions(+), 7 deletions(-) (limited to 'ui') diff --git a/ui/app/components/signature-request.js b/ui/app/components/signature-request.js index 2bfa350d3..4d078d23c 100644 --- a/ui/app/components/signature-request.js +++ b/ui/app/components/signature-request.js @@ -8,6 +8,7 @@ const ethUtil = require('ethereumjs-util') const classnames = require('classnames') const { compose } = require('recompose') const { withRouter } = require('react-router-dom') +const { ObjectInspector } = require('react-inspector') const AccountDropdownMini = require('./dropdowns/account-dropdown-mini') @@ -169,12 +170,29 @@ SignatureRequest.prototype.msgHexToText = function (hex) { } } +// eslint-disable-next-line react/display-name +SignatureRequest.prototype.renderTypedDataV2 = function (data) { + const { domain, message } = JSON.parse(data) + return [ + h('div.request-signature__typed-container', [ + domain ? h('div', [ + h('h1', 'Domain'), + h(ObjectInspector, { data: domain, expandLevel: 1, name: 'domain' }), + ]) : '', + message ? h('div', [ + h('h1', 'Message'), + h(ObjectInspector, { data: message, expandLevel: 1, name: 'message' }), + ]) : '', + ]), + ] +} + SignatureRequest.prototype.renderBody = function () { let rows let notice = this.context.t('youSign') + ':' const { txData } = this.props - const { type, msgParams: { data } } = txData + const { type, msgParams: { data, version } } = txData if (type === 'personal_sign') { rows = [{ name: this.context.t('message'), value: this.msgHexToText(data) }] @@ -205,9 +223,9 @@ SignatureRequest.prototype.renderBody = function () { }), }, [notice]), - h('div.request-signature__rows', [ - - ...rows.map(({ name, value }) => { + h('div.request-signature__rows', type === 'eth_signTypedData' && version === 'V2' ? + this.renderTypedDataV2(data) : + rows.map(({ name, value }) => { if (typeof value === 'boolean') { value = value.toString() } @@ -216,9 +234,7 @@ SignatureRequest.prototype.renderBody = function () { h('div.request-signature__row-value', value), ]) }), - - ]), - + ), ]) } diff --git a/ui/app/css/itcss/components/request-signature.scss b/ui/app/css/itcss/components/request-signature.scss index b607aded3..445b9ebf5 100644 --- a/ui/app/css/itcss/components/request-signature.scss +++ b/ui/app/css/itcss/components/request-signature.scss @@ -23,6 +23,25 @@ } } + &__typed-container { + padding: 17px; + + h1 { + font-weight: 900; + margin-bottom: 5px; + } + + * { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + > div { + margin-bottom: 10px; + } + } + &__header { height: 64px; width: 100%; -- cgit From 42fdcf6239fc9278cfa85b6ae6cc025cef0e35ae Mon Sep 17 00:00:00 2001 From: bitpshr Date: Thu, 13 Sep 2018 15:12:08 -0400 Subject: Update new method namespace from v2 to v3 --- ui/app/components/signature-request.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'ui') diff --git a/ui/app/components/signature-request.js b/ui/app/components/signature-request.js index 4d078d23c..5b0c7684a 100644 --- a/ui/app/components/signature-request.js +++ b/ui/app/components/signature-request.js @@ -171,7 +171,7 @@ SignatureRequest.prototype.msgHexToText = function (hex) { } // eslint-disable-next-line react/display-name -SignatureRequest.prototype.renderTypedDataV2 = function (data) { +SignatureRequest.prototype.renderTypedDataV3 = function (data) { const { domain, message } = JSON.parse(data) return [ h('div.request-signature__typed-container', [ @@ -223,8 +223,8 @@ SignatureRequest.prototype.renderBody = function () { }), }, [notice]), - h('div.request-signature__rows', type === 'eth_signTypedData' && version === 'V2' ? - this.renderTypedDataV2(data) : + h('div.request-signature__rows', type === 'eth_signTypedData' && version === 'V3' ? + this.renderTypedDataV3(data) : rows.map(({ name, value }) => { if (typeof value === 'boolean') { value = value.toString() -- cgit