Add latest changes from gitlab-org/gitlab@master

9 files changed, 49 insertions, 82 deletions

diff --git a/app/assets/javascripts/ide/components/jobs/detail/description.vue b/app/assets/javascripts/ide/components/jobs/detail/description.vue
index 7280fba9e7a..9c0c97bc5ae 100644
--- a/app/assets/javascripts/ide/components/jobs/detail/description.vue
+++ b/app/assets/javascripts/ide/components/jobs/detail/description.vue
@@ -26,7 +26,7 @@ export default {
     <ci-icon :status="job.status" :borderless="true" :size="24" class="d-flex" />
     <span class="prepend-left-8">
       {{ job.name }}
-      <a :href="job.path" target="_blank" class="ide-external-link">
+      <a :href="job.path" target="_blank" class="ide-external-link position-relative">
         {{ jobId }} <icon :size="12" name="external-link" />
       </a>
     </span>
diff --git a/app/assets/javascripts/ide/components/jobs/stage.vue b/app/assets/javascripts/ide/components/jobs/stage.vue
index 52ca61c06b0..ba8407382f4 100644
--- a/app/assets/javascripts/ide/components/jobs/stage.vue
+++ b/app/assets/javascripts/ide/components/jobs/stage.vue
@@ -71,7 +71,7 @@ export default {
         v-tooltip="showTooltip"
         :title="showTooltip ? stage.name : null"
         data-container="body"
-        class="prepend-left-8 ide-stage-title"
+        class="prepend-left-8 text-truncate"
       >
         {{ stage.name }}
       </strong>
@@ -80,7 +80,7 @@ export default {
       </div>
       <icon :name="collapseIcon" class="ide-stage-collapse-icon" />
     </div>
-    <div v-show="!stage.isCollapsed" ref="jobList" class="card-body">
+    <div v-show="!stage.isCollapsed" ref="jobList" class="card-body p-0">
       <gl-loading-icon v-if="showLoadingIcon" />
       <template v-else>
         <item v-for="job in stage.jobs" :key="job.id" :job="job" @clickViewLog="clickViewLog" />
diff --git a/app/assets/javascripts/ide/components/new_dropdown/index.vue b/app/assets/javascripts/ide/components/new_dropdown/index.vue
index b2fa020fb00..bcaaa8e09c2 100644
--- a/app/assets/javascripts/ide/components/new_dropdown/index.vue
+++ b/app/assets/javascripts/ide/components/new_dropdown/index.vue
@@ -51,7 +51,7 @@ export default {
 </script>
 
 <template>
-  <div class="ide-new-btn">
+  <div class="ide-new-btn d-none">
     <div
       :class="{
         show: isOpen,
diff --git a/app/assets/javascripts/ide/components/new_dropdown/upload.vue b/app/assets/javascripts/ide/components/new_dropdown/upload.vue
index e52613086a4..0efb0012246 100644
--- a/app/assets/javascripts/ide/components/new_dropdown/upload.vue
+++ b/app/assets/javascripts/ide/components/new_dropdown/upload.vue
@@ -43,21 +43,28 @@ export default {
     },
     createFile(target, file) {
       const { name } = file;
-      let { result } = target;
-      const encodedContent = result.split('base64,')[1];
+      const encodedContent = target.result.split('base64,')[1];
       const rawContent = encodedContent ? atob(encodedContent) : '';
       const isText = this.isText(rawContent, file.type);
 
-      result = isText ? rawContent : encodedContent;
+      const emitCreateEvent = content =>
+        this.$emit('create', {
+          name: `${this.path ? `${this.path}/` : ''}${name}`,
+          type: 'blob',
+          content,
+          base64: !isText,
+          binary: !isText,
+          rawPath: !isText ? target.result : '',
+        });
 
-      this.$emit('create', {
-        name: `${this.path ? `${this.path}/` : ''}${name}`,
-        type: 'blob',
-        content: result,
-        base64: !isText,
-        binary: !isText,
-        rawPath: !isText ? target.result : '',
-      });
+      if (isText) {
+        const reader = new FileReader();
+
+        reader.addEventListener('load', e => emitCreateEvent(e.target.result), { once: true });
+        reader.readAsText(file);
+      } else {
+        emitCreateEvent(encodedContent);
+      }
     },
     readFile(file) {
       const reader = new FileReader();
diff --git a/app/assets/javascripts/ide/components/pipelines/list.vue b/app/assets/javascripts/ide/components/pipelines/list.vue
index 5ae73b2fc9c..b61d0a47795 100644
--- a/app/assets/javascripts/ide/components/pipelines/list.vue
+++ b/app/assets/javascripts/ide/components/pipelines/list.vue
@@ -62,7 +62,11 @@ export default {
         <ci-icon :status="latestPipeline.details.status" :size="24" />
         <span class="prepend-left-8">
           <strong> {{ __('Pipeline') }} </strong>
-          <a :href="latestPipeline.path" target="_blank" class="ide-external-link">
+          <a
+            :href="latestPipeline.path"
+            target="_blank"
+            class="ide-external-link position-relative"
+          >
             #{{ latestPipeline.id }} <icon :size="12" name="external-link" />
           </a>
         </span>
diff --git a/app/assets/javascripts/ide/components/repo_editor.vue b/app/assets/javascripts/ide/components/repo_editor.vue
index 7e2ab96d1de..c8c3036812e 100644
--- a/app/assets/javascripts/ide/components/repo_editor.vue
+++ b/app/assets/javascripts/ide/components/repo_editor.vue
@@ -274,7 +274,7 @@ export default {
 <template>
   <div id="ide" class="blob-viewer-container blob-editor-container">
     <div class="ide-mode-tabs clearfix">
-      <ul v-if="!shouldHideEditor && isEditModeActive" class="nav-links float-left">
+      <ul v-if="!shouldHideEditor && isEditModeActive" class="nav-links float-left border-bottom-0">
         <li :class="editTabCSS">
           <a
             href="javascript:void(0);"
diff --git a/app/assets/javascripts/ide/stores/modules/merge_requests/mutations.js b/app/assets/javascripts/ide/stores/modules/merge_requests/mutations.js
index 0eba9c39817..7576b2477d1 100644
--- a/app/assets/javascripts/ide/stores/modules/merge_requests/mutations.js
+++ b/app/assets/javascripts/ide/stores/modules/merge_requests/mutations.js
@@ -14,9 +14,10 @@ export default {
       iid: mergeRequest.iid,
       title: mergeRequest.title,
       projectId: mergeRequest.project_id,
-      projectPathWithNamespace: mergeRequest.web_url
-        .replace(`${gon.gitlab_url}/`, '')
-        .replace(`/merge_requests/${mergeRequest.iid}`, ''),
+      projectPathWithNamespace: mergeRequest.references.full.replace(
+        mergeRequest.references.short,
+        '',
+      ),
     }));
   },
   [types.RESET_MERGE_REQUESTS](state) {
diff --git a/app/assets/javascripts/vue_shared/components/content_viewer/viewers/download_viewer.vue b/app/assets/javascripts/vue_shared/components/content_viewer/viewers/download_viewer.vue
index fe1a2a092ad..e80cb06edfb 100644
--- a/app/assets/javascripts/vue_shared/components/content_viewer/viewers/download_viewer.vue
+++ b/app/assets/javascripts/vue_shared/components/content_viewer/viewers/download_viewer.vue
@@ -13,6 +13,11 @@ export default {
       type: String,
       required: true,
     },
+    filePath: {
+      type: String,
+      required: false,
+      default: '',
+    },
     fileSize: {
       type: Number,
       required: false,
@@ -24,7 +29,8 @@ export default {
       return numberToHumanSize(this.fileSize);
     },
     fileName() {
-      return this.path.split('/').pop();
+      // path could be a base64 uri too, so check if filePath was passed additionally
+      return (this.filePath || this.path).split('/').pop();
     },
   },
 };
@@ -39,7 +45,13 @@ export default {
           ({{ fileSizeReadable }})
         </template>
       </p>
-      <gl-link :href="path" class="btn btn-default" rel="nofollow" download target="_blank">
+      <gl-link
+        :href="path"
+        class="btn btn-default"
+        rel="nofollow"
+        :download="fileName"
+        target="_blank"
+      >
         <icon :size="16" name="download" class="float-left append-right-8" />
         {{ __('Download') }}
       </gl-link>
diff --git a/app/assets/stylesheets/page_bundles/ide.scss b/app/assets/stylesheets/page_bundles/ide.scss
index 420271c9a1e..5eaff7702f6 100644
--- a/app/assets/stylesheets/page_bundles/ide.scss
+++ b/app/assets/stylesheets/page_bundles/ide.scss
@@ -25,10 +25,6 @@ $ide-commit-header-height: 48px;
   @include str-truncated(250px);
 }
 
-.editable-mode {
-  display: inline-block;
-}
-
 .ide-view {
   position: relative;
   margin-top: 0;
@@ -332,23 +328,6 @@ $ide-commit-header-height: 48px;
       padding: $gl-padding;
       max-width: 100%;
       max-height: 100%;
-
-      img {
-        max-width: 90%;
-      }
-
-      .isZoomable {
-        cursor: pointer;
-        cursor: zoom-in;
-
-        &.isZoomed {
-          cursor: pointer;
-          cursor: zoom-out;
-          max-width: none;
-          max-height: none;
-          margin-right: $gl-padding;
-        }
-      }
     }
 
     .file-info {
@@ -361,13 +340,9 @@ $ide-commit-header-height: 48px;
 .ide-mode-tabs {
   border-bottom: 1px solid $white-dark;
 
-  .nav-links {
-    border-bottom: 0;
-
-    li a {
-      padding: $gl-padding-8 $gl-padding;
-      line-height: $gl-btn-line-height;
-    }
+  li a {
+    padding: $gl-padding-8 $gl-padding;
+    line-height: $gl-btn-line-height;
   }
 }
 
@@ -564,12 +539,6 @@ $ide-commit-header-height: 48px;
     background: $gray-100;
 
     outline: 0;
-
-    .multi-file-discard-btn {
-      > .btn {
-        display: flex;
-      }
-    }
   }
 
   &:active {
@@ -596,18 +565,6 @@ $ide-commit-header-height: 48px;
   }
 }
 
-.multi-file-discard-btn {
-  > .btn {
-    display: none;
-    width: $ide-commit-row-height;
-    height: $ide-commit-row-height;
-  }
-
-  svg {
-    top: 0;
-  }
-}
-
 .multi-file-commit-form {
   position: relative;
   background-color: $white-light;
@@ -1060,8 +1017,6 @@ $ide-commit-header-height: 48px;
 }
 
 .ide-external-link {
-  position: relative;
-
   svg {
     display: none;
     position: absolute;
@@ -1164,22 +1119,12 @@ $ide-commit-header-height: 48px;
       align-items: center;
     }
   }
-
-  .card-body {
-    padding: 0;
-  }
 }
 
 .ide-stage-collapse-icon {
   margin: auto 0 auto auto;
 }
 
-.ide-stage-title {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
 .ide-job-header {
   min-height: 60px;
 }
@@ -1279,8 +1224,6 @@ $ide-commit-header-height: 48px;
 }
 
 .ide-new-btn {
-  display: none;
-
   .btn {
     padding: 2px 5px;
   }