Fix invisible rows on importer status

app/assets/javascripts/importer_status.js

@@ -58,7 +58,7 @@ class ImporterStatus {
       job.find('.import-target').html(`<a href="${data.full_path}">${data.full_path}</a>`);
       $('table.import-jobs tbody').prepend(job);
 
-      job.addClass('active');
+      job.addClass('table-active');
       const connectingVerb = this.ciCdOnly ? __('connecting') : __('importing');
       job.find('.import-actions').html(sprintf(
         _.escape(__('%{loadingIcon} Started')), {
@@ -81,7 +81,7 @@ class ImporterStatus {
 
           switch (job.import_status) {
             case 'finished':
-              jobItem.removeClass('active').addClass('success');
+              jobItem.removeClass('table-active').addClass('table-success');
               statusField.html(`<span><i class="fa fa-check"></i> ${__('Done')}</span>`);
               break;
             case 'scheduled':

app/helpers/projects_helper.rb

@@ -389,11 +389,11 @@ module ProjectsHelper
   def project_status_css_class(status)
     case status
     when "started"
-      "active"
+      "table-active"
     when "failed"
-      "danger"
+      "table-danger"
     when "finished"
-      "success"
+      "table-success"
     end
   end
 

spec/helpers/projects_helper_spec.rb

@@ -5,9 +5,9 @@ describe ProjectsHelper do
 
   describe "#project_status_css_class" do
     it "returns appropriate class" do
-      expect(project_status_css_class("started")).to eq("active")
-      expect(project_status_css_class("failed")).to eq("danger")
-      expect(project_status_css_class("finished")).to eq("success")
+      expect(project_status_css_class("started")).to eq("table-active")
+      expect(project_status_css_class("failed")).to eq("table-danger")
+      expect(project_status_css_class("finished")).to eq("table-success")
     end
   end
 

spec/javascripts/importer_status_spec.js

@@ -45,7 +45,7 @@ describe('Importer Status', () => {
         currentTarget: document.querySelector('.js-add-to-import'),
       })
       .then(() => {
-        expect(document.querySelector('tr').classList.contains('active')).toEqual(true);
+        expect(document.querySelector('tr').classList.contains('table-active')).toEqual(true);
         done();
       })
       .catch(done.fail);