Create instance_statistics namespace and move convdev index and cohorts to it

8 files changed, 141 insertions, 0 deletions

diff --git a/app/views/instance_statistics/cohorts/_cohorts_table.html.haml b/app/views/instance_statistics/cohorts/_cohorts_table.html.haml
new file mode 100644
index 00000000000..701a4e62b39
--- /dev/null
+++ b/app/views/instance_statistics/cohorts/_cohorts_table.html.haml
@@ -0,0 +1,28 @@
+.bs-callout.clearfix
+  %p
+    User cohorts are shown for the last #{@cohorts[:months_included]}
+    months. Only users with activity are counted in the cohort total; inactive
+    users are counted separately.
+    = link_to icon('question-circle'), help_page_path('user/admin_area/user_cohorts', anchor: 'cohorts'), title: 'About this feature', target: '_blank'
+
+.table-holder
+  %table.table
+    %thead
+      %tr
+        %th Registration month
+        %th Inactive users
+        %th Cohort total
+        - @cohorts[:months_included].times do |i|
+          %th Month #{i}
+    %tbody
+      - @cohorts[:cohorts].each do |cohort|
+        %tr
+          %td= cohort[:registration_month]
+          %td= cohort[:inactive]
+          %td= cohort[:total]
+          - cohort[:activity_months].each do |activity_month|
+            %td
+              - next if cohort[:total] == '0'
+              = activity_month[:percentage]
+              %br
+              = activity_month[:total]
diff --git a/app/views/instance_statistics/cohorts/_usage_ping.html.haml b/app/views/instance_statistics/cohorts/_usage_ping.html.haml
new file mode 100644
index 00000000000..3dda386fcf7
--- /dev/null
+++ b/app/views/instance_statistics/cohorts/_usage_ping.html.haml
@@ -0,0 +1,10 @@
+%h2#usage-ping Usage ping
+
+.bs-callout.clearfix
+  %p
+    User cohorts are shown because the usage ping is enabled. The data sent with
+    this is shown below. To disable this, visit
+    = succeed '.' do
+      = link_to 'application settings', admin_application_settings_path(anchor: 'usage-statistics')
+
+%pre.usage-data.js-syntax-highlight.code.highlight{ data: { endpoint: usage_data_admin_application_settings_path(format: :html) } }
diff --git a/app/views/instance_statistics/cohorts/index.html.haml b/app/views/instance_statistics/cohorts/index.html.haml
new file mode 100644
index 00000000000..5e9a8c083af
--- /dev/null
+++ b/app/views/instance_statistics/cohorts/index.html.haml
@@ -0,0 +1,16 @@
+- breadcrumb_title "Cohorts"
+- @no_container = true
+
+%div{ class: container_class }
+  - if @cohorts
+    = render 'cohorts_table'
+    = render 'usage_ping'
+  - else
+    .bs-callout.bs-callout-warning.clearfix
+      %p
+        User cohorts are only shown when the
+        = link_to 'usage ping', help_page_path('user/admin_area/settings/usage_statistics', anchor: 'usage-ping'), target: '_blank'
+        is enabled. To enable it and see user cohorts,
+        visit
+        = succeed '.' do
+          = link_to 'application settings', admin_application_settings_path(anchor: 'usage-statistics')
diff --git a/app/views/instance_statistics/conversational_development_index/_callout.html.haml b/app/views/instance_statistics/conversational_development_index/_callout.html.haml
new file mode 100644
index 00000000000..33a4dab1e00
--- /dev/null
+++ b/app/views/instance_statistics/conversational_development_index/_callout.html.haml
@@ -0,0 +1,13 @@
+.prepend-top-default
+.user-callout{ data: { uid: 'convdev_intro_callout_dismissed' } }
+  .bordered-box.landing.content-block
+    %button.btn.btn-default.close.js-close-callout{ type: 'button',
+      'aria-label' => 'Dismiss ConvDev introduction' }
+      = icon('times', class: 'dismiss-icon', 'aria-hidden' => 'true')
+    .user-callout-copy
+      %h4
+        Introducing Your Conversational Development Index
+      %p
+        Your Conversational Development Index gives an overview of how you are using GitLab from a feature perspective. View how you compare with other organizations, discover features you are not using, and learn best practices through blog posts and white papers.
+    .svg-container.convdev
+      = custom_icon('convdev_overview')
diff --git a/app/views/instance_statistics/conversational_development_index/_card.html.haml b/app/views/instance_statistics/conversational_development_index/_card.html.haml
new file mode 100644
index 00000000000..57eda06630b
--- /dev/null
+++ b/app/views/instance_statistics/conversational_development_index/_card.html.haml
@@ -0,0 +1,25 @@
+.convdev-card-wrapper
+  .convdev-card{ class: "convdev-card-#{score_level(card.percentage_score)}" }
+    .convdev-card-title
+      %h3
+        = card.title
+      .light-text
+        = card.description
+    .board-card-scores
+      .board-card-score
+        .board-card-score-value
+          = format_score(card.instance_score)
+        .board-card-score-name You
+      .board-card-score
+        .board-card-score-value
+          = format_score(card.leader_score)
+        .board-card-score-name Lead
+    .board-card-score-big
+      = number_to_percentage(card.percentage_score, precision: 1)
+    .board-card-buttons
+      - if card.blog
+        %a{ href: card.blog }
+          = icon('info-circle', 'aria-hidden' => 'true')
+      - if card.docs
+        %a{ href: card.docs }
+          = icon('question-circle', 'aria-hidden' => 'true')
diff --git a/app/views/instance_statistics/conversational_development_index/_disabled.html.haml b/app/views/instance_statistics/conversational_development_index/_disabled.html.haml
new file mode 100644
index 00000000000..0a741b50960
--- /dev/null
+++ b/app/views/instance_statistics/conversational_development_index/_disabled.html.haml
@@ -0,0 +1,9 @@
+.container.convdev-empty
+  .col-sm-12.justify-content-center.text-center
+    = custom_icon('convdev_no_index')
+    %h4 Usage ping is not enabled
+    %p
+      ConvDev is only shown when the
+      = link_to 'usage ping', help_page_path('user/admin_area/settings/usage_statistics'), target: '_blank'
+      is enabled. Enable usage ping to get an overview of how you are using GitLab from a feature perspective
+    = link_to 'Enable usage ping', admin_application_settings_path(anchor: 'usage-statistics'), class: 'btn btn-primary'
diff --git a/app/views/instance_statistics/conversational_development_index/_no_data.html.haml b/app/views/instance_statistics/conversational_development_index/_no_data.html.haml
new file mode 100644
index 00000000000..d69c46194b4
--- /dev/null
+++ b/app/views/instance_statistics/conversational_development_index/_no_data.html.haml
@@ -0,0 +1,7 @@
+.container.convdev-empty
+  .col-sm-12.justify-content-center.text-center
+    = custom_icon('convdev_no_data')
+    %h4 Data is still calculating...
+    %p
+      In order to gather accurate feature usage data, it can take 1 to 2 weeks to see your index.
+      = link_to 'Learn more', help_page_path('user/admin_area/monitoring/convdev'), target: '_blank'
diff --git a/app/views/instance_statistics/conversational_development_index/index.html.haml b/app/views/instance_statistics/conversational_development_index/index.html.haml
new file mode 100644
index 00000000000..e3d1aa31dc2
--- /dev/null
+++ b/app/views/instance_statistics/conversational_development_index/index.html.haml
@@ -0,0 +1,33 @@
+- @no_container = true
+- page_title 'ConvDev Index'
+
+.container
+  - if show_callout?('convdev_intro_callout_dismissed')
+    = render 'callout'
+
+  .prepend-top-default
+  - if !Gitlab::CurrentSettings.usage_ping_enabled
+    = render 'disabled'
+  - elsif @metric.blank?
+    = render 'no_data'
+  - else
+    .convdev
+      .convdev-header
+        %h2.convdev-header-title{ class: "convdev-#{score_level(@metric.average_percentage_score)}-score" }
+          = number_to_percentage(@metric.average_percentage_score, precision: 1)
+        .convdev-header-subtitle
+          index
+          %br
+          score
+          = link_to icon('question-circle', 'aria-hidden' => 'true'), help_page_path('user/admin_area/monitoring/convdev')
+
+      .convdev-cards.board-card-container
+        - @metric.cards.each do |card|
+          = render 'card', card: card
+
+      .convdev-steps.d-none.d-lg-block.d-xl-block
+        - @metric.idea_to_production_steps.each_with_index do |step, index|
+          .convdev-step{ class: "convdev-#{score_level(step.percentage_score)}-score" }
+            = custom_icon("i2p_step_#{index + 1}")
+            %h4.convdev-step-title
+              = step.title