Merge branch '205401-change-viewer-mutation' into 'master'

Add a mutation that allows dynamically changing how a diff is viewed in the UI

See merge request gitlab-org/gitlab!30796

app/assets/javascripts/diffs/store/mutation_types.js

@@ -41,6 +41,8 @@ export const SET_CURRENT_VIEW_DIFF_FILE_LINES = 'SET_CURRENT_VIEW_DIFF_FILE_LINE
 export const ADD_CURRENT_VIEW_DIFF_FILE_LINES = 'ADD_CURRENT_VIEW_DIFF_FILE_LINES';
 export const TOGGLE_DIFF_FILE_RENDERING_MORE = 'TOGGLE_DIFF_FILE_RENDERING_MORE';
 
+export const SET_DIFF_FILE_VIEWER = 'SET_DIFF_FILE_VIEWER';
+
 export const SET_SHOW_SUGGEST_POPOVER = 'SET_SHOW_SUGGEST_POPOVER';
 
 export const TOGGLE_LINE_DISCUSSIONS = 'TOGGLE_LINE_DISCUSSIONS';

app/assets/javascripts/diffs/store/mutations.js

@@ -383,6 +383,11 @@ export default {
 
     file.renderingLines = !file.renderingLines;
   },
+  [types.SET_DIFF_FILE_VIEWER](state, { filePath, viewer }) {
+    const file = findDiffFile(state.diffFiles, filePath, 'file_path');
+
+    file.viewer = viewer;
+  },
   [types.SET_SHOW_SUGGEST_POPOVER](state) {
     state.showSuggestPopover = false;
   },

spec/frontend/diffs/store/mutations_spec.js

@@ -1041,6 +1041,36 @@ describe('DiffsStoreMutations', () => {
     });
   });
 
+  describe('SET_DIFF_FILE_VIEWER', () => {
+    it("should update the correct diffFile's viewer property", () => {
+      const state = {
+        diffFiles: [
+          { file_path: 'SearchString', viewer: 'OLD VIEWER' },
+          { file_path: 'OtherSearchString' },
+          { file_path: 'SomeOtherString' },
+        ],
+      };
+
+      mutations[types.SET_DIFF_FILE_VIEWER](state, {
+        filePath: 'SearchString',
+        viewer: 'NEW VIEWER',
+      });
+
+      expect(state.diffFiles[0].viewer).toEqual('NEW VIEWER');
+      expect(state.diffFiles[1].viewer).not.toBeDefined();
+      expect(state.diffFiles[2].viewer).not.toBeDefined();
+
+      mutations[types.SET_DIFF_FILE_VIEWER](state, {
+        filePath: 'OtherSearchString',
+        viewer: 'NEW VIEWER',
+      });
+
+      expect(state.diffFiles[0].viewer).toEqual('NEW VIEWER');
+      expect(state.diffFiles[1].viewer).toEqual('NEW VIEWER');
+      expect(state.diffFiles[2].viewer).not.toBeDefined();
+    });
+  });
+
   describe('SET_SHOW_SUGGEST_POPOVER', () => {
     it('sets showSuggestPopover to false', () => {
       const state = { showSuggestPopover: true };