diff --git a/client/modules/User/actions.js b/client/modules/User/actions.js index 53fbb68e..90545b4c 100644 --- a/client/modules/User/actions.js +++ b/client/modules/User/actions.js @@ -1,4 +1,6 @@ +import React from 'react'; import { browserHistory } from 'react-router'; +import ReactDom from 'react-dom'; import axios from 'axios'; import crypto from 'crypto'; import * as ActionTypes from '../../constants'; @@ -227,7 +229,31 @@ export function addApiKey(label) { const hashedKey = Buffer.from(key).toString('base64'); axios.put(`${ROOT_URL}/account/api-keys`, { label, hashedKey }, { withCredentials: true }) .then((response) => { - window.alert(`Here is your key :\n${key}\nNote it somewhere, you won't be able to see it later !`); + // window.alert(`Here is your key :\n${key}\nNote it somewhere, you won't be able to see it later !`); + const elt = React.createElement( + 'tr', { className: 'new-key' }, + React.createElement('td', {}, 'Here is your new key ;\ncopy it somewhere, you won\'t be able to see it later !'), + React.createElement( + 'td', {}, + React.createElement('input', { + id: 'key-to-copy', type: 'text', value: key, readOnly: true + }) + ), + React.createElement( + 'td', {}, + React.createElement('input', { + type: 'submit', + value: 'Copy to clipboard', + className: 'form__table-button-copy', + onClick: () => { + const inputKey = document.getElementById('key-to-copy'); + inputKey.select(); + document.execCommand('copy'); + } + }) + ) + ); + ReactDom.render(elt, document.getElementById('form__table_new_key')); dispatch({ type: ActionTypes.ADDED_API_KEY, user: response.data diff --git a/client/modules/User/components/APIKeyForm.jsx b/client/modules/User/components/APIKeyForm.jsx index 2e85dce1..d99005ac 100644 --- a/client/modules/User/components/APIKeyForm.jsx +++ b/client/modules/User/components/APIKeyForm.jsx @@ -13,6 +13,7 @@ class APIKeyForm extends React.Component { event.preventDefault(); document.getElementById('addKeyForm').reset(); this.props.addApiKey(this.state.keyLabel); + this.state.keyLabel = ''; return false; } @@ -39,12 +40,13 @@ class APIKeyForm extends React.Component { />
{v.label} Created on: {v.createdAt} |
Last used on: {v.lastUsedAt} |
- + |