diff options
Diffstat (limited to 'server/sonar-web/src/main/js/apps/project-admin/deletion')
3 files changed, 79 insertions, 74 deletions
diff --git a/server/sonar-web/src/main/js/apps/project-admin/deletion/ConfirmationModal.js b/server/sonar-web/src/main/js/apps/project-admin/deletion/ConfirmationModal.js deleted file mode 100644 index 273850ea38b..00000000000 --- a/server/sonar-web/src/main/js/apps/project-admin/deletion/ConfirmationModal.js +++ /dev/null @@ -1,48 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2017 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -import ModalForm from '../../../components/common/modal-form'; -import Template from './ConfirmationModalTemplate.hbs'; -import { deleteProject } from '../../../api/components'; - -export default ModalForm.extend({ - template: Template, - - onFormSubmit() { - ModalForm.prototype.onFormSubmit.apply(this, arguments); - this.disableForm(); - this.showSpinner(); - - deleteProject(this.options.project.key) - .then(() => { - this.trigger('done'); - }) - .catch(function(e) { - e.response.json().then(r => { - this.hideSpinner(); - this.showErrors(r.errors, r.warnings); - this.enableForm(); - }); - }); - }, - - serializeData() { - return { project: this.options.project }; - } -}); diff --git a/server/sonar-web/src/main/js/apps/project-admin/deletion/ConfirmationModalTemplate.hbs b/server/sonar-web/src/main/js/apps/project-admin/deletion/ConfirmationModalTemplate.hbs deleted file mode 100644 index 749e408d5bc..00000000000 --- a/server/sonar-web/src/main/js/apps/project-admin/deletion/ConfirmationModalTemplate.hbs +++ /dev/null @@ -1,14 +0,0 @@ -<form id="deactivate-user-form" autocomplete="off"> - <div class="modal-head"> - <h2>{{t 'qualifiers.delete.TRK'}}</h2> - </div> - <div class="modal-body"> - <div class="js-modal-messages"></div> - {{tp 'project_deletion.delete_resource_confirmation' project.name}} - </div> - <div class="modal-foot"> - <i class="js-modal-spinner spinner spacer-right hidden"></i> - <button id="delete-project-confirm" class="button-red">{{t 'delete'}}</button> - <a href="#" class="js-modal-close">{{t 'cancel'}}</a> - </div> -</form> diff --git a/server/sonar-web/src/main/js/apps/project-admin/deletion/Form.js b/server/sonar-web/src/main/js/apps/project-admin/deletion/Form.js index 1a848accaee..ac8ca55598b 100644 --- a/server/sonar-web/src/main/js/apps/project-admin/deletion/Form.js +++ b/server/sonar-web/src/main/js/apps/project-admin/deletion/Form.js @@ -18,30 +18,97 @@ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ import React from 'react'; -import ConfirmationModal from './ConfirmationModal'; -import { translate } from '../../../helpers/l10n'; +import Modal from 'react-modal'; +import { deleteProject } from '../../../api/components'; +import { translate, translateWithParameters } from '../../../helpers/l10n'; export default class Form extends React.PureComponent { static propTypes = { component: React.PropTypes.object.isRequired }; - handleDelete(e) { - e.preventDefault(); - new ConfirmationModal({ project: this.props.component }) - .on('done', () => { - window.location = window.baseUrl + '/'; - }) - .render(); + static contextTypes = { + router: React.PropTypes.object + }; + + state = { loading: false, modalOpen: false }; + + componentDidMount() { + this.mounted = true; + } + + componentWillUnmount() { + this.mounted = false; } + handleDeleteClick = event => { + event.preventDefault(); + this.setState({ modalOpen: true }); + }; + + closeModal = () => this.setState({ modalOpen: false }); + + stopLoading = () => { + if (this.mounted) { + this.setState({ loading: false }); + } + }; + + handleSubmit = event => { + event.preventDefault(); + this.setState({ loading: true }); + deleteProject(this.props.component.key) + .then(() => this.context.router.replace('/')) + .catch(this.stopLoading); + }; + + handleCloseClick = (event: Event) => { + event.preventDefault(); + this.closeModal(); + }; + render() { + const { component } = this.props; + return ( - <form onSubmit={this.handleDelete.bind(this)}> - <button id="delete-project" className="button-red"> + <div> + <button id="delete-project" className="button-red" onClick={this.handleDeleteClick}> {translate('delete')} </button> - </form> + + {this.state.modalOpen && + <Modal + isOpen={true} + contentLabel="project deletion" + className="modal" + overlayClassName="modal-overlay" + onRequestClose={this.closeModal}> + <form onSubmit={this.handleSubmit}> + <div className="modal-head"> + <h2>{translate('qualifiers.delete.TRK')}</h2> + </div> + <div className="modal-body"> + <div className="js-modal-messages" /> + {translateWithParameters( + 'project_deletion.delete_resource_confirmation', + component.name + )} + </div> + <div className="modal-foot"> + {this.state.loading && <i className="js-modal-spinner spinner spacer-right" />} + <button + id="delete-project-confirm" + className="button-red" + disabled={this.state.loading}> + {translate('delete')} + </button> + <a href="#" className="js-modal-close" onClick={this.handleCloseClick}> + {translate('cancel')} + </a> + </div> + </form> + </Modal>} + </div> ); } } |