import DropLab from './droplab/drop_lab'; import ISetter from './droplab/plugins/input_setter'; // Todo: Remove this when fixing issue in input_setter plugin const InputSetter = { ...ISetter }; class CloseReopenReportToggle { constructor(opts = {}) { this.dropdownTrigger = opts.dropdownTrigger; this.dropdownList = opts.dropdownList; this.button = opts.button; } initDroplab() { this.reopenItem = this.dropdownList.querySelector('.reopen-item'); this.closeItem = this.dropdownList.querySelector('.close-item'); this.droplab = new DropLab(); const config = this.setConfig(); this.droplab.init(this.dropdownTrigger, this.dropdownList, [InputSetter], config); } updateButton(isClosed) { this.toggleButtonType(isClosed); this.button.blur(); } toggleButtonType(isClosed) { const [showItem, hideItem] = this.getButtonTypes(isClosed); showItem.classList.remove('hidden'); showItem.classList.add('droplab-item-selected'); hideItem.classList.add('hidden'); hideItem.classList.remove('droplab-item-selected'); showItem.click(); } getButtonTypes(isClosed) { return isClosed ? [this.reopenItem, this.closeItem] : [this.closeItem, this.reopenItem]; } setDisable(shouldDisable = true) { if (shouldDisable) { this.button.setAttribute('disabled', 'true'); this.dropdownTrigger.setAttribute('disabled', 'true'); } else { this.button.removeAttribute('disabled'); this.dropdownTrigger.removeAttribute('disabled'); } } setConfig() { const config = { InputSetter: [ { input: this.button, valueAttribute: 'data-text', inputAttribute: 'data-value', }, { input: this.button, valueAttribute: 'data-text', inputAttribute: 'title', }, { input: this.button, valueAttribute: 'data-button-class', inputAttribute: 'class', }, { input: this.dropdownTrigger, valueAttribute: 'data-toggle-class', inputAttribute: 'class', }, { input: this.button, valueAttribute: 'data-url', inputAttribute: 'data-endpoint', }, ], }; return config; } } export default CloseReopenReportToggle;