Add view to handle the case when user doesn’t have access to stage

3 files changed, 23 insertions, 10 deletions

diff --git a/app/views/projects/cycle_analytics/_empty_stage.html.haml b/app/views/projects/cycle_analytics/_empty_stage.html.haml
index f839ec9c018..06c42bff576 100644
--- a/app/views/projects/cycle_analytics/_empty_stage.html.haml
+++ b/app/views/projects/cycle_analytics/_empty_stage.html.haml
@@ -1,7 +1,7 @@
 .empty-stage-container
   .empty-stage
     .icon-no-data
-      = render "shared/icons/icon_no_data.svg"
+      = custom_icon ('icon_no_data')
     %h4 We don’t have enough data to show this stage.
     %p
       The test phase measures the median time to run the entire pipeline for that project.
diff --git a/app/views/projects/cycle_analytics/_no_access.html.haml b/app/views/projects/cycle_analytics/_no_access.html.haml
new file mode 100644
index 00000000000..eb8df59748b
--- /dev/null
+++ b/app/views/projects/cycle_analytics/_no_access.html.haml
@@ -0,0 +1,7 @@
+.no-access-stage-container
+  .no-access-stage
+    .icon-lock
+      = custom_icon ('icon_lock')
+    %h4 You need permission.
+    %p
+      Want to see the data? Please ask administer for access.
diff --git a/app/views/projects/cycle_analytics/show.html.haml b/app/views/projects/cycle_analytics/show.html.haml
index 50255fe7a29..da9823e78fe 100644
--- a/app/views/projects/cycle_analytics/show.html.haml
+++ b/app/views/projects/cycle_analytics/show.html.haml
@@ -72,15 +72,21 @@
                 .stage-name
                   {{ stage.title }}
                 .stage-median
-                  %template{ "v-if" => "stage.value" }
-                    {{ stage.value }}
-                  %template{ "v-else" => true }
-                    %span.stage-empty
+                  %template{ "v-if" => "stage.isUserAllowed" }
+                    %span{ "v-if" => "stage.value" }
+                      {{ stage.value }}
+                    %span.stage-empty{ "v-else" => true }
                       No enough data
+                  %template{ "v-else" => true }
+                    %span.not-available
+                      Not available
           .section.stage-events
             %template{ "v-if" => "isLoadingStage" }
-              = icon("spinner spin", "v-show" => "isLoadingStage")
-            %template{ "v-if" => "isEmptyStage && !isLoadingStage" }
-              = render partial: "empty_stage"
-            %template{ "v-if" => "state.events.length && !isLoadingStage && !isEmptyStage" }
-              %component{ ":is" => "currentStage.component", ":stage" => "currentStage", ":items" => "state.events" }
+              = icon("spinner spin")
+            %template{ "v-if" => "currentStage && !currentStage.isUserAllowed" }
+              = render partial: "no_access"
+            %template{ "v-else" => true }
+              %template{ "v-if" => "isEmptyStage && !isLoadingStage" }
+                = render partial: "empty_stage"
+              %template{ "v-if" => "state.events.length && !isLoadingStage && !isEmptyStage" }
+                %component{ ":is" => "currentStage.component", ":stage" => "currentStage", ":items" => "state.events" }