import PropTypes from 'prop-types'; import React from 'react'; class APIKeyForm extends React.Component { constructor(props) { super(props); this.state = { keyLabel: '' }; this.addKey = this.addKey.bind(this); } addKey(event) { event.preventDefault(); document.getElementById('addKeyForm').reset(); this.props.addApiKey(this.state.keyLabel); return false; } removeKey(keyId) { this.props.removeApiKey(keyId); } render() { return (

Key label

{ this.setState({ keyLabel: event.target.value }); }} />
{this.props.apiKeys && this.props.apiKeys.map(v => ( ))}
{v.label}
Created on: {v.createdAt}
Last used on:
{v.lastUsedAt}
); } } APIKeyForm.propTypes = { addApiKey: PropTypes.func.isRequired, removeApiKey: PropTypes.func.isRequired, apiKeys: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.object.isRequired, label: PropTypes.string.isRequired, createdAt: PropTypes.object.isRequired, lastUsedAt: PropTypes.object.isRequired, })).isRequired }; export default APIKeyForm;