debian-mirror-gitlab/app/assets/javascripts/importer_status.js

150 lines
4.3 KiB
JavaScript
Raw Normal View History

2018-05-09 12:01:36 +05:30
import $ from 'jquery';
2018-03-27 19:54:05 +05:30
import _ from 'underscore';
import { __, sprintf } from './locale';
import axios from './lib/utils/axios_utils';
import flash from './flash';
import { convertPermissionToBoolean } from './lib/utils/common_utils';
2018-03-17 18:26:18 +05:30
class ImporterStatus {
2018-03-27 19:54:05 +05:30
constructor({ jobsUrl, importUrl, ciCdOnly }) {
2018-03-17 18:26:18 +05:30
this.jobsUrl = jobsUrl;
this.importUrl = importUrl;
2018-03-27 19:54:05 +05:30
this.ciCdOnly = ciCdOnly;
2018-03-17 18:26:18 +05:30
this.initStatusPage();
this.setAutoUpdate();
}
2017-08-17 22:00:37 +05:30
2018-03-17 18:26:18 +05:30
initStatusPage() {
$('.js-add-to-import')
.off('click')
2018-03-27 19:54:05 +05:30
.on('click', this.addToImport.bind(this));
2018-03-17 18:26:18 +05:30
$('.js-import-all')
.off('click')
.on('click', function onClickImportAll() {
const $btn = $(this);
2016-09-13 17:45:13 +05:30
$btn.disable().addClass('is-loading');
2018-03-17 18:26:18 +05:30
return $('.js-add-to-import').each(function triggerAddImport() {
2016-09-13 17:45:13 +05:30
return $(this).trigger('click');
});
});
2018-03-17 18:26:18 +05:30
}
2018-03-27 19:54:05 +05:30
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_', '');
2018-11-18 11:00:15 +05:30
const repoData = $tr.data();
2018-03-27 19:54:05 +05:30
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');
2018-11-18 11:00:15 +05:30
this.id = id;
let attributes = {
2018-03-27 19:54:05 +05:30
repo_id: id,
target_namespace: targetNamespace,
new_name: newName,
ci_cd_only: this.ciCdOnly,
2018-11-18 11:00:15 +05:30
};
if (repoData) {
attributes = Object.assign(repoData, attributes);
}
2018-12-13 13:39:08 +05:30
return axios
.post(this.importUrl, attributes)
.then(({ data }) => {
const job = $(`tr#repo_${id}`);
job.attr('id', `project_${data.id}`);
job.find('.import-target').html(`<a href="${data.full_path}">${data.full_path}</a>`);
$('table.import-jobs tbody').prepend(job);
job.addClass('table-active');
const connectingVerb = this.ciCdOnly ? __('connecting') : __('importing');
job.find('.import-actions').html(
sprintf(
_.escape(__('%{loadingIcon} Started')),
{
loadingIcon: `<i class="fa fa-spinner fa-spin" aria-label="${_.escape(
connectingVerb,
)}"></i>`,
},
false,
),
);
})
.catch(error => {
let details = error;
const $statusField = $(`#repo_${this.id} .job-status`);
$statusField.text(__('Failed'));
if (error.response && error.response.data && error.response.data.errors) {
details = error.response.data.errors;
}
flash(sprintf(__('An error occurred while importing project: %{details}'), { details }));
});
2018-03-27 19:54:05 +05:30
}
autoUpdate() {
2018-12-13 13:39:08 +05:30
return axios.get(this.jobsUrl).then(({ data = [] }) => {
data.forEach(job => {
const jobItem = $(`#project_${job.id}`);
const statusField = jobItem.find('.job-status');
const spinner = '<i class="fa fa-spinner fa-spin"></i>';
switch (job.import_status) {
case 'finished':
jobItem.removeClass('table-active').addClass('table-success');
statusField.html(`<span><i class="fa fa-check"></i> ${__('Done')}</span>`);
break;
case 'scheduled':
statusField.html(`${spinner} ${__('Scheduled')}`);
break;
case 'started':
statusField.html(`${spinner} ${__('Started')}`);
break;
case 'failed':
statusField.html(__('Failed'));
break;
default:
statusField.html(job.import_status);
break;
}
2018-03-27 19:54:05 +05:30
});
2018-12-13 13:39:08 +05:30
});
2018-03-27 19:54:05 +05:30
}
setAutoUpdate() {
setInterval(this.autoUpdate.bind(this), 4000);
2018-03-17 18:26:18 +05:30
}
}
2016-09-13 17:45:13 +05:30
2018-03-17 18:26:18 +05:30
// eslint-disable-next-line consistent-return
2018-03-27 19:54:05 +05:30
function initImporterStatus() {
2018-03-17 18:26:18 +05:30
const importerStatus = document.querySelector('.js-importer-status');
2016-09-29 09:46:39 +05:30
2018-03-17 18:26:18 +05:30
if (importerStatus) {
const data = importerStatus.dataset;
2018-03-27 19:54:05 +05:30
return new ImporterStatus({
jobsUrl: data.jobsImportPath,
importUrl: data.importPath,
ciCdOnly: convertPermissionToBoolean(data.ciCdOnly),
});
2018-03-17 18:26:18 +05:30
}
}
2018-03-27 19:54:05 +05:30
2018-12-13 13:39:08 +05:30
export { initImporterStatus as default, ImporterStatus };