Add latest changes from gitlab-org/gitlab@13-2-stable-ee

37 files changed, 156 insertions, 110 deletions

diff --git a/app/assets/javascripts/ide/components/branches/item.vue b/app/assets/javascripts/ide/components/branches/item.vue
index e7f4cd796b5..49744d573da 100644
--- a/app/assets/javascripts/ide/components/branches/item.vue
+++ b/app/assets/javascripts/ide/components/branches/item.vue
@@ -33,7 +33,7 @@ export default {
 
 <template>
   <a :href="branchHref" class="btn-link d-flex align-items-center">
-    <span class="d-flex append-right-default ide-search-list-current-icon">
+    <span class="d-flex gl-mr-3 ide-search-list-current-icon">
       <icon v-if="isActive" :size="18" name="mobile-issue-close" />
     </span>
     <span>
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/actions.vue b/app/assets/javascripts/ide/components/commit_sidebar/actions.vue
index 6c563776533..407e4c57cd8 100644
--- a/app/assets/javascripts/ide/components/commit_sidebar/actions.vue
+++ b/app/assets/javascripts/ide/components/commit_sidebar/actions.vue
@@ -70,7 +70,7 @@ export default {
 </script>
 
 <template>
-  <div class="append-bottom-15 ide-commit-options">
+  <div class="gl-mb-5 ide-commit-options">
     <radio-group
       :value="$options.commitToCurrentBranch"
       :disabled="!canPushToBranch"
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/empty_state.vue b/app/assets/javascripts/ide/components/commit_sidebar/empty_state.vue
index a13ca0cd138..3ffbcbf99e8 100644
--- a/app/assets/javascripts/ide/components/commit_sidebar/empty_state.vue
+++ b/app/assets/javascripts/ide/components/commit_sidebar/empty_state.vue
@@ -12,7 +12,7 @@ export default {
   <div v-if="!lastCommitMsg" class="multi-file-commit-panel-section ide-commit-empty-state">
     <div class="ide-commit-empty-state-container">
       <div class="svg-content svg-80"><img :src="noChangesStateSvgPath" /></div>
-      <div class="append-right-default prepend-left-default">
+      <div class="gl-mr-3 gl-ml-3">
         <div class="text-content text-center">
           <h4>{{ __('No changes') }}</h4>
           <p>{{ __('Edit files in the editor and commit changes here') }}</p>
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/list_collapsed.vue b/app/assets/javascripts/ide/components/commit_sidebar/list_collapsed.vue
index b6fc567f8cc..03304337839 100644
--- a/app/assets/javascripts/ide/components/commit_sidebar/list_collapsed.vue
+++ b/app/assets/javascripts/ide/components/commit_sidebar/list_collapsed.vue
@@ -75,7 +75,7 @@ export default {
       :title="titleTooltip"
       data-container="body"
       data-placement="left"
-      class="append-bottom-15"
+      class="gl-mb-5"
     >
       <icon v-once :name="iconName" :size="18" />
     </div>
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/message_field.vue b/app/assets/javascripts/ide/components/commit_sidebar/message_field.vue
index 6b0aa5b2b2b..b37c7280a30 100644
--- a/app/assets/javascripts/ide/components/commit_sidebar/message_field.vue
+++ b/app/assets/javascripts/ide/components/commit_sidebar/message_field.vue
@@ -83,7 +83,7 @@ export default {
         <ul class="nav-links">
           <li>
             {{ __('Commit Message') }}
-            <span v-popover="$options.popoverOptions" class="form-text text-muted prepend-left-10">
+            <span v-popover="$options.popoverOptions" class="form-text text-muted gl-ml-3">
               <icon name="question" />
             </span>
           </li>
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/new_merge_request_option.vue b/app/assets/javascripts/ide/components/commit_sidebar/new_merge_request_option.vue
index 0812599c25c..cdf49866982 100644
--- a/app/assets/javascripts/ide/components/commit_sidebar/new_merge_request_option.vue
+++ b/app/assets/javascripts/ide/components/commit_sidebar/new_merge_request_option.vue
@@ -44,7 +44,7 @@ export default {
         data-qa-selector="start_new_mr_checkbox"
         @change="toggleShouldCreateMR"
       />
-      <span class="prepend-left-10 ide-option-label">
+      <span class="gl-ml-3 ide-option-label">
         {{ __('Start a new merge request') }}
       </span>
     </label>
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/radio_group.vue b/app/assets/javascripts/ide/components/commit_sidebar/radio_group.vue
index a9591805261..aed7b792902 100644
--- a/app/assets/javascripts/ide/components/commit_sidebar/radio_group.vue
+++ b/app/assets/javascripts/ide/components/commit_sidebar/radio_group.vue
@@ -66,7 +66,7 @@ export default {
         name="commit-action"
         @change="updateCommitAction($event.target.value)"
       />
-      <span class="prepend-left-10">
+      <span class="gl-ml-3">
         <span v-if="label" class="ide-option-label"> {{ label }} </span> <slot v-else></slot>
       </span>
     </label>
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/success_message.vue b/app/assets/javascripts/ide/components/commit_sidebar/success_message.vue
index 137f8bb18c7..327b0b8172f 100644
--- a/app/assets/javascripts/ide/components/commit_sidebar/success_message.vue
+++ b/app/assets/javascripts/ide/components/commit_sidebar/success_message.vue
@@ -13,7 +13,7 @@ export default {
     <div class="svg-content svg-80">
       <img :src="committedStateSvgPath" :alt="s__('IDE|Successful commit')" />
     </div>
-    <div class="append-right-default prepend-left-default">
+    <div class="gl-mr-3 gl-ml-3">
       <div class="text-content text-center">
         <h4>{{ __('All changes are committed') }}</h4>
         <p v-html="lastCommitMsg"></p>
diff --git a/app/assets/javascripts/ide/components/file_row_extra.vue b/app/assets/javascripts/ide/components/file_row_extra.vue
index 51509cd5fe6..f7cf7a5b251 100644
--- a/app/assets/javascripts/ide/components/file_row_extra.vue
+++ b/app/assets/javascripts/ide/components/file_row_extra.vue
@@ -76,7 +76,7 @@ export default {
         data-container="body"
         data-placement="right"
         name="file-modified"
-        class="prepend-left-5 ide-file-modified"
+        class="gl-ml-2 ide-file-modified"
       />
     </span>
     <changed-file-icon
diff --git a/app/assets/javascripts/ide/components/file_templates/bar.vue b/app/assets/javascripts/ide/components/file_templates/bar.vue
index d459e3b43d3..b6a57d1b6e6 100644
--- a/app/assets/javascripts/ide/components/file_templates/bar.vue
+++ b/app/assets/javascripts/ide/components/file_templates/bar.vue
@@ -48,7 +48,7 @@ export default {
 
 <template>
   <div class="d-flex align-items-center ide-file-templates qa-file-templates-bar">
-    <strong class="append-right-default"> {{ __('File templates') }} </strong>
+    <strong class="gl-mr-3"> {{ __('File templates') }} </strong>
     <dropdown
       :data="templateTypes"
       :label="selectedTemplateType.name || __('Choose a type...')"
diff --git a/app/assets/javascripts/ide/components/ide.vue b/app/assets/javascripts/ide/components/ide.vue
index e9f84eb8648..55b3eaf9737 100644
--- a/app/assets/javascripts/ide/components/ide.vue
+++ b/app/assets/javascripts/ide/components/ide.vue
@@ -1,6 +1,6 @@
 <script>
 import { mapActions, mapGetters, mapState } from 'vuex';
-import { GlDeprecatedButton, GlLoadingIcon } from '@gitlab/ui';
+import { GlButton, GlLoadingIcon } from '@gitlab/ui';
 import { __ } from '~/locale';
 import { modalTypes } from '../constants';
 import FindFile from '~/vue_shared/components/file_finder/index.vue';
@@ -24,7 +24,7 @@ export default {
     FindFile,
     ErrorMessage,
     CommitEditorHeader,
-    GlDeprecatedButton,
+    GlButton,
     GlLoadingIcon,
     RightPane,
   },
@@ -121,15 +121,16 @@ export default {
                         )
                       }}
                     </p>
-                    <gl-deprecated-button
+                    <gl-button
                       variant="success"
+                      category="primary"
                       :title="__('New file')"
                       :aria-label="__('New file')"
                       data-qa-selector="first_file_button"
                       @click="createNewFile()"
                     >
                       {{ __('New file') }}
-                    </gl-deprecated-button>
+                    </gl-button>
                   </template>
                   <gl-loading-icon v-else-if="!currentTree || currentTree.loading" size="md" />
                   <p v-else>
diff --git a/app/assets/javascripts/ide/components/ide_review.vue b/app/assets/javascripts/ide/components/ide_review.vue
index 62dbfea2088..95348711e1d 100644
--- a/app/assets/javascripts/ide/components/ide_review.vue
+++ b/app/assets/javascripts/ide/components/ide_review.vue
@@ -53,7 +53,7 @@ export default {
           @click="updateViewer"
         />
       </div>
-      <div class="prepend-top-5 ide-review-sub-header">
+      <div class="gl-mt-2 ide-review-sub-header">
         <template v-if="showLatestChangesText">
           {{ __('Latest changes') }}
         </template>
diff --git a/app/assets/javascripts/ide/components/ide_status_list.vue b/app/assets/javascripts/ide/components/ide_status_list.vue
index 92d25709bd5..1354fdc3d98 100644
--- a/app/assets/javascripts/ide/components/ide_status_list.vue
+++ b/app/assets/javascripts/ide/components/ide_status_list.vue
@@ -1,12 +1,17 @@
 <script>
 import { mapGetters } from 'vuex';
+import { GlLink, GlTooltipDirective } from '@gitlab/ui';
 import TerminalSyncStatusSafe from './terminal_sync/terminal_sync_status_safe.vue';
 import { getFileEOL } from '../utils';
 
 export default {
   components: {
+    GlLink,
     TerminalSyncStatusSafe,
   },
+  directives: {
+    GlTooltip: GlTooltipDirective,
+  },
   computed: {
     ...mapGetters(['activeFile']),
     activeFileEOL() {
@@ -19,12 +24,14 @@ export default {
 <template>
   <div class="ide-status-list d-flex">
     <template v-if="activeFile">
-      <div class="ide-status-file">{{ activeFile.name }}</div>
-      <div class="ide-status-file">{{ activeFileEOL }}</div>
-      <div v-if="!activeFile.binary" class="ide-status-file">
-        {{ activeFile.editorRow }}:{{ activeFile.editorColumn }}
+      <div>
+        <gl-link v-gl-tooltip.hover :href="activeFile.permalink" :title="__('Open in file view')">
+          {{ activeFile.name }}
+        </gl-link>
       </div>
-      <div class="ide-status-file">{{ activeFile.fileLanguage }}</div>
+      <div>{{ activeFileEOL }}</div>
+      <div v-if="!activeFile.binary">{{ activeFile.editorRow }}:{{ activeFile.editorColumn }}</div>
+      <div>{{ activeFile.fileLanguage }}</div>
     </template>
     <terminal-sync-status-safe />
   </div>
diff --git a/app/assets/javascripts/ide/components/jobs/item.vue b/app/assets/javascripts/ide/components/jobs/item.vue
index be8bf77bba0..db3630bc1d1 100644
--- a/app/assets/javascripts/ide/components/jobs/item.vue
+++ b/app/assets/javascripts/ide/components/jobs/item.vue
@@ -26,7 +26,7 @@ export default {
 
 <template>
   <div class="ide-job-item">
-    <job-description :job="job" class="append-right-default" />
+    <job-description :job="job" class="gl-mr-3" />
     <div class="ml-auto align-self-center">
       <button v-if="job.started" type="button" class="btn btn-default btn-sm" @click="clickViewLog">
         {{ __('View log') }}
diff --git a/app/assets/javascripts/ide/components/jobs/list.vue b/app/assets/javascripts/ide/components/jobs/list.vue
index b97b7289886..4e0912f3f44 100644
--- a/app/assets/javascripts/ide/components/jobs/list.vue
+++ b/app/assets/javascripts/ide/components/jobs/list.vue
@@ -26,7 +26,7 @@ export default {
 
 <template>
   <div>
-    <gl-loading-icon v-if="loading && !stages.length" size="lg" class="prepend-top-default" />
+    <gl-loading-icon v-if="loading && !stages.length" size="lg" class="gl-mt-3" />
     <template v-else>
       <stage
         v-for="stage in stages"
diff --git a/app/assets/javascripts/ide/components/jobs/stage.vue b/app/assets/javascripts/ide/components/jobs/stage.vue
index 169a948c2da..75441e8c1c8 100644
--- a/app/assets/javascripts/ide/components/jobs/stage.vue
+++ b/app/assets/javascripts/ide/components/jobs/stage.vue
@@ -56,7 +56,7 @@ export default {
 </script>
 
 <template>
-  <div class="ide-stage card prepend-top-default">
+  <div class="ide-stage card gl-mt-3">
     <div
       ref="cardHeader"
       :class="{
diff --git a/app/assets/javascripts/ide/components/merge_requests/item.vue b/app/assets/javascripts/ide/components/merge_requests/item.vue
index 3f060392686..8b7b8d5a91c 100644
--- a/app/assets/javascripts/ide/components/merge_requests/item.vue
+++ b/app/assets/javascripts/ide/components/merge_requests/item.vue
@@ -40,7 +40,7 @@ export default {
 
 <template>
   <a :href="mergeRequestHref" class="btn-link d-flex align-items-center">
-    <span class="d-flex append-right-default ide-search-list-current-icon">
+    <span class="d-flex gl-mr-3 ide-search-list-current-icon">
       <icon v-if="isActive" :size="18" name="mobile-issue-close" />
     </span>
     <span>
diff --git a/app/assets/javascripts/ide/components/merge_requests/list.vue b/app/assets/javascripts/ide/components/merge_requests/list.vue
index bf2a33be653..af45d88b84a 100644
--- a/app/assets/javascripts/ide/components/merge_requests/list.vue
+++ b/app/assets/javascripts/ide/components/merge_requests/list.vue
@@ -102,7 +102,7 @@ export default {
                 class="btn-link d-flex align-items-center"
                 @click.stop="setSearchType(searchType)"
               >
-                <span class="d-flex append-right-default ide-search-list-current-icon">
+                <span class="d-flex gl-mr-3 ide-search-list-current-icon">
                   <icon :size="18" name="search" />
                 </span>
                 <span>{{ searchType.label }}</span>
diff --git a/app/assets/javascripts/ide/components/new_dropdown/index.vue b/app/assets/javascripts/ide/components/new_dropdown/index.vue
index 2798ede5341..b656e35f150 100644
--- a/app/assets/javascripts/ide/components/new_dropdown/index.vue
+++ b/app/assets/javascripts/ide/components/new_dropdown/index.vue
@@ -64,6 +64,7 @@ export default {
         :aria-label="__('Create new file or directory')"
         type="button"
         class="rounded border-0 d-flex ide-entry-dropdown-toggle"
+        data-qa-selector="dropdown_button"
         @click.stop="openDropdown()"
       >
         <icon name="ellipsis_v" /> <icon name="chevron-down" />
@@ -97,6 +98,7 @@ export default {
             class="d-flex"
             icon="pencil"
             icon-classes="mr-2"
+            data-qa-selector="rename_move_button"
             @click="createNewItem($options.modalTypes.rename)"
           />
         </li>
diff --git a/app/assets/javascripts/ide/components/new_dropdown/modal.vue b/app/assets/javascripts/ide/components/new_dropdown/modal.vue
index 586d6867ab4..fe0167942b8 100644
--- a/app/assets/javascripts/ide/components/new_dropdown/modal.vue
+++ b/app/assets/javascripts/ide/components/new_dropdown/modal.vue
@@ -154,10 +154,7 @@ export default {
           data-qa-selector="file_name_field"
           :placeholder="placeholder"
         />
-        <ul
-          v-if="isCreatingNewFile"
-          class="file-templates prepend-top-default list-inline qa-template-list"
-        >
+        <ul v-if="isCreatingNewFile" class="file-templates gl-mt-3 list-inline qa-template-list">
           <li v-for="(template, index) in templateTypes" :key="index" class="list-inline-item">
             <button
               type="button"
diff --git a/app/assets/javascripts/ide/components/pipelines/list.vue b/app/assets/javascripts/ide/components/pipelines/list.vue
index 6958a5d2526..6038e92f254 100644
--- a/app/assets/javascripts/ide/components/pipelines/list.vue
+++ b/app/assets/javascripts/ide/components/pipelines/list.vue
@@ -7,7 +7,7 @@ import Icon from '../../../vue_shared/components/icon.vue';
 import CiIcon from '../../../vue_shared/components/ci_icon.vue';
 import Tabs from '../../../vue_shared/components/tabs/tabs';
 import Tab from '../../../vue_shared/components/tabs/tab.vue';
-import EmptyState from '../../../pipelines/components/empty_state.vue';
+import EmptyState from '../../../pipelines/components/pipelines_list/empty_state.vue';
 import JobsList from '../jobs/list.vue';
 
 import IDEServices from '~/ide/services';
@@ -59,7 +59,7 @@ export default {
 
 <template>
   <div class="ide-pipeline">
-    <gl-loading-icon v-if="showLoadingIcon" size="lg" class="prepend-top-default" />
+    <gl-loading-icon v-if="showLoadingIcon" size="lg" class="gl-mt-3" />
     <template v-else-if="hasLoadedPipeline">
       <header v-if="latestPipeline" class="ide-tree-header ide-pipeline-header">
         <ci-icon :status="latestPipeline.details.status" :size="24" class="d-flex" />
diff --git a/app/assets/javascripts/ide/components/repo_editor.vue b/app/assets/javascripts/ide/components/repo_editor.vue
index a7646083428..ac445a1d9f1 100644
--- a/app/assets/javascripts/ide/components/repo_editor.vue
+++ b/app/assets/javascripts/ide/components/repo_editor.vue
@@ -185,7 +185,6 @@ export default {
       'setFileLanguage',
       'setEditorPosition',
       'setFileViewMode',
-      'updateViewer',
       'removePendingTab',
       'triggerFilesChange',
       'addTempImage',
@@ -241,7 +240,7 @@ export default {
       });
     },
     setupEditor() {
-      if (!this.file || !this.editor.instance) return;
+      if (!this.file || !this.editor.instance || this.file.loading) return;
 
       const head = this.getStagedFile(this.file.path);
 
diff --git a/app/assets/javascripts/ide/components/terminal/empty_state.vue b/app/assets/javascripts/ide/components/terminal/empty_state.vue
index 9841f1ece48..5dd12e62820 100644
--- a/app/assets/javascripts/ide/components/terminal/empty_state.vue
+++ b/app/assets/javascripts/ide/components/terminal/empty_state.vue
@@ -43,7 +43,7 @@ export default {
   <div class="text-center p-3">
     <div v-if="illustrationPath" class="svg-content svg-130"><img :src="illustrationPath" /></div>
     <h4>{{ __('Web Terminal') }}</h4>
-    <gl-loading-icon v-if="isLoading" size="lg" class="prepend-top-default" />
+    <gl-loading-icon v-if="isLoading" size="lg" class="gl-mt-3" />
     <template v-else>
       <p>{{ __('Run tests against your code live using the Web Terminal') }}</p>
       <p>
diff --git a/app/assets/javascripts/ide/lib/editor.js b/app/assets/javascripts/ide/lib/editor.js
index 4dfc27117c0..6e90968f008 100644
--- a/app/assets/javascripts/ide/lib/editor.js
+++ b/app/assets/javascripts/ide/lib/editor.js
@@ -8,9 +8,10 @@ import ModelManager from './common/model_manager';
 import { editorOptions, defaultEditorOptions, defaultDiffEditorOptions } from './editor_options';
 import { themes } from './themes';
 import languages from './languages';
+import schemas from './schemas';
 import keymap from './keymap.json';
 import { clearDomElement } from '~/editor/utils';
-import { registerLanguages } from '../utils';
+import { registerLanguages, registerSchemas } from '../utils';
 
 function setupThemes() {
   themes.forEach(theme => {
@@ -45,6 +46,10 @@ export default class Editor {
     setupThemes();
     registerLanguages(...languages);
 
+    if (gon.features?.schemaLinting) {
+      registerSchemas(...schemas);
+    }
+
     this.debouncedUpdate = debounce(() => {
       this.updateDimensions();
     }, 200);
diff --git a/app/assets/javascripts/ide/lib/schemas/index.js b/app/assets/javascripts/ide/lib/schemas/index.js
new file mode 100644
index 00000000000..38a2f81921b
--- /dev/null
+++ b/app/assets/javascripts/ide/lib/schemas/index.js
@@ -0,0 +1,4 @@
+import json from './json';
+import yaml from './yaml';
+
+export default [json, yaml];
diff --git a/app/assets/javascripts/ide/lib/schemas/json/index.js b/app/assets/javascripts/ide/lib/schemas/json/index.js
new file mode 100644
index 00000000000..900d5442bec
--- /dev/null
+++ b/app/assets/javascripts/ide/lib/schemas/json/index.js
@@ -0,0 +1,8 @@
+export default {
+  language: 'json',
+  options: {
+    validate: true,
+    enableSchemaRequest: true,
+    schemas: [],
+  },
+};
diff --git a/app/assets/javascripts/ide/lib/schemas/yaml/gitlab_ci.js b/app/assets/javascripts/ide/lib/schemas/yaml/gitlab_ci.js
new file mode 100644
index 00000000000..af20744abb3
--- /dev/null
+++ b/app/assets/javascripts/ide/lib/schemas/yaml/gitlab_ci.js
@@ -0,0 +1,4 @@
+export default {
+  uri: 'https://json.schemastore.org/gitlab-ci',
+  fileMatch: ['*.gitlab-ci.yml'],
+};
diff --git a/app/assets/javascripts/ide/lib/schemas/yaml/index.js b/app/assets/javascripts/ide/lib/schemas/yaml/index.js
new file mode 100644
index 00000000000..e3fc406df4b
--- /dev/null
+++ b/app/assets/javascripts/ide/lib/schemas/yaml/index.js
@@ -0,0 +1,12 @@
+import gitlabCi from './gitlab_ci';
+
+export default {
+  language: 'yaml',
+  options: {
+    validate: true,
+    enableSchemaRequest: true,
+    hover: true,
+    completion: true,
+    schemas: [gitlabCi],
+  },
+};
diff --git a/app/assets/javascripts/ide/queries/getUserPermissions.query.graphql b/app/assets/javascripts/ide/queries/getUserPermissions.query.graphql
index 2c9013ffa9c..f0b50793226 100644
--- a/app/assets/javascripts/ide/queries/getUserPermissions.query.graphql
+++ b/app/assets/javascripts/ide/queries/getUserPermissions.query.graphql
@@ -1,8 +1,8 @@
 query getUserPermissions($projectPath: ID!) {
   project(fullPath: $projectPath) {
     userPermissions {
-      createMergeRequestIn,
-      readMergeRequest,
+      createMergeRequestIn
+      readMergeRequest
       pushCode
     }
   }
diff --git a/app/assets/javascripts/ide/services/gql.js b/app/assets/javascripts/ide/services/gql.js
index 8a7f27328ba..211cc78bd99 100644
--- a/app/assets/javascripts/ide/services/gql.js
+++ b/app/assets/javascripts/ide/services/gql.js
@@ -1,8 +1,21 @@
+import { memoize } from 'lodash';
 import createGqClient, { fetchPolicies } from '~/lib/graphql';
 
-export default createGqClient(
-  {},
-  {
-    fetchPolicy: fetchPolicies.NO_CACHE,
-  },
+/**
+ * Returns a memoized client
+ *
+ * We defer creating the client so that importing this module does not cause any side-effects.
+ * Creating the client immediately caused issues with miragejs where the gql client uses the
+ * real fetch() instead of the shimmed one.
+ */
+const getClient = memoize(() =>
+  createGqClient(
+    {},
+    {
+      fetchPolicy: fetchPolicies.NO_CACHE,
+    },
+  ),
 );
+
+// eslint-disable-next-line import/prefer-default-export
+export const query = (...args) => getClient().query(...args);
diff --git a/app/assets/javascripts/ide/services/index.js b/app/assets/javascripts/ide/services/index.js
index 1767d961259..ae4a1ba3db5 100644
--- a/app/assets/javascripts/ide/services/index.js
+++ b/app/assets/javascripts/ide/services/index.js
@@ -2,17 +2,15 @@ import axios from '~/lib/utils/axios_utils';
 import { joinPaths, escapeFileUrl } from '~/lib/utils/url_utility';
 import Api from '~/api';
 import getUserPermissions from '../queries/getUserPermissions.query.graphql';
-import gqClient from './gql';
+import { query } from './gql';
 
 const fetchApiProjectData = projectPath => Api.project(projectPath).then(({ data }) => data);
 
 const fetchGqlProjectData = projectPath =>
-  gqClient
-    .query({
-      query: getUserPermissions,
-      variables: { projectPath },
-    })
-    .then(({ data }) => data.project);
+  query({
+    query: getUserPermissions,
+    variables: { projectPath },
+  }).then(({ data }) => data.project);
 
 export default {
   getFileData(endpoint) {
diff --git a/app/assets/javascripts/ide/stores/actions/file.js b/app/assets/javascripts/ide/stores/actions/file.js
index 47f9337a288..c0cb924e749 100644
--- a/app/assets/javascripts/ide/stores/actions/file.js
+++ b/app/assets/javascripts/ide/stores/actions/file.js
@@ -65,7 +65,7 @@ export const getFileData = (
   if (file.raw || (file.tempFile && !file.prevPath && !fileDeletedAndReadded))
     return Promise.resolve();
 
-  commit(types.TOGGLE_LOADING, { entry: file });
+  commit(types.TOGGLE_LOADING, { entry: file, forceValue: true });
 
   const url = joinPaths(
     gon.relative_url_root || '/',
@@ -79,15 +79,15 @@ export const getFileData = (
   return service
     .getFileData(url)
     .then(({ data }) => {
-      setPageTitleForFile(state, file);
-
       if (data) commit(types.SET_FILE_DATA, { data, file });
       if (openFile) commit(types.TOGGLE_FILE_OPEN, path);
-      if (makeFileActive) dispatch('setFileActive', path);
-      commit(types.TOGGLE_LOADING, { entry: file });
+
+      if (makeFileActive) {
+        setPageTitleForFile(state, file);
+        dispatch('setFileActive', path);
+      }
     })
     .catch(() => {
-      commit(types.TOGGLE_LOADING, { entry: file });
       dispatch('setErrorMessage', {
         text: __('An error occurred while loading the file.'),
         action: payload =>
@@ -95,6 +95,9 @@ export const getFileData = (
         actionText: __('Please try again'),
         actionPayload: { path, makeFileActive },
       });
+    })
+    .finally(() => {
+      commit(types.TOGGLE_LOADING, { entry: file, forceValue: false });
     });
 };
 
@@ -106,45 +109,41 @@ export const getRawFileData = ({ state, commit, dispatch, getters }, { path }) =
   const file = state.entries[path];
   const stagedFile = state.stagedFiles.find(f => f.path === path);
 
-  return new Promise((resolve, reject) => {
-    const fileDeletedAndReadded = getters.isFileDeletedAndReadded(path);
-    service
-      .getRawFileData(fileDeletedAndReadded ? stagedFile : file)
-      .then(raw => {
-        if (!(file.tempFile && !file.prevPath && !fileDeletedAndReadded))
-          commit(types.SET_FILE_RAW_DATA, { file, raw, fileDeletedAndReadded });
-
-        if (file.mrChange && file.mrChange.new_file === false) {
-          const baseSha =
-            (getters.currentMergeRequest && getters.currentMergeRequest.baseCommitSha) || '';
-
-          service
-            .getBaseRawFileData(file, baseSha)
-            .then(baseRaw => {
-              commit(types.SET_FILE_BASE_RAW_DATA, {
-                file,
-                baseRaw,
-              });
-              resolve(raw);
-            })
-            .catch(e => {
-              reject(e);
-            });
-        } else {
-          resolve(raw);
-        }
-      })
-      .catch(() => {
-        dispatch('setErrorMessage', {
-          text: __('An error occurred while loading the file content.'),
-          action: payload =>
-            dispatch('getRawFileData', payload).then(() => dispatch('setErrorMessage', null)),
-          actionText: __('Please try again'),
-          actionPayload: { path },
+  const fileDeletedAndReadded = getters.isFileDeletedAndReadded(path);
+  commit(types.TOGGLE_LOADING, { entry: file, forceValue: true });
+  return service
+    .getRawFileData(fileDeletedAndReadded ? stagedFile : file)
+    .then(raw => {
+      if (!(file.tempFile && !file.prevPath && !fileDeletedAndReadded))
+        commit(types.SET_FILE_RAW_DATA, { file, raw, fileDeletedAndReadded });
+
+      if (file.mrChange && file.mrChange.new_file === false) {
+        const baseSha =
+          (getters.currentMergeRequest && getters.currentMergeRequest.baseCommitSha) || '';
+
+        return service.getBaseRawFileData(file, baseSha).then(baseRaw => {
+          commit(types.SET_FILE_BASE_RAW_DATA, {
+            file,
+            baseRaw,
+          });
+          return raw;
         });
-        reject();
+      }
+      return raw;
+    })
+    .catch(e => {
+      dispatch('setErrorMessage', {
+        text: __('An error occurred while loading the file content.'),
+        action: payload =>
+          dispatch('getRawFileData', payload).then(() => dispatch('setErrorMessage', null)),
+        actionText: __('Please try again'),
+        actionPayload: { path },
       });
-  });
+      throw e;
+    })
+    .finally(() => {
+      commit(types.TOGGLE_LOADING, { entry: file, forceValue: false });
+    });
 };
 
 export const changeFileContent = ({ commit, state, getters }, { path, content }) => {
diff --git a/app/assets/javascripts/ide/stores/actions/merge_request.js b/app/assets/javascripts/ide/stores/actions/merge_request.js
index fcaf060ef09..3fdfdc5422b 100644
--- a/app/assets/javascripts/ide/stores/actions/merge_request.js
+++ b/app/assets/javascripts/ide/stores/actions/merge_request.js
@@ -16,6 +16,7 @@ export const getMergeRequestsForBranch = (
     .getProjectMergeRequests(`${projectId}`, {
       source_branch: branchId,
       source_project_id: state.projects[projectId].id,
+      state: 'opened',
       order_by: 'created_at',
       per_page: 1,
     })
diff --git a/app/assets/javascripts/ide/stores/mutation_types.js b/app/assets/javascripts/ide/stores/mutation_types.js
index d94adc3760f..ae119c2b1fd 100644
--- a/app/assets/javascripts/ide/stores/mutation_types.js
+++ b/app/assets/javascripts/ide/stores/mutation_types.js
@@ -1,6 +1,5 @@
 export const SET_INITIAL_DATA = 'SET_INITIAL_DATA';
 export const TOGGLE_LOADING = 'TOGGLE_LOADING';
-export const SET_LAST_COMMIT_DATA = 'SET_LAST_COMMIT_DATA';
 export const SET_LAST_COMMIT_MSG = 'SET_LAST_COMMIT_MSG';
 export const SET_RESIZING_STATUS = 'SET_RESIZING_STATUS';
 export const SET_EMPTY_STATE_SVGS = 'SET_EMPTY_STATE_SVGS';
diff --git a/app/assets/javascripts/ide/stores/mutations.js b/app/assets/javascripts/ide/stores/mutations.js
index e827aacac13..c64839e5019 100644
--- a/app/assets/javascripts/ide/stores/mutations.js
+++ b/app/assets/javascripts/ide/stores/mutations.js
@@ -34,15 +34,6 @@ export default {
       panelResizing: resizing,
     });
   },
-  [types.SET_LAST_COMMIT_DATA](state, { entry, lastCommit }) {
-    Object.assign(entry.lastCommit, {
-      id: lastCommit.commit.id,
-      url: lastCommit.commit_path,
-      message: lastCommit.commit.message,
-      author: lastCommit.commit.author_name,
-      updatedAt: lastCommit.commit.authored_date,
-    });
-  },
   [types.SET_LAST_COMMIT_MSG](state, lastCommitMsg) {
     Object.assign(state, {
       lastCommitMsg,
diff --git a/app/assets/javascripts/ide/stores/utils.js b/app/assets/javascripts/ide/stores/utils.js
index 1c5fe9fe9a5..f074e6880d0 100644
--- a/app/assets/javascripts/ide/stores/utils.js
+++ b/app/assets/javascripts/ide/stores/utils.js
@@ -25,13 +25,6 @@ export const dataStructure = () => ({
   changed: false,
   staged: false,
   lastCommitSha: '',
-  lastCommit: {
-    id: '',
-    url: '',
-    message: '',
-    updatedAt: '',
-    author: '',
-  },
   rawPath: '',
   binary: false,
   raw: '',
diff --git a/app/assets/javascripts/ide/utils.js b/app/assets/javascripts/ide/utils.js
index c28a2bd9f1d..9ec7b2c06ce 100644
--- a/app/assets/javascripts/ide/utils.js
+++ b/app/assets/javascripts/ide/utils.js
@@ -66,7 +66,7 @@ export const trimPathComponents = path =>
     .join('/');
 
 export function registerLanguages(def, ...defs) {
-  if (defs.length) defs.forEach(lang => registerLanguages(lang));
+  defs.forEach(lang => registerLanguages(lang));
 
   const languageId = def.id;
 
@@ -75,6 +75,19 @@ export function registerLanguages(def, ...defs) {
   languages.setLanguageConfiguration(languageId, def.conf);
 }
 
+export function registerSchemas({ language, options }, ...schemas) {
+  schemas.forEach(schema => registerSchemas(schema));
+
+  const defaults = {
+    json: languages.json.jsonDefaults,
+    yaml: languages.yaml.yamlDefaults,
+  };
+
+  if (defaults[language]) {
+    defaults[language].setDiagnosticsOptions(options);
+  }
+}
+
 export const otherSide = side => (side === SIDE_RIGHT ? SIDE_LEFT : SIDE_RIGHT);
 
 export function trimTrailingWhitespace(content) {