Merge remote-tracking branch 'origin/master' into 39549-label-list-page-redesign-with-draggable-labels

6 files changed, 32 insertions, 12 deletions

diff --git a/app/assets/javascripts/importer_status.js b/app/assets/javascripts/importer_status.js
index b469e1e2adc..52455885248 100644
--- a/app/assets/javascripts/importer_status.js
+++ b/app/assets/javascripts/importer_status.js
@@ -58,7 +58,7 @@ class ImporterStatus {
       job.find('.import-target').html(`<a href="${data.full_path}">${data.full_path}</a>`);
       $('table.import-jobs tbody').prepend(job);
 
-      job.addClass('active');
+      job.addClass('table-active');
       const connectingVerb = this.ciCdOnly ? __('connecting') : __('importing');
       job.find('.import-actions').html(sprintf(
         _.escape(__('%{loadingIcon} Started')), {
@@ -81,7 +81,7 @@ class ImporterStatus {
 
           switch (job.import_status) {
             case 'finished':
-              jobItem.removeClass('active').addClass('success');
+              jobItem.removeClass('table-active').addClass('table-success');
               statusField.html(`<span><i class="fa fa-check"></i> ${__('Done')}</span>`);
               break;
             case 'scheduled':
diff --git a/app/assets/javascripts/performance_bar/components/detailed_metric.vue b/app/assets/javascripts/performance_bar/components/detailed_metric.vue
index db8a0055acd..96189e7033a 100644
--- a/app/assets/javascripts/performance_bar/components/detailed_metric.vue
+++ b/app/assets/javascripts/performance_bar/components/detailed_metric.vue
@@ -56,6 +56,7 @@ export default {
     <gl-modal
       :id="`modal-peek-${metric}-details`"
       :header-title-text="header"
+      modal-size="lg"
       class="performance-bar-modal"
     >
       <table
@@ -70,7 +71,7 @@ export default {
             <td
               v-for="key in keys"
               :key="key"
-              class="break-word"
+              class="break-word all-words"
             >
               {{ item[key] }}
             </td>
diff --git a/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.vue b/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.vue
index f69fe03fcb3..c20d07a169d 100644
--- a/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.vue
@@ -265,10 +265,10 @@ export default {
       />
 
       <section
-        v-if="mr.maintainerEditAllowed"
+        v-if="mr.allowCollaboration"
         class="mr-info-list mr-links"
       >
-        {{ s__("mrWidget|Allows edits from maintainers") }}
+        {{ s__("mrWidget|Allows commits from members who can merge to the target branch") }}
       </section>
 
       <mr-widget-related-links
diff --git a/app/assets/javascripts/vue_merge_request_widget/stores/mr_widget_store.js b/app/assets/javascripts/vue_merge_request_widget/stores/mr_widget_store.js
index e5b7e1f1c68..134aaacf9d2 100644
--- a/app/assets/javascripts/vue_merge_request_widget/stores/mr_widget_store.js
+++ b/app/assets/javascripts/vue_merge_request_widget/stores/mr_widget_store.js
@@ -83,7 +83,7 @@ export default class MergeRequestStore {
     this.canBeMerged = data.can_be_merged || false;
     this.isMergeAllowed = data.mergeable || false;
     this.mergeOngoing = data.merge_ongoing;
-    this.maintainerEditAllowed = data.allow_maintainer_to_push;
+    this.allowCollaboration = data.allow_collaboration;
 
     // Cherry-pick and Revert actions related
     this.canCherryPickInCurrentMR = currentUser.can_cherry_pick_on_current_merge_request || false;
diff --git a/app/assets/javascripts/vue_shared/components/gl_modal.vue b/app/assets/javascripts/vue_shared/components/gl_modal.vue
index d5d5a7d3798..7ba58bd5959 100644
--- a/app/assets/javascripts/vue_shared/components/gl_modal.vue
+++ b/app/assets/javascripts/vue_shared/components/gl_modal.vue
@@ -1,15 +1,21 @@
 <script>
 const buttonVariants = ['danger', 'primary', 'success', 'warning'];
+const sizeVariants = ['sm', 'md', 'lg'];
 
 export default {
   name: 'GlModal',
-
   props: {
     id: {
       type: String,
       required: false,
       default: null,
     },
+    modalSize: {
+      type: String,
+      required: false,
+      default: 'md',
+      validator: value => sizeVariants.includes(value),
+    },
     headerTitleText: {
       type: String,
       required: false,
@@ -27,7 +33,11 @@ export default {
       default: '',
     },
   },
-
+  computed: {
+    modalSizeClass() {
+      return this.modalSize === 'md' ? '' : `modal-${this.modalSize}`;
+    },
+  },
   methods: {
     emitCancel(event) {
       this.$emit('cancel', event);
@@ -48,6 +58,7 @@ export default {
   >
     <div
       class="modal-dialog"
+      :class="modalSizeClass"
       role="document"
     >
       <div class="modal-content">
diff --git a/app/assets/javascripts/vue_shared/components/table_pagination.vue b/app/assets/javascripts/vue_shared/components/table_pagination.vue
index 22fc5757447..6f231619f26 100644
--- a/app/assets/javascripts/vue_shared/components/table_pagination.vue
+++ b/app/assets/javascripts/vue_shared/components/table_pagination.vue
@@ -124,15 +124,18 @@
             break;
         }
       },
+      hideOnSmallScreen(item) {
+        return !item.first && !item.last && !item.next && !item.prev && !item.active;
+      },
     },
   };
 </script>
 <template>
   <div
     v-if="showPagination"
-    class="gl-pagination"
+    class="gl-pagination prepend-top-default"
   >
-    <ul class="pagination clearfix">
+    <ul class="pagination justify-content-center">
       <li
         v-for="(item, index) in getItems"
         :key="index"
@@ -142,12 +145,17 @@
           'js-next-button': item.next,
           'js-last-button': item.last,
           'js-first-button': item.first,
+          'd-none d-md-block': hideOnSmallScreen(item),
           separator: item.separator,
           active: item.active,
-          disabled: item.disabled
+          disabled: item.disabled || item.separator
         }"
+        class="page-item"
       >
-        <a @click.prevent="changePage(item.title, item.disabled)">
+        <a
+          @click.prevent="changePage(item.title, item.disabled)"
+          class="page-link"
+        >
           {{ item.title }}
         </a>
       </li>