From de8f12d74faef5fa3f9e38d1340948cab2d06ea3 Mon Sep 17 00:00:00 2001 From: Georgios Andreadis Date: Wed, 1 Jul 2020 13:33:31 +0200 Subject: Manually generate IDs --- frontend/src/components/modals/Modal.js | 226 ++++++++++++++++---------------- 1 file changed, 113 insertions(+), 113 deletions(-) (limited to 'frontend/src/components/modals/Modal.js') diff --git a/frontend/src/components/modals/Modal.js b/frontend/src/components/modals/Modal.js index 19337db8..ec6080f2 100644 --- a/frontend/src/components/modals/Modal.js +++ b/frontend/src/components/modals/Modal.js @@ -1,132 +1,132 @@ -import classNames from "classnames"; -import PropTypes from "prop-types"; -import React from "react"; -import jQuery from "../../util/jquery"; +import classNames from 'classnames' +import PropTypes from 'prop-types' +import React from 'react' +import jQuery from '../../util/jquery' class Modal extends React.Component { - static propTypes = { - title: PropTypes.string.isRequired, - show: PropTypes.bool.isRequired, - onSubmit: PropTypes.func.isRequired, - onCancel: PropTypes.func.isRequired, - submitButtonType: PropTypes.string, - submitButtonText: PropTypes.string - }; - static defaultProps = { - submitButtonType: "primary", - submitButtonText: "Save" - }; - static idCounter = 0; + static propTypes = { + title: PropTypes.string.isRequired, + show: PropTypes.bool.isRequired, + onSubmit: PropTypes.func.isRequired, + onCancel: PropTypes.func.isRequired, + submitButtonType: PropTypes.string, + submitButtonText: PropTypes.string, + } + static defaultProps = { + submitButtonType: 'primary', + submitButtonText: 'Save', + } + static idCounter = 0 - // Local, up-to-date copy of modal visibility for time between close event and a props update (to prevent duplicate - // 'close' triggers) - visible = false; + // Local, up-to-date copy of modal visibility for time between close event and a props update (to prevent duplicate + // 'close' triggers) + visible = false - constructor(props) { - super(props); - this.id = "modal-" + Modal.idCounter++; - } + constructor(props) { + super(props) + this.id = 'modal-' + Modal.idCounter++ + } - componentDidMount() { - this.visible = this.props.show; - this.openOrCloseModal(); + componentDidMount() { + this.visible = this.props.show + this.openOrCloseModal() - // Trigger auto-focus - jQuery("#" + this.id) - .on("shown.bs.modal", function() { - jQuery(this) - .find("input") - .first() - .focus(); - }) - .on("hide.bs.modal", () => { - if (this.visible) { - this.props.onCancel(); - } - }) - .on("keydown", e => { - e.stopPropagation(); - }); - } + // Trigger auto-focus + jQuery('#' + this.id) + .on('shown.bs.modal', function() { + jQuery(this) + .find('input') + .first() + .focus() + }) + .on('hide.bs.modal', () => { + if (this.visible) { + this.props.onCancel() + } + }) + .on('keydown', e => { + e.stopPropagation() + }) + } - componentDidUpdate() { - this.visible = this.props.show; - this.openOrCloseModal(); - } + componentDidUpdate() { + this.visible = this.props.show + this.openOrCloseModal() + } - onSubmit() { - if (this.visible) { - this.props.onSubmit(); - this.visible = false; - this.closeModal(); + onSubmit() { + if (this.visible) { + this.props.onSubmit() + this.visible = false + this.closeModal() + } } - } - onCancel() { - if (this.visible) { - this.props.onCancel(); - this.visible = false; - this.closeModal(); + onCancel() { + if (this.visible) { + this.props.onCancel() + this.visible = false + this.closeModal() + } } - } - openModal() { - jQuery("#" + this.id).modal("show"); - } + openModal() { + jQuery('#' + this.id).modal('show') + } - closeModal() { - jQuery("#" + this.id).modal("hide"); - } + closeModal() { + jQuery('#' + this.id).modal('hide') + } - openOrCloseModal() { - if (this.visible) { - this.openModal(); - } else { - this.closeModal(); + openOrCloseModal() { + if (this.visible) { + this.openModal() + } else { + this.closeModal() + } } - } - render() { - return ( -