import React, {PureComponent, PropTypes} from 'react'; import autobind from 'autobind-decorator'; import {Tab, Tabs, TabList, TabPanel} from 'react-tabs'; import DebouncedInput from '../base/debounced-input'; import FileInputButton from '../base/file-input-button'; import Modal from '../base/modal'; import ModalBody from '../base/modal-body'; import ModalHeader from '../base/modal-header'; import PromptButton from '../base/prompt-button'; import * as models from '../../../models/index'; import {trackEvent} from '../../../analytics/index'; @autobind class WorkspaceSettingsModal extends PureComponent { constructor (props) { super(props); this.state = { showAddCertificateForm: false, crtPath: '', keyPath: '', pfxPath: '', host: '', passphrase: '' }; } _workspaceUpdate (patch) { models.workspace.update(this.props.workspace, patch); } _handleSetModalRef (n) { this.modal = n; } _handleRemoveWorkspace () { this.props.handleRemoveWorkspace(); this.hide(); } _handleToggleCertificateForm () { this.setState({showAddCertificateForm: !this.state.showAddCertificateForm}); } _handleRename (name) { this._workspaceUpdate({name}); } _handleDescriptionChange (description) { this._workspaceUpdate({description}); } _handleCreateHostChange (e) { this.setState({host: e.target.value}); } _handleCreatePfxChange (pfxPath) { this.setState({pfxPath}); } _handleCreateCrtChange (crtPath) { this.setState({crtPath}); } _handleCreateKeyChange (keyPath) { this.setState({keyPath}); } _handleCreatePassphraseChange (e) { this.setState({passphrase: e.target.value}); } async _handleSubmitCertificate (e) { e.preventDefault(); const {workspace} = this.props; const {pfxPath, crtPath, keyPath, host, passphrase} = this.state; const certificate = { host, passphrase, cert: crtPath, key: keyPath, pfx: pfxPath, disabled: false }; const certificates = [ ...workspace.certificates.filter(c => c.host !== certificate.host), certificate ]; await models.workspace.update(workspace, {certificates}); this._handleToggleCertificateForm(); trackEvent('Certificates', 'Create'); } _handleDeleteCertificate (certificate) { const {workspace} = this.props; const certificates = workspace.certificates.filter(c => c.host !== certificate.host); models.workspace.update(workspace, {certificates}); trackEvent('Certificates', 'Delete'); } _handleToggleCertificate (certificate) { const {workspace} = this.props; const certificates = workspace.certificates.map( c => c === certificate ? Object.assign({}, c, {disabled: !c.disabled}) : c ); models.workspace.update(workspace, {certificates}); trackEvent('Certificates', 'Toggle'); } toggle (workspace) { this.modal.toggle(); this.setState({ workspace, showAddCertificateForm: false, crtPath: '', keyPath: '', pfxPath: '', host: '', passphrase: '' }); } show () { this.modal.show(); this.setState({ showAddCertificateForm: false, crtPath: '', keyPath: '', pfxPath: '', host: '', passphrase: '' }); } hide () { this.modal.hide(); } renderModalHeader () { const {workspace} = this.props; return ( Workspace Settings ); } renderModalBody () { const {workspace} = this.props; const {pfxPath, crtPath, keyPath, showAddCertificateForm} = this.state; return ( Overview Client Certificates Name Description Danger Zone Delete Workspace {!showAddCertificateForm ? ( {workspace.certificates.length === 0 ? ( You have not yet added any certificates ) : workspace.certificates.map(certificate => ( PFX: {' '} {certificate.pfx ? : } CRT: {' '} {certificate.cert ? : } Key: {' '} {certificate.key ? : } Passphrase: {' '} {certificate.passphrase ? : } Host: {' '} {certificate.host} this._handleToggleCertificate(certificate)}> {certificate.disabled ? : } this._handleDeleteCertificate(certificate)}> ))} Add Certificate ) : ( Host (port optional) PFX (or PKCS12) Or CRT File Key File Passphrase Cancel {' '} Add Certificate )} ); } render () { const {workspace} = this.props; return ( {workspace ? this.renderModalHeader() : null} {workspace ? this.renderModalBody() : null} ); } } WorkspaceSettingsModal.propTypes = { handleRemoveWorkspace: PropTypes.func.isRequired, workspace: PropTypes.object.isRequired }; export default WorkspaceSettingsModal;
You have not yet added any certificates