Add latest changes from gitlab-org/gitlab@master

6 files changed, 50 insertions, 5 deletions

diff --git a/app/assets/javascripts/notes.js b/app/assets/javascripts/notes.js
index 1a8f1c659a4..4195ea6425f 100644
--- a/app/assets/javascripts/notes.js
+++ b/app/assets/javascripts/notes.js
@@ -1359,7 +1359,8 @@ export default class Notes {
       const $systemNote = $(systemNote);
       const headerMessage = $systemNote
         .find('.note-text')
-        .find('p:first')
+        .find('p')
+        .first()
         .text()
         .replace(':', '');
 
diff --git a/app/assets/javascripts/notifications_dropdown.js b/app/assets/javascripts/notifications_dropdown.js
index 08545dcea46..ab87b0d973c 100644
--- a/app/assets/javascripts/notifications_dropdown.js
+++ b/app/assets/javascripts/notifications_dropdown.js
@@ -11,7 +11,9 @@ export default function notificationsDropdown() {
     }
 
     const notificationLevel = $(this).data('notificationLevel');
-    const form = $(this).parents('.notification-form:first');
+    const form = $(this)
+      .parents('.notification-form')
+      .first();
 
     form.find('.js-notification-loading').toggleClass('fa-bell fa-spin fa-spinner');
     if (form.hasClass('no-label')) {
diff --git a/app/assets/javascripts/notifications_form.js b/app/assets/javascripts/notifications_form.js
index 45f033f2822..dcd226795a6 100644
--- a/app/assets/javascripts/notifications_form.js
+++ b/app/assets/javascripts/notifications_form.js
@@ -31,7 +31,7 @@ export default class NotificationsForm {
   }
 
   saveEvent($checkbox, $parent) {
-    const form = $parent.parents('form:first');
+    const form = $parent.parents('form').first();
 
     this.showCheckboxLoadingSpinner($parent);
 
diff --git a/app/assets/javascripts/snippets/components/app.vue b/app/assets/javascripts/snippets/components/app.vue
index bd2cb8e4595..7a2145a800c 100644
--- a/app/assets/javascripts/snippets/components/app.vue
+++ b/app/assets/javascripts/snippets/components/app.vue
@@ -1,11 +1,13 @@
 <script>
 import GetSnippetQuery from '../queries/snippet.query.graphql';
 import SnippetHeader from './snippet_header.vue';
+import SnippetTitle from './snippet_title.vue';
 import { GlLoadingIcon } from '@gitlab/ui';
 
 export default {
   components: {
     SnippetHeader,
+    SnippetTitle,
     GlLoadingIcon,
   },
   apollo: {
@@ -45,6 +47,9 @@ export default {
       :size="2"
       class="loading-animation prepend-top-20 append-bottom-20"
     />
-    <snippet-header v-else :snippet="snippet" />
+    <template v-else>
+      <snippet-header :snippet="snippet" />
+      <snippet-title :snippet="snippet" />
+    </template>
   </div>
 </template>
diff --git a/app/assets/javascripts/snippets/components/snippet_title.vue b/app/assets/javascripts/snippets/components/snippet_title.vue
new file mode 100644
index 00000000000..fc8a9b4a390
--- /dev/null
+++ b/app/assets/javascripts/snippets/components/snippet_title.vue
@@ -0,0 +1,35 @@
+<script>
+import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
+import { GlSprintf } from '@gitlab/ui';
+
+export default {
+  components: {
+    TimeAgoTooltip,
+    GlSprintf,
+  },
+  props: {
+    snippet: {
+      type: Object,
+      required: true,
+    },
+  },
+};
+</script>
+<template>
+  <div class="snippet-header limited-header-width">
+    <h2 class="snippet-title prepend-top-0 mb-3" data-qa-selector="snippet_title">
+      {{ snippet.title }}
+    </h2>
+    <div v-if="snippet.description" class="description" data-qa-selector="snippet_description">
+      <div class="md">{{ snippet.description }}</div>
+    </div>
+
+    <small v-if="snippet.updatedAt !== snippet.createdAt" class="edited-text">
+      <gl-sprintf message="Edited %{timeago}">
+        <template #timeago>
+          <time-ago-tooltip :time="snippet.updatedAt" tooltip-placement="bottom" />
+        </template>
+      </gl-sprintf>
+    </small>
+  </div>
+</template>
diff --git a/app/assets/javascripts/tree.js b/app/assets/javascripts/tree.js
index a530c4a99e2..59276ee79d8 100644
--- a/app/assets/javascripts/tree.js
+++ b/app/assets/javascripts/tree.js
@@ -21,7 +21,9 @@ export default class TreeView {
       }
     });
     // Show the "Loading commit data" for only the first element
-    $('span.log_loading:first').removeClass('hide');
+    $('span.log_loading')
+      .first()
+      .removeClass('hide');
   }
 
   initKeyNav() {