Add latest changes from gitlab-org/gitlab@14-1-stable-eev14.1.0-rc42

4 files changed, 59 insertions, 14 deletions

diff --git a/spec/frontend/import_entities/components/group_dropdown_spec.js b/spec/frontend/import_entities/components/group_dropdown_spec.js
new file mode 100644
index 00000000000..f7aa0e889ea
--- /dev/null
+++ b/spec/frontend/import_entities/components/group_dropdown_spec.js
@@ -0,0 +1,44 @@
+import { GlSearchBoxByType, GlDropdown } from '@gitlab/ui';
+import { shallowMount } from '@vue/test-utils';
+import { nextTick } from 'vue';
+import GroupDropdown from '~/import_entities/components/group_dropdown.vue';
+
+describe('Import entities group dropdown component', () => {
+  let wrapper;
+  let namespacesTracker;
+
+  const createComponent = (propsData) => {
+    namespacesTracker = jest.fn();
+
+    wrapper = shallowMount(GroupDropdown, {
+      scopedSlots: {
+        default: namespacesTracker,
+      },
+      stubs: { GlDropdown },
+      propsData,
+    });
+  };
+
+  afterEach(() => {
+    wrapper.destroy();
+  });
+
+  it('passes namespaces from props to default slot', () => {
+    const namespaces = ['ns1', 'ns2'];
+    createComponent({ namespaces });
+
+    expect(namespacesTracker).toHaveBeenCalledWith({ namespaces });
+  });
+
+  it('filters namespaces based on user input', async () => {
+    const namespaces = ['match1', 'some unrelated', 'match2'];
+    createComponent({ namespaces });
+
+    namespacesTracker.mockReset();
+    wrapper.find(GlSearchBoxByType).vm.$emit('input', 'match');
+
+    await nextTick();
+
+    expect(namespacesTracker).toHaveBeenCalledWith({ namespaces: ['match1', 'match2'] });
+  });
+});
diff --git a/spec/frontend/import_entities/import_groups/components/import_table_row_spec.js b/spec/frontend/import_entities/import_groups/components/import_table_row_spec.js
index aa6a40cad18..654a8fd00d3 100644
--- a/spec/frontend/import_entities/import_groups/components/import_table_row_spec.js
+++ b/spec/frontend/import_entities/import_groups/components/import_table_row_spec.js
@@ -1,8 +1,9 @@
-import { GlButton, GlDropdown, GlDropdownItem, GlLink, GlFormInput } from '@gitlab/ui';
+import { GlButton, GlDropdownItem, GlLink, GlFormInput } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import Vue, { nextTick } from 'vue';
 import VueApollo from 'vue-apollo';
 import createMockApollo from 'helpers/mock_apollo_helper';
+import ImportGroupDropdown from '~/import_entities/components/group_dropdown.vue';
 import { STATUSES } from '~/import_entities/constants';
 import ImportTableRow from '~/import_entities/import_groups/components/import_table_row.vue';
 import addValidationErrorMutation from '~/import_entities/import_groups/graphql/mutations/add_validation_error.mutation.graphql';
