Pass a pseudo Diff File from the notes app to the noteable discussion component

app/assets/javascripts/notes/components/discussion_notes.vue

@@ -121,6 +121,7 @@ export default {
           :is="componentName(firstNote)"
           :note="componentData(firstNote)"
           :line="line || diffLine"
+          :discussion-file="discussion.diff_file"
           :commit="commit"
           :help-page-path="helpPagePath"
           :show-reply-button="userCanReply"
@@ -167,6 +168,7 @@ export default {
           v-for="(note, index) in discussion.notes"
           :key="note.id"
           :note="componentData(note)"
+          :discussion-file="discussion.diff_file"
           :help-page-path="helpPagePath"
           :line="diffLine"
           :discussion-root="index === 0"

app/assets/javascripts/notes/components/noteable_note.vue

@@ -48,6 +48,11 @@ export default {
       required: false,
       default: null,
     },
+    discussionFile: {
+      type: Object,
+      required: false,
+      default: null,
+    },
     helpPagePath: {
       type: String,
       required: false,
@@ -167,12 +172,18 @@ export default {
       return commentLineOptions(lines, this.commentLineStart, this.line.line_code);
     },
     diffFile() {
+      let fileResolvedFromAvailableSource;
+
       if (this.commentLineStart.line_code) {
         const lineCode = this.commentLineStart.line_code.split('_')[0];
-        return this.getDiffFileByHash(lineCode);
+        fileResolvedFromAvailableSource = this.getDiffFileByHash(lineCode);
+      }
+
+      if (!fileResolvedFromAvailableSource && this.discussionFile) {
+        fileResolvedFromAvailableSource = this.discussionFile;
       }
 
-      return null;
+      return fileResolvedFromAvailableSource || null;
     },
   },
   created() {

changelogs/unreleased/tor-defect-overview-placeholder-message-overview-file-source.yml

+---
+title: Fill in all placeholder values in the apply suggestion commit message placeholder
+  text
+merge_request: 58136
+author:
+type: other

spec/frontend/notes/components/noteable_note_spec.js

-import { mount, createLocalVue } from '@vue/test-utils';
+import { mount } from '@vue/test-utils';
 import { escape } from 'lodash';
+import Vue from 'vue';
+import Vuex from 'vuex';
+
 import waitForPromises from 'helpers/wait_for_promises';
+
+import DiffsModule from '~/diffs/store/modules';
+
 import NoteActions from '~/notes/components/note_actions.vue';
 import NoteBody from '~/notes/components/note_body.vue';
 import NoteHeader from '~/notes/components/note_header.vue';
 import issueNote from '~/notes/components/noteable_note.vue';
-import createStore from '~/notes/stores';
+import NotesModule from '~/notes/stores/modules';
+
 import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue';
+
 import { noteableDataMock, notesDataMock, note } from '../mock_data';
 
+Vue.use(Vuex);
+
+const singleLineNotePosition = {
+  line_range: {
+    start: {
+      line_code: 'abc_1_1',
+      type: null,
+      old_line: '1',
+      new_line: '1',
+    },
+    end: {
+      line_code: 'abc_1_1',
+      type: null,
+      old_line: '1',
+      new_line: '1',
+    },
+  },
+};
+
 describe('issue_note', () => {
   let store;
   let wrapper;
   const findMultilineComment = () => wrapper.find('[data-testid="multiline-comment"]');
 
-  const createWrapper = (props = {}) => {
-    store = createStore();
+  const createWrapper = (props = {}, storeUpdater = (s) => s) => {
+    store = new Vuex.Store(
+      storeUpdater({
+        modules: {
+          notes: NotesModule(),
+          diffs: DiffsModule(),
+        },
+      }),
+    );
+
     store.dispatch('setNoteableData', noteableDataMock);
     store.dispatch('setNotesData', notesDataMock);
 
-    const localVue = createLocalVue();
-    wrapper = mount(localVue.extend(issueNote), {
+    wrapper = mount(issueNote, {
       store,
       propsData: {
         note,
         ...props,
       },
-      localVue,
       stubs: [
         'note-header',
         'user-avatar-link',
@@ -216,10 +249,14 @@ describe('issue_note', () => {
       const noteBodyComponent = wrapper.findComponent(NoteBody);
 
       store.hotUpdate({
+        modules: {
+          notes: {
             actions: {
               updateNote() {},
               setSelectedCommentPositionHover() {},
             },
+          },
+        },
       });
 
       noteBodyComponent.vm.$emit('handleFormUpdate', noteBody, null, () => {});
@@ -238,9 +275,13 @@ describe('issue_note', () => {
     it('restores content of updated note', async () => {
       const updatedText = 'updated note text';
       store.hotUpdate({
+        modules: {
+          notes: {
             actions: {
               updateNote() {},
             },
+          },
+        },
       });
       const noteBody = wrapper.findComponent(NoteBody);
       noteBody.vm.resetAutoSave = () => {};
@@ -267,10 +308,14 @@ describe('issue_note', () => {
 
     const updateActions = () => {
       store.hotUpdate({
+        modules: {
+          notes: {
             actions: {
               updateNote,
               setSelectedCommentPositionHover() {},
             },
+          },
+        },
       });
     };
 
@@ -299,4 +344,62 @@ describe('issue_note', () => {
       expect(updateNote.mock.calls[0][1].note.note.position).toBe(expectation);
     });
   });
+
+  describe('diffFile', () => {
+    it.each`
+      scenario                         | files        | noteDef
+      ${'the note has no position'}    | ${undefined} | ${note}
+      ${'the Diffs store has no data'} | ${[]}        | ${{ ...note, position: singleLineNotePosition }}
+    `(
+      'returns `null` when $scenario and no diff file is provided as a prop',
+      ({ noteDef, diffs }) => {
+        const storeUpdater = (rawStore) => {
+          const updatedStore = { ...rawStore };
+
+          if (diffs) {
+            updatedStore.modules.diffs.state.diffFiles = diffs;
+          }
+
+          return updatedStore;
+        };
+
+        createWrapper({ note: noteDef, discussionFile: null }, storeUpdater);
+
+        expect(wrapper.vm.diffFile).toBe(null);
+      },
+    );
+
+    it("returns the correct diff file from the Diffs store if it's available", () => {
+      createWrapper(
+        {
+          note: { ...note, position: singleLineNotePosition },
+        },
+        (rawStore) => {
+          const updatedStore = { ...rawStore };
+          updatedStore.modules.diffs.state.diffFiles = [
+            { file_hash: 'abc', testId: 'diffFileTest' },
+          ];
+          return updatedStore;
+        },
+      );
+
+      expect(wrapper.vm.diffFile.testId).toBe('diffFileTest');
+    });
+
+    it('returns the provided diff file if the more robust getters fail', () => {
+      createWrapper(
+        {
+          note: { ...note, position: singleLineNotePosition },
+          discussionFile: { testId: 'diffFileTest' },
+        },
+        (rawStore) => {
+          const updatedStore = { ...rawStore };
+          updatedStore.modules.diffs.state.diffFiles = [];
+          return updatedStore;
+        },
+      );
+
+      expect(wrapper.vm.diffFile.testId).toBe('diffFileTest');
+    });
+  });
 });