Get currentProjectId from rootState

The currentProjectId is in the main stores states
So we get the currentProjectId from rootState
& then pass this into the API call for file templates

app/assets/javascripts/api.js

@@ -231,7 +231,11 @@ const Api = {
       .replace(':type', type)
       .replace(':key', encodeURIComponent(key));
 
-    return axios.get(url, { params: options }).then(({ data }) => callback(data));
+    return axios.get(url, { params: options }).then(res => {
+      if (callback) callback(res.data);
+
+      return res;
+    });
   },
 
   projectTemplates(id, type, params = {}, callback) {
@@ -239,7 +243,11 @@ const Api = {
       .replace(':id', encodeURIComponent(id))
       .replace(':type', type);
 
-    return axios.get(url, { params }).then(({ data }) => callback(data));
+    return axios.get(url, { params }).then(res => {
+      if (callback) callback(res.data);
+
+      return res;
+    });
   },
 
   issueTemplate(namespacePath, projectPath, key, type, callback) {

app/assets/javascripts/blob/file_template_mediator.js

-/* eslint-disable class-methods-use-this */
-
 import Api from '~/api';
 
 import $ from 'jquery';
@@ -36,15 +34,14 @@ export default class FileTemplateMediator {
   initTemplateTypeSelector() {
     this.typeSelector = new FileTemplateTypeSelector({
       mediator: this,
-      dropdownData: this.templateSelectors
-        .map((templateSelector) => {
-          const cfg = templateSelector.config;
-
-          return {
-            name: cfg.name,
-            key: cfg.key,
-          };
-        }),
+      dropdownData: this.templateSelectors.map(templateSelector => {
+        const cfg = templateSelector.config;
+
+        return {
+          name: cfg.name,
+          key: cfg.key,
+        };
+      }),
     });
   }
 
@@ -92,7 +89,7 @@ export default class FileTemplateMediator {
   }
 
   listenForPreviewMode() {
-    this.$navLinks.on('click', 'a', (e) => {
+    this.$navLinks.on('click', 'a', e => {
       const urlPieces = e.target.href.split('#');
       const hash = urlPieces[1];
       if (hash === 'preview') {
@@ -108,7 +105,7 @@ export default class FileTemplateMediator {
       e.preventDefault();
     }
 
-    this.templateSelectors.forEach((selector) => {
+    this.templateSelectors.forEach(selector => {
       if (selector.config.key === item.key) {
         selector.show();
       } else {
@@ -130,7 +127,7 @@ export default class FileTemplateMediator {
     // in case undo menu is already already there
     this.destroyUndoMenu();
     this.fetchFileTemplate(selector.config.type, query, data)
-      .then((file) => {
+      .then(file => {
         this.showUndoMenu();
         this.setEditorContent(file);
         this.setFilename(selector.config.name);
@@ -141,7 +138,7 @@ export default class FileTemplateMediator {
 
   displayMatchedTemplateSelector() {
     const currentInput = this.getFilename();
-    this.templateSelectors.forEach((selector) => {
+    this.templateSelectors.forEach(selector => {
       const match = selector.config.pattern.test(currentInput);
 
       if (match) {
@@ -152,14 +149,10 @@ export default class FileTemplateMediator {
     });
   }
 
-  fetchFileTemplate(type, query, data) {
-    return new Promise((resolve) => {
+  fetchFileTemplate(type, query, data = {}) {
+    return new Promise(resolve => {
       const resolveFile = file => resolve(file);
 
-      if (!data) {
-        data = {};
-      }
-
       Api.projectTemplate(this.projectId, type, query, data, resolveFile);
     });
   }

app/assets/javascripts/blob_edit/edit_blob.js

@@ -34,7 +34,7 @@ export default class EditBlob {
     this.fileTemplateMediator = new TemplateSelectorMediator({
       currentAction,
       editor: this.editor,
-      projectId
+      projectId,
     });
   }
 
@@ -61,14 +61,15 @@ export default class EditBlob {
 
     if (paneId === '#preview') {
       this.$toggleButton.hide();
-      axios.post(currentLink.data('previewUrl'), {
-        content: this.editor.getValue(),
-      })
-      .then(({ data }) => {
-        currentPane.empty().append(data);
-        currentPane.renderGFM();
-      })
-      .catch(() => createFlash(__('An error occurred previewing the blob')));
+      axios
+        .post(currentLink.data('previewUrl'), {
+          content: this.editor.getValue(),
+        })
+        .then(({ data }) => {
+          currentPane.empty().append(data);
+          currentPane.renderGFM();
+        })
+        .catch(() => createFlash(__('An error occurred previewing the blob')));
     }
 
     this.$toggleButton.show();

app/assets/javascripts/ide/stores/modules/file_templates/actions.js

@@ -23,12 +23,12 @@ export const receiveTemplateTypesError = ({ commit, dispatch }) => {
 export const receiveTemplateTypesSuccess = ({ commit }, templates) =>
   commit(types.RECEIVE_TEMPLATE_TYPES_SUCCESS, templates);
 
-export const fetchTemplateTypes = ({ dispatch, state }, page = 1) => {
+export const fetchTemplateTypes = ({ dispatch, state, rootState }, page = 1) => {
   if (!Object.keys(state.selectedTemplateType).length) return Promise.reject();
 
   dispatch('requestTemplateTypes');
 
-  return Api.projectTemplates(state.currentProjectId, state.selectedTemplateType.key, { page })
+  return Api.projectTemplates(rootState.currentProjectId, state.selectedTemplateType.key, { page })
     .then(({ data, headers }) => {
       const nextPage = parseInt(normalizeHeaders(headers)['X-NEXT-PAGE'], 10);
 
@@ -74,12 +74,16 @@ export const receiveTemplateError = ({ dispatch }, template) => {
   );
 };
 
-export const fetchTemplate = ({ dispatch, state }, template) => {
+export const fetchTemplate = ({ dispatch, state, rootState }, template) => {
   if (template.content) {
     return dispatch('setFileTemplate', template);
   }
 
-  return Api.projectTemplate('1', state.selectedTemplateType.key, template.key || template.name)
+  return Api.projectTemplate(
+    rootState.currentProjectId,
+    state.selectedTemplateType.key,
+    template.key || template.name,
+  )
     .then(({ data }) => {
       dispatch('setFileTemplate', data);
     })