@@ -41,7 +42,7 @@ describe('import table row', () => {
   };
   const findImportButton = () => findByText(GlButton, 'Import');
   const findNameInput = () => wrapper.find(GlFormInput);
-  const findNamespaceDropdown = () => wrapper.find(GlDropdown);
+  const findNamespaceDropdown = () => wrapper.find(ImportGroupDropdown);
 
   const createComponent = (props) => {
     apolloProvider = createMockApollo([
@@ -65,6 +66,7 @@ describe('import table row', () => {
 
     wrapper = shallowMount(ImportTableRow, {
       apolloProvider,
+      stubs: { ImportGroupDropdown },
       propsData: {
         availableNamespaces: availableNamespacesFixture,
         groupPathRegex: /.*/,
diff --git a/spec/frontend/import_entities/import_projects/components/import_projects_table_spec.js b/spec/frontend/import_entities/import_projects/components/import_projects_table_spec.js
index d9f4168f1a5..0e748baa313 100644
--- a/spec/frontend/import_entities/import_projects/components/import_projects_table_spec.js
+++ b/spec/frontend/import_entities/import_projects/components/import_projects_table_spec.js
@@ -11,6 +11,8 @@ import state from '~/import_entities/import_projects/store/state';
 describe('ImportProjectsTable', () => {
   let wrapper;
 
+  const USER_NAMESPACE = 'root';
+
   const findFilterField = () =>
     wrapper
       .findAllComponents(GlFormInput)
@@ -48,7 +50,7 @@ describe('ImportProjectsTable', () => {
     localVue.use(Vuex);
 
     const store = new Vuex.Store({
-      state: { ...state(), ...initialState },
+      state: { ...state(), defaultTargetNamespace: USER_NAMESPACE, ...initialState },
       getters: {
         ...getters,
         ...customGetters,
diff --git a/spec/frontend/import_entities/import_projects/components/provider_repo_table_row_spec.js b/spec/frontend/import_entities/import_projects/components/provider_repo_table_row_spec.js
index e15389be53a..72640f3d601 100644
--- a/spec/frontend/import_entities/import_projects/components/provider_repo_table_row_spec.js
+++ b/spec/frontend/import_entities/import_projects/components/provider_repo_table_row_spec.js
@@ -1,11 +1,11 @@
-import { GlBadge, GlButton } from '@gitlab/ui';
+import { GlBadge, GlButton, GlDropdown } from '@gitlab/ui';
 import { createLocalVue, shallowMount } from '@vue/test-utils';
 import { nextTick } from 'vue';
 import Vuex from 'vuex';
 import { STATUSES } from '~/import_entities//constants';
+import ImportGroupDropdown from '~/import_entities/components/group_dropdown.vue';
 import ImportStatus from '~/import_entities/components/import_status.vue';
 import ProviderRepoTableRow from '~/import_entities/import_projects/components/provider_repo_table_row.vue';
-import Select2Select from '~/vue_shared/components/select2_select.vue';
 
 describe('ProviderRepoTableRow', () => {
   let wrapper;
@@ -16,10 +16,8 @@ describe('ProviderRepoTableRow', () => {
     newName: 'newName',
   };
 
-  const availableNamespaces = [
-    { text: 'Groups', children: [{ id: 'test', text: 'test' }] },
-    { text: 'Users', children: [{ id: 'root', text: 'root' }] },
-  ];
+  const availableNamespaces = ['test'];
+  const userNamespace = 'root';
 
   function initStore(initialState) {
     const store = new Vuex.Store({
@@ -48,7 +46,7 @@ describe('ProviderRepoTableRow', () => {
     wrapper = shallowMount(ProviderRepoTableRow, {
       localVue,
       store,
-      propsData: { availableNamespaces, ...props },
+      propsData: { availableNamespaces, userNamespace, ...props },
     });
   }
 
@@ -81,9 +79,8 @@ describe('ProviderRepoTableRow', () => {
       expect(wrapper.find(ImportStatus).props().status).toBe(STATUSES.NONE);
     });
 
-    it('renders a select2 namespace select', () => {
-      expect(wrapper.find(Select2Select).exists()).toBe(true);
-      expect(wrapper.find(Select2Select).props().options.data).toBe(availableNamespaces);
+    it('renders a group namespace select', () => {
+      expect(wrapper.find(ImportGroupDropdown).props().namespaces).toBe(availableNamespaces);
     });
 
     it('renders import button', () => {
@@ -133,7 +130,7 @@ describe('ProviderRepoTableRow', () => {
     });
 
     it('does not renders a namespace select', () => {
-      expect(wrapper.find(Select2Select).exists()).toBe(false);
+      expect(wrapper.find(GlDropdown).exists()).toBe(false);
     });
 
     it('does not render import button', () => {