Fix file mode changes not always visible in MRs

File mode changes in MRs weren't visible when the content was changed
or file renamed.

Changelog: fixed

app/assets/javascripts/diffs/components/diff_file_header.vue

@@ -14,7 +14,6 @@ import {
 import { escape } from 'lodash';
 import { mapActions, mapGetters, mapState } from 'vuex';
 import { IdState } from 'vendor/vue-virtual-scroller';
-import { diffViewerModes } from '~/ide/constants';
 import { scrollToElement } from '~/lib/utils/common_utils';
 import { truncateSha } from '~/lib/utils/text_utility';
 import { __, s__, sprintf } from '~/locale';
@@ -181,7 +180,7 @@ export default {
       return this.diffFile.renamed_file;
     },
     isModeChanged() {
-      return this.diffFile.viewer.name === diffViewerModes.mode_changed;
+      return this.diffFile.mode_changed;
     },
     expandDiffToFullFileTitle() {
       if (this.diffFile.isShowingFullFile) {

spec/frontend/diffs/components/diff_file_header_spec.js

@@ -240,18 +240,19 @@ describe('DiffFileHeader component', () => {
   });
 
   describe('for any file', () => {
-    const otherModes = Object.keys(diffViewerModes).filter((m) => m !== 'mode_changed');
+    const allModes = Object.keys(diffViewerModes).map((m) => [m]);
 
-    it('for mode_changed file mode displays mode changes', () => {
+    it.each(allModes)('for %s file mode displays mode changes', (mode) => {
       createComponent({
         props: {
           diffFile: {
             ...diffFile,
+            mode_changed: true,
             a_mode: 'old-mode',
             b_mode: 'new-mode',
             viewer: {
               ...diffFile.viewer,
-              name: diffViewerModes.mode_changed,
+              name: diffViewerModes[mode],
             },
           },
         },
@@ -259,13 +260,14 @@ describe('DiffFileHeader component', () => {
       expect(findModeChangedLine().text()).toMatch(/old-mode.+new-mode/);
     });
 
-    it.each(otherModes.map((m) => [m]))(
+    it.each(allModes.filter((m) => m[0] !== 'mode_changed'))(
       'for %s file mode does not display mode changes',
       (mode) => {
         createComponent({
           props: {
             diffFile: {
               ...diffFile,
+              mode_changed: false,
               a_mode: 'old-mode',
               b_mode: 'new-mode',
               viewer: {