Adds illustrations for manual actions and non triggered jobs

1 files changed, 46 insertions, 32 deletions

diff --git a/app/views/projects/jobs/show.html.haml b/app/views/projects/jobs/show.html.haml
index 1d0aaa47b60..f7d06d8ceb9 100644
--- a/app/views/projects/jobs/show.html.haml
+++ b/app/views/projects/jobs/show.html.haml
@@ -54,41 +54,55 @@
             Job has been erased by #{link_to(@build.erased_by_name, user_path(@build.erased_by))} #{time_ago_with_tooltip(@build.erased_at)}
           - else
             Job has been erased #{time_ago_with_tooltip(@build.erased_at)}
+    - if @build.started?
+      .build-trace-container.prepend-top-default
+        .top-bar.js-top-bar
+          .js-truncated-info.truncated-info.hidden-xs.pull-left.hidden<
+            Showing last
+            %span.js-truncated-info-size.truncated-info-size><
+            KiB of log -
+            %a.js-raw-link.raw-link{ href: raw_project_job_path(@project, @build) }>< Complete Raw
 
-    .build-trace-container.prepend-top-default
-      .top-bar.js-top-bar
-        .js-truncated-info.truncated-info.hidden-xs.pull-left.hidden<
-          Showing last
-          %span.js-truncated-info-size.truncated-info-size><
-          KiB of log -
-          %a.js-raw-link.raw-link{ href: raw_project_job_path(@project, @build) }>< Complete Raw
+          .controllers.pull-right
+            - if @build.has_trace?
+              = link_to raw_project_job_path(@project, @build),
+                      title: 'Show complete raw',
+                      data: { placement: 'top', container: 'body' },
+                      class: 'js-raw-link-controller has-tooltip controllers-buttons' do
+                = icon('file-text-o')
 
-        .controllers.pull-right
-          - if @build.has_trace?
-            = link_to raw_project_job_path(@project, @build),
-                    title: 'Show complete raw',
-                    data: { placement: 'top', container: 'body' },
-                    class: 'js-raw-link-controller has-tooltip controllers-buttons' do
-              = icon('file-text-o')
-
-          - if @build.erasable? && can?(current_user, :erase_build, @build)
-            = link_to erase_project_job_path(@project, @build),
-                      method: :post,
-                      data: { confirm: 'Are you sure you want to erase this build?', placement: 'top', container: 'body' },
-                      title: 'Erase job log',
-                      class: 'has-tooltip js-erase-link controllers-buttons' do
-              = icon('trash')
-          .has-tooltip.controllers-buttons{ title: 'Scroll to top', data: { placement: 'top', container: 'body'} }
-            %button.js-scroll-up.btn-scroll.btn-transparent.btn-blank{ type: 'button', disabled: true }
-              = custom_icon('scroll_up')
-          .has-tooltip.controllers-buttons{ title: 'Scroll to bottom', data: { placement: 'top', container: 'body'} }
-            %button.js-scroll-down.btn-scroll.btn-transparent.btn-blank{ type: 'button', disabled: true }
-              = custom_icon('scroll_down')
-
-      %pre.build-trace#build-trace
-        %code.bash.js-build-output
-        .build-loader-animation.js-build-refresh
+            - if @build.erasable? && can?(current_user, :erase_build, @build)
+              = link_to erase_project_job_path(@project, @build),
+                        method: :post,
+                        data: { confirm: 'Are you sure you want to erase this build?', placement: 'top', container: 'body' },
+                        title: 'Erase job log',
+                        class: 'has-tooltip js-erase-link controllers-buttons' do
+                = icon('trash')
+            .has-tooltip.controllers-buttons{ title: 'Scroll to top', data: { placement: 'top', container: 'body'} }
+              %button.js-scroll-up.btn-scroll.btn-transparent.btn-blank{ type: 'button', disabled: true }
+                = custom_icon('scroll_up')
+            .has-tooltip.controllers-buttons{ title: 'Scroll to bottom', data: { placement: 'top', container: 'body'} }
+              %button.js-scroll-down.btn-scroll.btn-transparent.btn-blank{ type: 'button', disabled: true }
+                = custom_icon('scroll_down')
 
+        %pre.build-trace#build-trace
+          %code.bash.js-build-output
+          .build-loader-animation.js-build-refresh
+    - else
+      - illustration = @build.playable? ? 'illustrations/manual_action.svg' : 'illustrations/job_not_triggered.svg'
+      - title = @build.playable? ? _('This job requires a manual action') : _('This job has not been triggered yet')
+      - content = @build.playable? ? _('This job depends on a user to trigger its process. Often they are used to deploy code to production environments.') : _('This job depends on upstream jobs that need to succeed in order for this job to be triggered.')
+      .row.empty-state
+        .col-xs-12
+          .svg-content
+            = image_tag illustration
+        .col-xs-12
+          .text-content
+            %h4.text-center= title
+            %p= content
+            - if @build.playable?
+              .text-center
+                = link_to _('Trigger this manual action'), play_project_job_path(@project, @build), class: 'btn btn-primary', title: _('Trigger this manual action')
 
   = render "sidebar"