Fix complex variants of creatFlash imports

Fixes a range of imports for the `createFlash`
function where the local import is a slightly
different format.

This includes updates to relevant breaking specs.

Fix broken specs

app/assets/javascripts/commit_merge_requests.js

-/* global Flash */
+/* global createFlash */
 
 import $ from 'jquery';
 import axios from './lib/utils/axios_utils';
@@ -71,5 +71,9 @@ export function fetchCommitMergeRequests() {
 
       $container.html($content);
     })
-    .catch(() => Flash(s__('Commits|An error occurred while fetching merge requests data.')));
+    .catch(() =>
+      createFlash({
+        message: s__('Commits|An error occurred while fetching merge requests data.'),
+      }),
+    );
 }

app/assets/javascripts/groups/components/app.vue

 <script>
-/* global Flash */
-
 import { GlLoadingIcon, GlModal } from '@gitlab/ui';
+import createFlash from '~/flash';
 import { getParameterByName } from '~/lib/utils/common_utils';
 import { HIDDEN_CLASS } from '~/lib/utils/constants';
 import { mergeUrlParams } from '~/lib/utils/url_utility';
@@ -116,7 +115,7 @@ export default {
           this.isLoading = false;
           window.scrollTo({ top: 0, behavior: 'smooth' });
 
-          Flash(COMMON_STR.FAILURE);
+          createFlash({ message: COMMON_STR.FAILURE });
         });
     },
     fetchAllGroups() {
@@ -202,7 +201,7 @@ export default {
           if (err.status === 403) {
             message = COMMON_STR.LEAVE_FORBIDDEN;
           }
-          Flash(message);
+          createFlash({ message });
           this.targetGroup.isBeingRemoved = false;
         });
     },

app/assets/javascripts/pages/projects/commit/show/index.js

@@ -3,7 +3,7 @@ import $ from 'jquery';
 import loadAwardsHandler from '~/awards_handler';
 import ShortcutsNavigation from '~/behaviors/shortcuts/shortcuts_navigation';
 import Diff from '~/diff';
-import flash from '~/flash';
+import createFlash from '~/flash';
 import initChangesDropdown from '~/init_changes_dropdown';
 import initNotes from '~/init_notes';
 import axios from '~/lib/utils/axios_utils';
@@ -39,7 +39,7 @@ if (filesContainer.length) {
       new Diff();
     })
     .catch(() => {
-      flash({ message: __('An error occurred while retrieving diff files') });
+      createFlash({ message: __('An error occurred while retrieving diff files') });
     });
 } else {
   new Diff();

app/assets/javascripts/repository/components/upload_blob_modal.vue

@@ -170,7 +170,7 @@ export default {
         })
         .catch(() => {
           this.loading = false;
-          createFlash(ERROR_MESSAGE);
+          createFlash({ message: ERROR_MESSAGE });
         });
     },
     formData() {

doc/development/fe_guide/content_editor.md

@@ -90,7 +90,9 @@ export default {
     try {
       await this.contentEditor.setSerializedContent(this.content);
     } catch (e) {
-      createFlash(__('There was an error loading content in the editor'), e);
+      createFlash({ 
+        message: __('There was an error loading content in the editor'), error: e
+      });
     }
   },
   methods: {

doc/development/fe_guide/vuex.md

@@ -106,7 +106,7 @@ In this file, we write the actions that call mutations for handling a list of us
       .then(({ data }) => commit(types.RECEIVE_USERS_SUCCESS, data))
       .catch((error) => {
         commit(types.RECEIVE_USERS_ERROR, error)
-        createFlash('There was an error')
+        createFlash({ message: 'There was an error' })
       });
   }
 

spec/frontend/groups/components/app_spec.js

-import '~/flash';
 import { GlModal, GlLoadingIcon } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import AxiosMockAdapter from 'axios-mock-adapter';
 import Vue from 'vue';
 import waitForPromises from 'helpers/wait_for_promises';
+import createFlash from '~/flash';
 import appComponent from '~/groups/components/app.vue';
 import groupFolderComponent from '~/groups/components/group_folder.vue';
 import groupItemComponent from '~/groups/components/group_item.vue';
@@ -27,6 +27,7 @@ import {
 const $toast = {
   show: jest.fn(),
 };
+jest.mock('~/flash');
 
 describe('AppComponent', () => {
   let wrapper;
@@ -123,12 +124,12 @@ describe('AppComponent', () => {
         mock.onGet('/dashboard/groups.json').reply(400);
 
         jest.spyOn(window, 'scrollTo').mockImplementation(() => {});
-        jest.spyOn(window, 'Flash').mockImplementation(() => {});
-
         return vm.fetchGroups({}).then(() => {
           expect(vm.isLoading).toBe(false);
           expect(window.scrollTo).toHaveBeenCalledWith({ behavior: 'smooth', top: 0 });
-          expect(window.Flash).toHaveBeenCalledWith('An error occurred. Please try again.');
+          expect(createFlash).toHaveBeenCalledWith({
+            message: 'An error occurred. Please try again.',
+          });
         });
       });
     });
@@ -324,15 +325,13 @@ describe('AppComponent', () => {
         const message = 'An error occurred. Please try again.';
         jest.spyOn(vm.service, 'leaveGroup').mockRejectedValue({ status: 500 });
         jest.spyOn(vm.store, 'removeGroup');
-        jest.spyOn(window, 'Flash').mockImplementation(() => {});
-
         vm.leaveGroup();
 
         expect(vm.targetGroup.isBeingRemoved).toBe(true);
         expect(vm.service.leaveGroup).toHaveBeenCalledWith(childGroupItem.leavePath);
         return waitForPromises().then(() => {
           expect(vm.store.removeGroup).not.toHaveBeenCalled();
-          expect(window.Flash).toHaveBeenCalledWith(message);
+          expect(createFlash).toHaveBeenCalledWith({ message });
           expect(vm.targetGroup.isBeingRemoved).toBe(false);
         });
       });
@@ -341,15 +340,13 @@ describe('AppComponent', () => {
         const message = 'Failed to leave the group. Please make sure you are not the only owner.';
         jest.spyOn(vm.service, 'leaveGroup').mockRejectedValue({ status: 403 });
         jest.spyOn(vm.store, 'removeGroup');
-        jest.spyOn(window, 'Flash').mockImplementation(() => {});
-
         vm.leaveGroup(childGroupItem, groupItem);
 
         expect(vm.targetGroup.isBeingRemoved).toBe(true);
         expect(vm.service.leaveGroup).toHaveBeenCalledWith(childGroupItem.leavePath);
         return waitForPromises().then(() => {
           expect(vm.store.removeGroup).not.toHaveBeenCalled();
-          expect(window.Flash).toHaveBeenCalledWith(message);
+          expect(createFlash).toHaveBeenCalledWith({ message });
           expect(vm.targetGroup.isBeingRemoved).toBe(false);
         });
       });

spec/frontend/repository/components/upload_blob_modal_spec.js

@@ -190,7 +190,9 @@ describe('UploadBlobModal', () => {
           });
 
           it('creates a flash error', () => {
-            expect(createFlash).toHaveBeenCalledWith('Error uploading file. Please try again.');
+            expect(createFlash).toHaveBeenCalledWith({
+              message: 'Error uploading file. Please try again.',
+            });
           });
 
           afterEach(() => {