From f4d58ebc705287788c9eaee6025269dd78b051a1 Mon Sep 17 00:00:00 2001
From: Dan Finlay <dan@danfinlay.com>
Date: Wed, 4 May 2016 18:08:31 -0700
Subject: Move account export to subview

Account detail view now has an animated transitioning `subview` section that allows us to show extra details within it.

Clicking `export` now slide replaces the transaction list with the export UI.

Added cancel/done/submit buttons to the Export UI. Done submits like Enter did, the other two transition back to the transaction list.

For some reason when first unlocking, the selected account is being instantly replaced with the accounts list, so I need to fix that before merging this into master.
---
 ui/app/components/account-export.js | 87 +++++++++++++++++++++++++++++++++++++
 1 file changed, 87 insertions(+)
 create mode 100644 ui/app/components/account-export.js

(limited to 'ui/app/components/account-export.js')

diff --git a/ui/app/components/account-export.js b/ui/app/components/account-export.js
new file mode 100644
index 000000000..f79a533ba
--- /dev/null
+++ b/ui/app/components/account-export.js
@@ -0,0 +1,87 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+const actions = require('../actions')
+
+module.exports = ExportAccountView
+
+
+inherits(ExportAccountView, Component)
+function ExportAccountView() {
+  Component.call(this)
+}
+
+ExportAccountView.prototype.render = function() {
+  console.log("EXPORT VIEW")
+  console.dir(this.props)
+  var state = this.props
+  var accountDetail = state.accountDetail
+
+  if (!accountDetail) return h('div')
+  var accountExport = accountDetail.accountExport
+
+  var notExporting = accountExport === 'none'
+  var exportRequested = accountExport === 'requested'
+  var accountExported = accountExport === 'completed'
+
+  if (notExporting) return h('div')
+
+  if (exportRequested) {
+    var warning = `Exporting your private key is very dangerous,
+      and you should only do it if you know what you're doing.`
+    var confirmation = `If you're absolutely sure, type "I understand" below and
+                        submit.`
+    return h('div', { key: 'exporting' }, [
+      h('p.error', warning),
+      h('p', confirmation),
+      h('input#exportAccount', {
+        onKeyPress: this.onExportKeyPress.bind(this),
+      }),
+      h('button', {
+        onClick: () => this.onExportKeyPress({ key: 'Enter', preventDefault: () => {} }),
+      }, 'Submit'),
+      h('button', {
+        onClick: () => this.props.dispatch(actions.backToAccountDetail(this.props.address))
+      }, 'Cancel'),
+    ])
+  }
+
+  if (accountExported) {
+    return h('div.privateKey', {
+
+    }, [
+      h('label', 'Your private key (click to copy):'),
+      h('p.error.cursor-pointer', {
+        style: {
+          textOverflow: 'ellipsis',
+          overflow: 'hidden',
+          webkitUserSelect: 'text',
+          width: '100%',
+        },
+        onClick: function(event) {
+          copyToClipboard(accountDetail.privateKey)
+        }
+      }, accountDetail.privateKey),
+      h('button', {
+        onClick: () => this.props.dispatch(actions.backToAccountDetail(this.props.address))
+      }, 'Done'),
+    ])
+  }
+}
+
+ExportAccountView.prototype.onExportKeyPress = function(event) {
+  if (event.key !== 'Enter') return
+  event.preventDefault()
+
+  var input = document.getElementById('exportAccount')
+  if (input.value === 'I understand') {
+    this.props.dispatch(actions.exportAccount(this.props.address))
+  } else {
+    input.value = ''
+    input.placeholder = 'Please retype "I understand" exactly.'
+  }
+}
+
+ExportAccountView.prototype.exportAccount = function(address) {
+  this.props.dispatch(actions.exportAccount(address))
+}
-- 
cgit v1.2.3