import { __ } from './locale'; import axios from './lib/utils/axios_utils'; import flash from './flash'; class ImporterStatus { constructor(jobsUrl, importUrl) { this.jobsUrl = jobsUrl; this.importUrl = importUrl; this.initStatusPage(); this.setAutoUpdate(); } initStatusPage() { $('.js-add-to-import') .off('click') .on('click', this.addToImport.bind(this)); $('.js-import-all') .off('click') .on('click', function onClickImportAll() { const $btn = $(this); $btn.disable().addClass('is-loading'); return $('.js-add-to-import').each(function triggerAddImport() { return $(this).trigger('click'); }); }); } addToImport(event) { const $btn = $(event.currentTarget); const $tr = $btn.closest('tr'); const $targetField = $tr.find('.import-target'); const $namespaceInput = $targetField.find('.js-select-namespace option:selected'); const id = $tr.attr('id').replace('repo_', ''); let targetNamespace; let newName; if ($namespaceInput.length > 0) { targetNamespace = $namespaceInput[0].innerHTML; newName = $targetField.find('#path').prop('value'); $targetField.empty().append(`${targetNamespace}/${newName}`); } $btn.disable().addClass('is-loading'); return axios.post(this.importUrl, { repo_id: id, target_namespace: targetNamespace, new_name: newName, }) .then(({ data }) => { const job = $(`tr#repo_${id}`); job.attr('id', `project_${data.id}`); job.find('.import-target').html(`${data.full_path}`); $('table.import-jobs tbody').prepend(job); job.addClass('active'); job.find('.import-actions').html(' started'); }) .catch(() => flash(__('An error occurred while importing project'))); } autoUpdate() { return axios.get(this.jobsUrl) .then(({ data = [] }) => { data.forEach((job) => { const jobItem = $(`#project_${job.id}`); const statusField = jobItem.find('.job-status'); const spinner = ''; switch (job.import_status) { case 'finished': jobItem.removeClass('active').addClass('success'); statusField.html(' done'); break; case 'scheduled': statusField.html(`${spinner} scheduled`); break; case 'started': statusField.html(`${spinner} started`); break; default: statusField.html(job.import_status); break; } }); }); } setAutoUpdate() { setInterval(this.autoUpdate.bind(this), 4000); } } // eslint-disable-next-line consistent-return function initImporterStatus() { const importerStatus = document.querySelector('.js-importer-status'); if (importerStatus) { const data = importerStatus.dataset; return new ImporterStatus(data.jobsImportPath, data.importPath); } } export { initImporterStatus as default, ImporterStatus, };