Merge branch 'xanf-handle-empty-groups-list-in-bulk-imports' into 'master'

Correctly handle scenario when no top-level groups are available

See merge request gitlab-org/gitlab!54483

app/assets/javascripts/import_entities/import_groups/components/import_table.vue

@@ -33,11 +33,6 @@ export default {
       type: String,
       required: true,
     },
-    canCreateGroup: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
   },
 
   data() {
@@ -176,7 +171,6 @@ export default {
                 :key="group.id"
                 :group="group"
                 :available-namespaces="availableNamespaces"
-                :can-create-group="canCreateGroup"
                 @update-target-namespace="updateTargetNamespace(group.id, $event)"
                 @update-new-name="updateNewName(group.id, $event)"
                 @import-group="importGroup(group.id)"

app/assets/javascripts/import_entities/import_groups/components/import_table_row.vue

@@ -24,11 +24,6 @@ export default {
       type: Array,
       required: true,
     },
-    canCreateGroup: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
   },
   computed: {
     isDisabled() {
@@ -45,19 +40,18 @@ export default {
         text: namespace.full_path,
       }));
 
-      if (!this.canCreateGroup) {
-        return { data: availableNamespacesData };
-      }
+      const select2Config = {
+        data: [{ id: '', text: s__('BulkImport|No parent') }],
+      };
 
-      return {
-        data: [
-          { id: '', text: s__('BulkImport|No parent') },
-          {
+      if (availableNamespacesData.length) {
+        select2Config.data.push({
           text: s__('BulkImport|Existing groups'),
           children: availableNamespacesData,
-          },
-        ],
-      };
+        });
+      }
+
+      return select2Config;
     },
   },
   methods: {

app/assets/javascripts/import_entities/import_groups/graphql/client_factory.js

@@ -52,7 +52,7 @@ export function createResolvers({ endpoints }) {
                 status: STATUSES.NONE,
                 import_target: {
                   new_name: group.full_path,
-                  target_namespace: availableNamespaces[0].full_path,
+                  target_namespace: availableNamespaces[0]?.full_path ?? '',
                 },
               })),
               pageInfo: {

app/views/import/bulk_imports/status.html.haml

@@ -9,5 +9,4 @@
   available_namespaces_path: import_available_namespaces_path(format: :json),
   create_bulk_import_path: import_bulk_imports_path(format: :json),
   jobs_path: realtime_changes_import_bulk_imports_path(format: :json),
-  can_create_group: current_user.can_create_group?.to_s,
   source_url: @source_url } }

spec/frontend/import_entities/import_groups/components/import_table_row_spec.js

@@ -75,23 +75,24 @@ describe('import table row', () => {
     });
   });
 
-  it('renders only namespaces if user cannot create new group', () => {
+  it('renders only no parent option if available namespaces list is empty', () => {
     createComponent({
-      canCreateGroup: false,
       group: getFakeGroup(STATUSES.NONE),
+      availableNamespaces: [],
     });
 
     const dropdownData = findNamespaceDropdown().props().options.data;
     const noParentOption = dropdownData.find((o) => o.text === 'No parent');
+    const existingGroupOption = dropdownData.find((o) => o.text === 'Existing groups');
 
-    expect(noParentOption).toBeUndefined();
-    expect(dropdownData).toHaveLength(availableNamespacesFixture.length);
+    expect(noParentOption.id).toBe('');
+    expect(existingGroupOption).toBeUndefined();
   });
 
-  it('renders no parent option in available namespaces if user can create new group', () => {
+  it('renders both no parent option and available namespaces list when available namespaces list is not empty', () => {
     createComponent({
-      canCreateGroup: true,
       group: getFakeGroup(STATUSES.NONE),
+      availableNamespaces: availableNamespacesFixture,
     });
 
     const dropdownData = findNamespaceDropdown().props().options.data;

spec/frontend/import_entities/import_groups/components/import_table_spec.js

@@ -27,7 +27,7 @@ describe('import table', () => {
   ];
   const FAKE_PAGE_INFO = { page: 1, perPage: 20, total: 40, totalPages: 2 };
 
-  const createComponent = ({ bulkImportSourceGroups, canCreateGroup }) => {
+  const createComponent = ({ bulkImportSourceGroups }) => {
     apolloProvider = createMockApollo([], {
       Query: {
         availableNamespaces: () => availableNamespacesFixture,
@@ -43,7 +43,6 @@ describe('import table', () => {
     wrapper = shallowMount(ImportTable, {
       propsData: {
         sourceUrl: 'https://demo.host',
-        canCreateGroup,
       },
       stubs: {
         GlSprintf,
@@ -100,25 +99,6 @@ describe('import table', () => {
     expect(wrapper.findAll(ImportTableRow)).toHaveLength(FAKE_GROUPS.length);
   });
 
-  it.each`
-    canCreateGroup | userPermissions
-    ${true}        | ${'user can create new top-level group'}
-    ${false}       | ${'user cannot create new top-level group'}
-  `('correctly passes canCreateGroup to rows when $userPermissions', async ({ canCreateGroup }) => {
-    createComponent({
-      bulkImportSourceGroups: () => ({
-        nodes: FAKE_GROUPS,
-        pageInfo: FAKE_PAGE_INFO,
-      }),
-      canCreateGroup,
-    });
-    await waitForPromises();
-
-    wrapper.findAllComponents(ImportTableRow).wrappers.forEach((w) => {
-      expect(w.props().canCreateGroup).toBe(canCreateGroup);
-    });
-  });
-
   it('does not render status string when result list is empty', async () => {
     createComponent({
       bulkImportSourceGroups: jest.fn().mockResolvedValue({

spec/frontend/import_entities/import_groups/graphql/client_factory_spec.js

@@ -82,6 +82,15 @@ describe('Bulk import resolvers', () => {
           .reply(httpStatus.OK, availableNamespacesFixture);
       });
 
+      it('populates each result instance with empty import_target when there are no available namespaces', async () => {
+        axiosMockAdapter.onGet(FAKE_ENDPOINTS.availableNamespaces).reply(httpStatus.OK, []);
+
+        const response = await client.query({ query: bulkImportSourceGroupsQuery });
+        results = response.data.bulkImportSourceGroups.nodes;
+
+        expect(results.every((r) => r.import_target.target_namespace === '')).toBe(true);
+      });
+
       describe('when called', () => {
         beforeEach(async () => {
           const response = await client.query({ query: bulkImportSourceGroupsQuery });