import React from 'react'; import PropTypes from 'prop-types'; import { gettext } from '../../utils/constants'; import { Button, Modal, ModalHeader, Input, ModalBody, ModalFooter, Alert } from 'reactstrap'; const propTypes = { wiki: PropTypes.object, onRename: PropTypes.func.isRequired, toggleCancel: PropTypes.func.isRequired, }; class RenameWikiDialog extends React.Component { constructor(props) { super(props); this.state = { newName: props.wiki.name, errMessage: '', isSubmitBtnActive: false, }; this.newInput = React.createRef(); } handleChange = (e) => { this.setState({ isSubmitBtnActive: !!e.target.value.trim(), newName: e.target.value }); }; handleSubmit = () => { let { isValid, errMessage } = this.validateInput(); if (!isValid) { this.setState({ errMessage: errMessage }); } else { this.props.onRename(this.state.newName.trim()); } }; handleKeyDown = (e) => { if (e.key === 'Enter') { this.handleSubmit(); } }; toggle = () => { this.props.toggleCancel(); }; validateInput = () => { let newName = this.state.newName.trim(); let isValid = true; let errMessage = ''; if (!newName) { isValid = false; errMessage = gettext('Name is required.'); return { isValid, errMessage }; } if (newName.indexOf('/') > -1) { isValid = false; errMessage = gettext('Name should not include ' + '\'/\'' + '.'); return { isValid, errMessage }; } return { isValid, errMessage }; }; render() { return ( {gettext('Rename Wiki')}

{gettext('New Wiki name')}

{this.state.errMessage && {this.state.errMessage}}
); } } RenameWikiDialog.propTypes = propTypes; export default RenameWikiDialog;