2 files changed, 17 insertions, 9 deletions

diff --git a/app/assets/javascripts/blob_edit/blob_bundle.js b/app/assets/javascripts/blob_edit/blob_bundle.js
index 9b9ade28623..c9972f0b43c 100644
--- a/app/assets/javascripts/blob_edit/blob_bundle.js
+++ b/app/assets/javascripts/blob_edit/blob_bundle.js
@@ -7,12 +7,14 @@ import BlobFileDropzone from '../blob/blob_file_dropzone';
 import initPopover from '~/blob/suggest_gitlab_ci_yml';
 import { disableButtonIfEmptyField, setCookie } from '~/lib/utils/common_utils';
 import Tracking from '~/tracking';
+import initWebIdeAlert from '~/blob/suggest_web_ide_ci';
 
 export default () => {
   const editBlobForm = $('.js-edit-blob-form');
   const uploadBlobForm = $('.js-upload-blob-form');
   const deleteBlobForm = $('.js-delete-blob-form');
   const suggestEl = document.querySelector('.js-suggest-gitlab-ci-yml');
+  const alertEl = document.getElementById('js-suggest-web-ide-ci');
 
   if (editBlobForm.length) {
     const urlRoot = editBlobForm.data('relativeUrlRoot');
@@ -65,12 +67,15 @@ export default () => {
 
     if (commitButton) {
       const { dismissKey, humanAccess } = suggestEl.dataset;
+      const urlParams = new URLSearchParams(window.location.search);
+      const mergeRequestPath = urlParams.get('mr_path') || true;
+
       const commitCookieName = `suggest_gitlab_ci_yml_commit_${dismissKey}`;
       const commitTrackLabel = 'suggest_gitlab_ci_yml_commit_changes';
       const commitTrackValue = '20';
 
       commitButton.addEventListener('click', () => {
-        setCookie(commitCookieName, true);
+        setCookie(commitCookieName, mergeRequestPath);
 
         Tracking.event(undefined, 'click_button', {
           label: commitTrackLabel,
@@ -80,4 +85,8 @@ export default () => {
       });
     }
   }
+
+  if (alertEl) {
+    initWebIdeAlert(alertEl);
+  }
 };
diff --git a/app/assets/javascripts/blob_edit/edit_blob.js b/app/assets/javascripts/blob_edit/edit_blob.js
index e22c9b0d4c4..2a4ab4b8827 100644
--- a/app/assets/javascripts/blob_edit/edit_blob.js
+++ b/app/assets/javascripts/blob_edit/edit_blob.js
@@ -40,9 +40,10 @@ export default class EditBlob {
     const MarkdownExtensionPromise = this.options.isMarkdown
       ? import('~/editor/editor_markdown_ext')
       : Promise.resolve(false);
+    const FileTemplateExtensionPromise = import('~/editor/editor_file_template_ext');
 
-    return Promise.all([EditorPromise, MarkdownExtensionPromise])
-      .then(([EditorModule, MarkdownExtension]) => {
+    return Promise.all([EditorPromise, MarkdownExtensionPromise, FileTemplateExtensionPromise])
+      .then(([EditorModule, MarkdownExtension, FileTemplateExtension]) => {
         const EditorLite = EditorModule.default;
         const editorEl = document.getElementById('editor');
         const fileNameEl =
@@ -50,18 +51,16 @@ export default class EditBlob {
         const fileContentEl = document.getElementById('file-content');
         const form = document.querySelector('.js-edit-blob-form');
 
-        this.editor = new EditorLite();
+        const rootEditor = new EditorLite();
 
-        if (MarkdownExtension) {
-          this.editor.use(MarkdownExtension.default);
-        }
-
-        this.editor.createInstance({
+        this.editor = rootEditor.createInstance({
           el: editorEl,
           blobPath: fileNameEl.value,
           blobContent: editorEl.innerText,
         });
 
+        rootEditor.use([MarkdownExtension.default, FileTemplateExtension.default], this.editor);
+
         fileNameEl.addEventListener('change', () => {
           this.editor.updateModelLanguage(fileNameEl.value);
         });