diff options
author | Sean McGivern <sean@gitlab.com> | 2018-10-09 14:13:28 +0300 |
---|---|---|
committer | Sean McGivern <sean@gitlab.com> | 2018-10-12 14:37:18 +0300 |
commit | 22d6ad7550a897e5a60249f3a5944883f1386fc1 (patch) | |
tree | e784d9727fcd5ca57031a5580cddf4730536a6a2 | |
parent | 0c9a6c348b86bcebe72047b93bf46f4a49f998f8 (diff) |
Show if the host is a canary host in the perf bar
If the request came from a canary host, show this in the performance bar
by:
1. Adding a bird emoji.
2. Colouring the hostname yellow.
5 files changed, 28 insertions, 2 deletions
diff --git a/app/assets/javascripts/performance_bar/components/performance_bar_app.vue b/app/assets/javascripts/performance_bar/components/performance_bar_app.vue index 1522e2227e4..300d453c174 100644 --- a/app/assets/javascripts/performance_bar/components/performance_bar_app.vue +++ b/app/assets/javascripts/performance_bar/components/performance_bar_app.vue @@ -1,5 +1,6 @@ <script> import $ from 'jquery'; +import { glEmojiTag } from '~/emoji'; import detailedMetric from './detailed_metric.vue'; import requestSelector from './request_selector.vue'; @@ -64,6 +65,16 @@ export default { lineProfileModal() { return $('#modal-peek-line-profile'); }, + hasHost() { + return this.currentRequest && this.currentRequest.details && this.currentRequest.details.host; + }, + birdEmoji() { + if (this.hasHost && this.currentRequest.details.host.canary) { + return glEmojiTag('baby_chick'); + } + + return ''; + }, }, mounted() { this.currentRequest = this.requestId; @@ -93,9 +104,11 @@ export default { class="view" > <span - v-if="currentRequest.details" + v-if="hasHost" class="current-host" + :class="{ 'canary' : currentRequest.details.host.canary }" > + <span v-html="birdEmoji"></span> {{ currentRequest.details.host.hostname }} </span> </div> diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss index b7a95f604b8..0fde6e18cc7 100644 --- a/app/assets/stylesheets/framework/variables.scss +++ b/app/assets/stylesheets/framework/variables.scss @@ -605,6 +605,7 @@ $perf-bar-development: #4c1210; $perf-bar-bucket-bg: #111; $perf-bar-bucket-box-shadow-from: rgba($white-light, 0.2); $perf-bar-bucket-box-shadow-to: rgba($black, 0.25); +$perf-bar-canary-text: $orange-400; /* Issuable warning diff --git a/app/assets/stylesheets/performance_bar.scss b/app/assets/stylesheets/performance_bar.scss index 59fdbf31fe9..9c01a2f8bda 100644 --- a/app/assets/stylesheets/performance_bar.scss +++ b/app/assets/stylesheets/performance_bar.scss @@ -68,6 +68,10 @@ } } + .current-host.canary { + color: $perf-bar-canary-text; + } + strong { color: $white-light; } diff --git a/changelogs/unreleased/52421-show-canary-no-canary-in-the-performance-bar.yml b/changelogs/unreleased/52421-show-canary-no-canary-in-the-performance-bar.yml new file mode 100644 index 00000000000..20e32a2e987 --- /dev/null +++ b/changelogs/unreleased/52421-show-canary-no-canary-in-the-performance-bar.yml @@ -0,0 +1,5 @@ +--- +title: Show canary status in the performance bar +merge_request: 22222 +author: +type: changed diff --git a/lib/peek/views/host.rb b/lib/peek/views/host.rb index 43c8a35c7ea..4fc70fbcebc 100644 --- a/lib/peek/views/host.rb +++ b/lib/peek/views/host.rb @@ -2,7 +2,10 @@ module Peek module Views class Host < View def results - { hostname: Gitlab::Environment.hostname } + { + hostname: Gitlab::Environment.hostname, + canary: Gitlab::Utils.to_boolean(ENV['CANARY']) + } end end end |