Merge branch '329445-devops-adoption-should-not-only-fetch-the-first-200-groups' into 'master'

DevOps Adoption - remove max requests fetching group data

See merge request gitlab-org/gitlab!63491

ee/app/assets/javascripts/analytics/devops_report/devops_adoption/components/devops_adoption_app.vue

@@ -8,8 +8,6 @@ import { mergeUrlParams, updateHistory, getParameterValues } from '~/lib/utils/u
 import {
   DEVOPS_ADOPTION_STRINGS,
   DEVOPS_ADOPTION_ERROR_KEYS,
-  MAX_REQUEST_COUNT,
-  MAX_SEGMENTS,
   DATE_TIME_FORMAT,
   DEFAULT_POLLING_INTERVAL,
   DEVOPS_ADOPTION_GROUP_LEVEL_LABEL,
@@ -58,13 +56,11 @@ export default {
   },
   trackDevopsTabClickEvent: TRACK_ADOPTION_TAB_CLICK_EVENT,
   trackDevopsScoreTabClickEvent: TRACK_DEVOPS_SCORE_TAB_CLICK_EVENT,
-  maxSegments: MAX_SEGMENTS,
   devopsAdoptionTableConfiguration: DEVOPS_ADOPTION_TABLE_CONFIGURATION,
   data() {
     return {
       isLoadingGroups: false,
       isLoadingEnableGroup: false,
-      requestCount: 0,
       openModal: false,
       errors: {
         [DEVOPS_ADOPTION_ERROR_KEYS.groups]: false,
@@ -140,9 +136,6 @@ export default {
         this.isLoadingEnableGroup || this.$apollo.queries.devopsAdoptionEnabledNamespaces.loading
       );
     },
-    segmentLimitReached() {
-      return this.devopsAdoptionEnabledNamespaces?.nodes?.length > this.$options.maxSegments;
-    },
     editGroupsButtonLabel() {
       return this.isGroup
         ? this.$options.i18n.groupLevelLabel
@@ -241,8 +234,7 @@ export default {
             nodes: [...this.groups.nodes, ...nodes],
           };
 
-          this.requestCount += 1;
-          if (this.requestCount < MAX_REQUEST_COUNT && pageInfo?.nextPage) {
+          if (pageInfo?.nextPage) {
             this.fetchGroups(pageInfo.nextPage);
           } else {
             this.isLoadingGroups = false;
@@ -322,7 +314,6 @@ export default {
           :has-segments-data="hasSegmentsData"
           :timestamp="timestamp"
           :has-group-data="hasGroupData"
-          :segment-limit-reached="segmentLimitReached"
           :edit-groups-button-label="editGroupsButtonLabel"
           :cols="tab.cols"
           :segments="devopsAdoptionEnabledNamespaces"

ee/app/assets/javascripts/analytics/devops_report/devops_adoption/components/devops_adoption_section.vue

 <script>
-import { GlLoadingIcon, GlTooltipDirective, GlButton, GlSprintf } from '@gitlab/ui';
-import { TABLE_HEADER_TEXT, ADD_REMOVE_BUTTON_TOOLTIP } from '../constants';
+import { GlLoadingIcon, GlButton, GlSprintf } from '@gitlab/ui';
+import { TABLE_HEADER_TEXT } from '../constants';
 import DevopsAdoptionEmptyState from './devops_adoption_empty_state.vue';
 import DevopsAdoptionTable from './devops_adoption_table.vue';
 
@@ -15,9 +15,6 @@ export default {
   i18n: {
     tableHeaderText: TABLE_HEADER_TEXT,
   },
-  directives: {
-    GlTooltip: GlTooltipDirective,
-  },
   props: {
     isLoading: {
       type: Boolean,
@@ -35,10 +32,6 @@ export default {
       type: Boolean,
       required: true,
     },
-    segmentLimitReached: {
-      type: Boolean,
-      required: true,
-    },
     editGroupsButtonLabel: {
       type: String,
       required: true,
@@ -53,11 +46,6 @@ export default {
       default: () => {},
     },
   },
-  computed: {
-    addSegmentButtonTooltipText() {
-      return this.segmentLimitReached ? ADD_REMOVE_BUTTON_TOOLTIP : false;
-    },
-  },
 };
 </script>
 <template>
@@ -72,15 +60,10 @@ export default {
           <template #timestamp>{{ timestamp }}</template>
         </gl-sprintf>
       </span>
-      <span
-        v-if="hasGroupData"
-        v-gl-tooltip.hover="addSegmentButtonTooltipText"
-        data-testid="segmentButtonWrapper"
-      >
-        <gl-button :disabled="segmentLimitReached" @click="$emit('openAddRemoveModal')">{{
-          editGroupsButtonLabel
-        }}</gl-button></span
-      >
+
+      <gl-button v-if="hasGroupData" @click="$emit('openAddRemoveModal')">{{
+        editGroupsButtonLabel
+      }}</gl-button>
     </div>
     <devops-adoption-table
       :cols="cols"

ee/app/assets/javascripts/analytics/devops_report/devops_adoption/constants.js

-import { s__, __, sprintf } from '~/locale';
+import { s__, __ } from '~/locale';
 
 export const DEFAULT_POLLING_INTERVAL = 30000;
 
-export const MAX_SEGMENTS = 30;
-
-export const MAX_REQUEST_COUNT = 10;
-
 export const PER_PAGE = 100;
 
 export const DEVOPS_ADOPTION_SEGMENT_MODAL_ID = 'devopsSegmentModal';
@@ -24,13 +20,6 @@ export const TABLE_HEADER_TEXT = s__(
   'DevopsAdoption|Feature adoption is based on usage in the current calendar month. Last updated: %{timestamp}.',
 );
 
-export const ADD_REMOVE_BUTTON_TOOLTIP = sprintf(
-  s__('DevopsAdoption|Maximum %{maxSegments} groups allowed'),
-  {
-    maxSegments: MAX_SEGMENTS,
-  },
-);
-
 export const DEVOPS_ADOPTION_GROUP_LEVEL_LABEL = s__('DevopsAdoption|Add/remove sub-groups');
 
 export const DEVOPS_ADOPTION_TABLE_REMOVE_BUTTON_DISABLED = s__(

ee/spec/frontend/analytics/devops_report/devops_adoption/components/devops_adoption_app_spec.js

@@ -193,20 +193,6 @@ describe('DevopsAdoptionApp', () => {
       });
     });
 
-    describe('when fetching too many pages of data', () => {
-      beforeEach(async () => {
-        // Always send the same page
-        groupsSpy = jest.fn().mockResolvedValue(initialResponse);
-        const mockApollo = createMockApolloProvider({ groupsSpy });
-        wrapper = createComponent({ mockApollo, data: { requestCount: 2 } });
-        await waitForPromises();
-      });
-
-      it('should fetch data twice', () => {
-        expect(groupsSpy).toHaveBeenCalledTimes(2);
-      });
-    });
-
     describe('when error is thrown in the fetchMore request', () => {
       const error = 'Error: foo!';
 

ee/spec/frontend/analytics/devops_report/devops_adoption/components/devops_adoption_section_spec.js

@@ -5,7 +5,6 @@ import DevopsAdoptionEmptyState from 'ee/analytics/devops_report/devops_adoption
 import DevopsAdoptionSection from 'ee/analytics/devops_report/devops_adoption/components/devops_adoption_section.vue';
 import DevopsAdoptionTable from 'ee/analytics/devops_report/devops_adoption/components/devops_adoption_table.vue';
 import { DEVOPS_ADOPTION_TABLE_CONFIGURATION } from 'ee/analytics/devops_report/devops_adoption/constants';
-import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
 import { devopsAdoptionNamespaceData } from '../mock_data';
 
@@ -20,16 +19,11 @@ describe('DevopsAdoptionSection', () => {
           hasSegmentsData: true,
           timestamp: '2020-10-31 23:59',
           hasGroupData: true,
-          segmentLimitReached: false,
           editGroupsButtonLabel: 'Add/Remove groups',
           cols: DEVOPS_ADOPTION_TABLE_CONFIGURATION[0].cols,
           segments: devopsAdoptionNamespaceData,
-          addSegmentButtonTooltipText: 'Maximum 30 groups allowed',
           ...props,
         },
-        directives: {
-          GlTooltip: createMockDirective(),
-        },
         stubs: {
           GlSprintf,
         },
@@ -42,7 +36,6 @@ describe('DevopsAdoptionSection', () => {
   const findTable = () => wrapper.findComponent(DevopsAdoptionTable);
   const findEmptyState = () => wrapper.findComponent(DevopsAdoptionEmptyState);
   const findAddEditButton = () => wrapper.findComponent(GlButton);
-  const findAddRemoveButtonWrapper = () => wrapper.findByTestId('segmentButtonWrapper');
 
   describe('while loading', () => {
     beforeEach(() => {
@@ -111,45 +104,20 @@ describe('DevopsAdoptionSection', () => {
       });
 
       describe('edit groups button', () => {
-        describe('segment limit reached', () => {
-          beforeEach(() => {
-            createComponent({ segmentLimitReached: true });
-          });
-
-          it('is disabled', () => {
-            expect(findAddEditButton().props('disabled')).toBe(true);
-          });
-
-          it('displays a tooltip', () => {
-            const tooltip = getBinding(findAddRemoveButtonWrapper().element, 'gl-tooltip');
-
-            expect(tooltip).toBeDefined();
-            expect(tooltip.value).toBe('Maximum 30 groups allowed');
-          });
+        beforeEach(() => {
+          createComponent();
         });
 
-        describe('segment limit not reached', () => {
-          beforeEach(() => {
-            createComponent();
-          });
-
-          it('is enabled', () => {
-            expect(findAddEditButton().props('disabled')).toBe(false);
-          });
-
-          it('does not display a tooltip', () => {
-            const tooltip = getBinding(findAddRemoveButtonWrapper().element, 'gl-tooltip');
-
-            expect(tooltip.value).toBe(false);
-          });
+        it('is enabled', () => {
+          expect(findAddEditButton().props('disabled')).toBe(false);
+        });
 
-          it('emits openAddRemoveModal when clicked', () => {
-            expect(wrapper.emitted('openAddRemoveModal')).toBeUndefined();
+        it('emits openAddRemoveModal when clicked', () => {
+          expect(wrapper.emitted('openAddRemoveModal')).toBeUndefined();
 
-            findAddEditButton().vm.$emit('click');
+          findAddEditButton().vm.$emit('click');
 
-            expect(wrapper.emitted('openAddRemoveModal')).toEqual([[]]);
-          });
+          expect(wrapper.emitted('openAddRemoveModal')).toEqual([[]]);
         });
       });
     });

locale/gitlab.pot

@@ -11339,9 +11339,6 @@ msgstr ""
 msgid "DevopsAdoption|MRs"
 msgstr ""
 
-msgid "DevopsAdoption|Maximum %{maxSegments} groups allowed"
-msgstr ""
-
 msgid "DevopsAdoption|My group"
 msgstr ""