Add latest changes from gitlab-org/gitlab@master

3 files changed, 53 insertions, 35 deletions

diff --git a/app/assets/javascripts/error_tracking/components/error_tracking_list.vue b/app/assets/javascripts/error_tracking/components/error_tracking_list.vue
index 1d54c4a4264..3528f0a9335 100644
--- a/app/assets/javascripts/error_tracking/components/error_tracking_list.vue
+++ b/app/assets/javascripts/error_tracking/components/error_tracking_list.vue
@@ -7,10 +7,10 @@ import { __ } from '~/locale';
 
 export default {
   fields: [
-    { key: 'error', label: __('Open errors') },
+    { key: 'error', label: __('Open errors'), thClass: 'w-70p' },
     { key: 'events', label: __('Events') },
     { key: 'users', label: __('Users') },
-    { key: 'lastSeen', label: __('Last seen') },
+    { key: 'lastSeen', label: __('Last seen'), thClass: 'w-15p' },
   ],
   components: {
     GlEmptyState,
@@ -67,40 +67,39 @@ export default {
         <div class="d-flex justify-content-end">
           <gl-button class="my-3 ml-auto" variant="primary" :href="externalUrl" target="_blank">
             {{ __('View in Sentry') }}
-            <icon name="external-link" />
+            <icon name="external-link" class="flex-shrink-0" />
           </gl-button>
         </div>
-        <gl-table :items="errors" :fields="$options.fields" :show-empty="true">
+
+        <gl-table :items="errors" :fields="$options.fields" :show-empty="true" fixed stacked="sm">
           <template slot="HEAD_events" slot-scope="data">
-            <div class="text-right">{{ data.label }}</div>
+            <div class="text-md-right">{{ data.label }}</div>
           </template>
           <template slot="HEAD_users" slot-scope="data">
-            <div class="text-right">{{ data.label }}</div>
+            <div class="text-md-right">{{ data.label }}</div>
           </template>
           <template slot="error" slot-scope="errors">
             <div class="d-flex flex-column">
-              <div class="d-flex">
-                <gl-link :href="errors.item.externalUrl" class="d-flex text-dark" target="_blank">
-                  <strong>{{ errors.item.title.trim() }}</strong>
-                  <icon name="external-link" class="ml-1" />
-                </gl-link>
-                <span class="text-secondary ml-2">{{ errors.item.culprit }}</span>
-              </div>
-              {{ errors.item.message || __('No details available') }}
+              <gl-link :href="errors.item.externalUrl" class="d-flex text-dark" target="_blank">
+                <strong class="text-truncate">{{ errors.item.title.trim() }}</strong>
+                <icon name="external-link" class="ml-1 flex-shrink-0" />
+              </gl-link>
+              <span class="text-secondary text-truncate">
+                {{ errors.item.culprit }}
+              </span>
             </div>
           </template>
 
           <template slot="events" slot-scope="errors">
-            <div class="text-right">{{ errors.item.count }}</div>
+            <div class="text-md-right">{{ errors.item.count }}</div>
           </template>
 
           <template slot="users" slot-scope="errors">
-            <div class="text-right">{{ errors.item.userCount }}</div>
+            <div class="text-md-right">{{ errors.item.userCount }}</div>
           </template>
 
           <template slot="lastSeen" slot-scope="errors">
             <div class="d-flex align-items-center">
-              <icon name="calendar" class="text-secondary mr-1" />
               <time-ago :time="errors.item.lastSeen" class="text-secondary" />
             </div>
           </template>
diff --git a/app/assets/javascripts/labels_select.js b/app/assets/javascripts/labels_select.js
index 22b062563b5..72de3b5d726 100644
--- a/app/assets/javascripts/labels_select.js
+++ b/app/assets/javascripts/labels_select.js
@@ -32,6 +32,7 @@ export default class LabelsSelect {
         $selectbox,
         $sidebarCollapsedValue,
         $value,
+        $dropdownMenu,
         abilityName,
         defaultLabel,
         issueUpdateURL,
@@ -67,6 +68,7 @@ export default class LabelsSelect {
       $sidebarCollapsedValue = $block.find('.sidebar-collapsed-icon span');
       $sidebarLabelTooltip = $block.find('.js-sidebar-labels-tooltip');
       $value = $block.find('.value');
+      $dropdownMenu = $dropdown.parent().find('.dropdown-menu');
       $loading = $block.find('.block-loading').fadeOut();
       fieldName = $dropdown.data('fieldName');
       initialSelected = $selectbox
@@ -454,9 +456,21 @@ export default class LabelsSelect {
             }
 
             $loading.fadeIn();
+            const oldLabels = boardsStore.detail.issue.labels;
 
             boardsStore.detail.issue
               .update($dropdown.attr('data-issue-update'))
+              .then(() => {
+                if (isScopedLabel(label)) {
+                  const prevIds = oldLabels.map(label => label.id);
+                  const newIds = boardsStore.detail.issue.labels.map(label => label.id);
+                  const differentIds = _.difference(prevIds, newIds);
+                  $dropdown.data('marked', newIds);
+                  $dropdownMenu
+                    .find(differentIds.map(id => `[data-label-id="${id}"]`).join(','))
+                    .removeClass('is-active');
+                }
+              })
               .then(fadeOutLoader)
               .catch(fadeOutLoader);
           } else if (handleClick) {
diff --git a/app/assets/javascripts/snippet/snippet_embed.js b/app/assets/javascripts/snippet/snippet_embed.js
index fe08d2c7ebb..6606271c4fa 100644
--- a/app/assets/javascripts/snippet/snippet_embed.js
+++ b/app/assets/javascripts/snippet/snippet_embed.js
@@ -1,25 +1,30 @@
 import { __ } from '~/locale';
 
 export default () => {
-  const { protocol, host, pathname } = window.location;
   const shareBtn = document.querySelector('.js-share-btn');
-  const embedBtn = document.querySelector('.js-embed-btn');
-  const snippetUrlArea = document.querySelector('.js-snippet-url-area');
-  const embedAction = document.querySelector('.js-embed-action');
-  const url = `${protocol}//${host + pathname}`;
 
-  shareBtn.addEventListener('click', () => {
-    shareBtn.classList.add('is-active');
-    embedBtn.classList.remove('is-active');
-    snippetUrlArea.value = url;
-    embedAction.innerText = __('Share');
-  });
+  if (shareBtn) {
+    const { protocol, host, pathname } = window.location;
 
-  embedBtn.addEventListener('click', () => {
-    embedBtn.classList.add('is-active');
-    shareBtn.classList.remove('is-active');
-    const scriptTag = `<script src="${url}.js"></script>`;
-    snippetUrlArea.value = scriptTag;
-    embedAction.innerText = __('Embed');
-  });
+    const embedBtn = document.querySelector('.js-embed-btn');
+
+    const snippetUrlArea = document.querySelector('.js-snippet-url-area');
+    const embedAction = document.querySelector('.js-embed-action');
+    const url = `${protocol}//${host + pathname}`;
+
+    shareBtn.addEventListener('click', () => {
+      shareBtn.classList.add('is-active');
+      embedBtn.classList.remove('is-active');
+      snippetUrlArea.value = url;
+      embedAction.innerText = __('Share');
+    });
+
+    embedBtn.addEventListener('click', () => {
+      embedBtn.classList.add('is-active');
+      shareBtn.classList.remove('is-active');
+      const scriptTag = `<script src="${url}.js"></script>`;
+      snippetUrlArea.value = scriptTag;
+      embedAction.innerText = __('Embed');
+    });
+  }
 };