diff --git a/app/assets/javascripts/diffs/store/utils.js b/app/assets/javascripts/diffs/store/utils.js
index f2028892a5ffeaaf8810cc8eb2c3c44b2d7f1ad2..4526a34a2bdbea06c2353302bb5d48d9c4153e6c 100644
--- a/app/assets/javascripts/diffs/store/utils.js
+++ b/app/assets/javascripts/diffs/store/utils.js
@@ -406,7 +406,7 @@ function deduplicateFilesList(files) {
 
 export function prepareDiffData({ diff, priorFiles = [], meta = false }) {
   const cleanedFiles = (diff.diff_files || [])
-    .map((file, index, allFiles) => prepareRawDiffFile({ file, allFiles, meta }))
+    .map((file, index, allFiles) => prepareRawDiffFile({ file, allFiles, meta, index }))
     .map(ensureBasicDiffFileLines)
     .map(prepareDiffFileLines)
     .map((file) => finalizeDiffFile(file));
diff --git a/app/assets/javascripts/diffs/utils/diff_file.js b/app/assets/javascripts/diffs/utils/diff_file.js
index 54dcf70c4915255c48f125563d5f957cf1c12abf..a7251bfa7756f5d45f5bd6becd64ed4c949c1a1e 100644
--- a/app/assets/javascripts/diffs/utils/diff_file.js
+++ b/app/assets/javascripts/diffs/utils/diff_file.js
@@ -50,7 +50,7 @@ function identifier(file) {
 
 export const isNotDiffable = (file) => file?.viewer?.name === viewerModes.not_diffable;
 
-export function prepareRawDiffFile({ file, allFiles, meta = false }) {
+export function prepareRawDiffFile({ file, allFiles, meta = false, index = -1 }) {
   const additionalProperties = {
     brokenSymlink: fileSymlinkInformation(file, allFiles),
     viewer: {
@@ -66,6 +66,10 @@ export function prepareRawDiffFile({ file, allFiles, meta = false }) {
     additionalProperties.id = identifier(file);
   }
 
+  if (index >= 0 && Number(index) === index) {
+    additionalProperties.order = index;
+  }
+
   return Object.assign(file, additionalProperties);
 }
 
diff --git a/spec/frontend/diffs/utils/diff_file_spec.js b/spec/frontend/diffs/utils/diff_file_spec.js
index 3223b6c2dab89b9c503eed5362e1dc8706e5bab3..3a6a537f92457e4c35a08fc4d14e7d5d8acadea9 100644
--- a/spec/frontend/diffs/utils/diff_file_spec.js
+++ b/spec/frontend/diffs/utils/diff_file_spec.js
@@ -149,6 +149,38 @@ describe('diff_file utilities', () => {
 
       expect(preppedFile).not.toHaveProp('id');
     });
+
+    it.each`
+      index
+      ${null}
+      ${undefined}
+      ${-1}
+      ${false}
+      ${true}
+      ${'idx'}
+      ${'42'}
+    `('does not set the order property if an invalid index ($index) is provided', ({ index }) => {
+      const preppedFile = prepareRawDiffFile({
+        file: files[0],
+        allFiles: files,
+        index,
+      });
+
+      /* expect.anything() doesn't match null or undefined */
+      expect(preppedFile).toEqual(expect.not.objectContaining({ order: null }));
+      expect(preppedFile).toEqual(expect.not.objectContaining({ order: undefined }));
+      expect(preppedFile).toEqual(expect.not.objectContaining({ order: expect.anything() }));
+    });
+
+    it('sets the provided valid index to the order property', () => {
+      const preppedFile = prepareRawDiffFile({
+        file: files[0],
+        allFiles: files,
+        index: 42,
+      });
+
+      expect(preppedFile).toEqual(expect.objectContaining({ order: 42 }));
+    });
   });
 
   describe('getShortShaFromFile', () => {