Moves available runners check into a computed prop52202-consider-moving-isjobstuck-verification-to-backend

Adds a changelog entry

5 files changed, 45 insertions, 2 deletions

diff --git a/app/assets/javascripts/jobs/components/job_app.vue b/app/assets/javascripts/jobs/components/job_app.vue
index 9f7536fdfe1..ac19034f69d 100644
--- a/app/assets/javascripts/jobs/components/job_app.vue
+++ b/app/assets/javascripts/jobs/components/job_app.vue
@@ -81,6 +81,7 @@
         'emptyStateIllustration',
         'isScrollingDown',
         'emptyStateAction',
+        'hasRunnersForProject',
       ]),
 
       shouldRenderContent() {
@@ -196,7 +197,7 @@
         <stuck-block
           v-if="job.stuck"
           class="js-job-stuck"
-          :has-no-runners-for-project="job.runners.available && !job.runners.online"
+          :has-no-runners-for-project="hasRunnersForProject"
           :tags="job.tags"
           :runners-path="runnerSettingsUrl"
         />
diff --git a/app/assets/javascripts/jobs/store/getters.js b/app/assets/javascripts/jobs/store/getters.js
index b1a4d9e5647..4de01f8e532 100644
--- a/app/assets/javascripts/jobs/store/getters.js
+++ b/app/assets/javascripts/jobs/store/getters.js
@@ -44,5 +44,7 @@ export const emptyStateAction = state =>  (state.job && state.job.status && stat
 
 export const isScrollingDown = state => isScrolledToBottom() && !state.isTraceComplete;
 
+export const hasRunnersForProject = state => state.job.runners.available && !state.job.runners.online;
+
 // prevent babel-plugin-rewire from generating an invalid default during karma tests
 export default () => {};
diff --git a/changelogs/unreleased/52202-consider-moving-isjobstuck-verification-to-backend.yml b/changelogs/unreleased/52202-consider-moving-isjobstuck-verification-to-backend.yml
new file mode 100644
index 00000000000..0efd97d91b8
--- /dev/null
+++ b/changelogs/unreleased/52202-consider-moving-isjobstuck-verification-to-backend.yml
@@ -0,0 +1,5 @@
+---
+title: Renders stuck block when runners are stuck
+merge_request:
+author:
+type: fixed
diff --git a/spec/features/projects/jobs_spec.rb b/spec/features/projects/jobs_spec.rb
index 28778f25f22..365c9cb71b0 100644
--- a/spec/features/projects/jobs_spec.rb
+++ b/spec/features/projects/jobs_spec.rb
@@ -735,7 +735,7 @@ describe 'Jobs', :clean_gitlab_redis_shared_state do
 
         it 'renders message about job being stuck because no runners are active' do
           expect(page).to have_css('.js-stuck-no-active-runner')
-          expect(page).to have_content("This job is stuck, because you don\'t have any active runners that can run this job.")
+          expect(page).to have_content("This job is stuck, because you don't have any active runners that can run this job.")
         end
       end
 
diff --git a/spec/javascripts/jobs/store/getters_spec.js b/spec/javascripts/jobs/store/getters_spec.js
index 01cb846230d..34e9707eadd 100644
--- a/spec/javascripts/jobs/store/getters_spec.js
+++ b/spec/javascripts/jobs/store/getters_spec.js
@@ -174,4 +174,39 @@ describe('Job Store Getters', () => {
       });
     });
   });
+
+  describe('hasRunnersForProject', () => {
+    describe('with available and offline runners', () => {
+      it('returns true', () => {
+        localState.job.runners = {
+          available: true,
+          online: false
+        };
+
+        expect(getters.hasRunnersForProject(localState)).toEqual(true);
+      });
+    });
+
+    describe('with non available runners', () => {
+      it('returns false', () => {
+        localState.job.runners = {
+          available: false,
+          online: false
+        };
+
+        expect(getters.hasRunnersForProject(localState)).toEqual(false);
+      });
+    });
+
+    describe('with online runners', () => {
+      it('returns false', () => {
+        localState.job.runners = {
+          available: false,
+          online: true
+        };
+
+        expect(getters.hasRunnersForProject(localState)).toEqual(false);
+      });
+    });
+  });
 });