Add latest changes from gitlab-org/gitlab@master

sherry1214 · Jun 10, 2024 · 5aaced5 · 5aaced5
1 parent 3214c36
commit 5aaced5
Show file tree

Hide file tree

Showing 64 changed files with 916 additions and 507 deletions.
diff --git a/.rubocop_todo/style/inline_disable_annotation.yml b/.rubocop_todo/style/inline_disable_annotation.yml
@@ -3020,7 +3020,6 @@ Style/InlineDisableAnnotation:
     - 'spec/support/sidekiq_middleware.rb'
     - 'spec/support_specs/ability_check_spec.rb'
     - 'spec/support_specs/capybara_slow_finder_spec.rb'
-    - 'spec/support_specs/capybara_wait_for_all_requests_spec.rb'
     - 'spec/support_specs/database/multiple_databases_helpers_spec.rb'
     - 'spec/support_specs/helpers/stub_feature_flags_spec.rb'
     - 'spec/support_specs/matchers/event_store_spec.rb'

diff --git a/app/assets/javascripts/branches/components/delete_merged_branches.vue b/app/assets/javascripts/branches/components/delete_merged_branches.vue
@@ -26,7 +26,7 @@ export const i18n = {
     'Branches|This bulk action is %{strongStart}permanent and cannot be undone or recovered%{strongEnd}.',
   ),
   confirmationMessage: s__(
-    'Branches|Plese type the following to confirm: %{codeStart}delete%{codeEnd}.',
+    'Branches|Please type the following to confirm: %{codeStart}delete%{codeEnd}.',
   ),
   cancelButtonText: __('Cancel'),
   actionsToggleText: __('More actions'),

diff --git a/app/assets/javascripts/ci/catalog/components/list/catalog_search.vue b/app/assets/javascripts/ci/catalog/components/list/catalog_search.vue
@@ -1,19 +1,22 @@
 <script>
 import { GlSearchBoxByClick, GlSorting } from '@gitlab/ui';
 import { __ } from '~/locale';
+import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import {
   SORT_ASC,
   SORT_DESC,
   SORT_OPTION_CREATED,
   SORT_OPTION_RELEASED,
   SORT_OPTION_STAR_COUNT,
+  SORT_OPTION_POPULARITY,
 } from '../../constants';
 
 export default {
   components: {
     GlSearchBoxByClick,
     GlSorting,
   },
+  mixins: [glFeatureFlagMixin()],
   props: {
     initialSearchTerm: {
       default: '',
@@ -29,16 +32,21 @@ export default {
     };
   },
   computed: {
+    sortOptions() {
+      const options = [...this.$options.defaultSortOptions];
+      if (this.glFeatures?.ciCatalogPopularity) {
+        options.push({ value: SORT_OPTION_POPULARITY, text: __('Popularity') });
+      }
+      return options;
+    },
     currentSortDirection() {
       return this.isAscending ? SORT_ASC : SORT_DESC;
     },
     currentSorting() {
       return `${this.currentSortOption}_${this.currentSortDirection}`;
     },
     currentSortText() {
-      const currentSort = this.$options.sortOptions.find(
-        (sort) => sort.value === this.currentSortOption,
-      );
+      const currentSort = this.sortOptions.find((sort) => sort.value === this.currentSortOption);
       return currentSort.text;
     },
   },
@@ -61,7 +69,7 @@ export default {
       this.currentSortOption = sortingItem;
     },
   },
-  sortOptions: [
+  defaultSortOptions: [
     { value: SORT_OPTION_RELEASED, text: __('Released at') },
     { value: SORT_OPTION_CREATED, text: __('Created at') },
     { value: SORT_OPTION_STAR_COUNT, text: __('Star count') },
@@ -79,7 +87,7 @@ export default {
     <gl-sorting
       :is-ascending="isAscending"
       :text="currentSortText"
-      :sort-options="$options.sortOptions"
+      :sort-options="sortOptions"
       :sort-by="currentSortOption"
       data-testid="catalog-sorting-option-button"
       @sortByChange="setSelectedSortOption"

diff --git a/app/assets/javascripts/ci/catalog/components/list/ci_resources_list_item.vue b/app/assets/javascripts/ci/catalog/components/list/ci_resources_list_item.vue
@@ -3,6 +3,7 @@ import {
   GlAvatar,
   GlBadge,
   GlButton,
+  GlIcon,
   GlLink,
   GlSprintf,
   GlTooltipDirective,
@@ -14,6 +15,7 @@ import { formatDate, getTimeago } from '~/lib/utils/datetime_utility';
 import { toNounSeriesText } from '~/lib/utils/grammar';
 import { cleanLeadingSeparator } from '~/lib/utils/url_utility';
 import Markdown from '~/vue_shared/components/markdown/non_gfm_markdown.vue';
+import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import { CI_RESOURCE_DETAILS_PAGE_NAME } from '../../router/constants';
 import { VERIFICATION_LEVEL_UNVERIFIED } from '../../constants';
 import CiVerificationBadge from '../shared/ci_verification_badge.vue';
@@ -29,6 +31,7 @@ export default {
     GlAvatar,
     GlBadge,
     GlButton,
+    GlIcon,
     GlLink,
     GlSprintf,
     GlTruncate,
@@ -37,6 +40,7 @@ export default {
   directives: {
     GlTooltip: GlTooltipDirective,
   },
+  mixins: [glFeatureFlagMixin()],
   props: {
     resource: {
       type: Object,
@@ -86,6 +90,9 @@ export default {
     hasReleasedVersion() {
       return Boolean(this.latestVersion?.createdAt);
     },
+    isPopularityFeatureEnabled() {
+      return Boolean(this.glFeatures?.ciCatalogPopularity);
+    },
     isVerified() {
       return this.resource?.verificationLevel !== VERIFICATION_LEVEL_UNVERIFIED;
     },
@@ -107,6 +114,14 @@ export default {
     starCountText() {
       return n__('Star', 'Stars', this.starCount);
     },
+    usageCount() {
+      return this.resource?.last30DayUsageCount || 0;
+    },
+    usageText() {
+      return s__(
+        'CiCatalog|The number of projects that used a component from this project in a pipeline, by using "include:component", in the last 30 days.',
+      );
+    },
     webPath() {
       return cleanLeadingSeparator(this.resource?.webPath);
     },
@@ -170,18 +185,31 @@ export default {
           <gl-badge size="sm" class="gl-h-5 gl-align-self-center" variant="info">{{
             name
           }}</gl-badge>
-          <gl-button
-            v-gl-tooltip.top
-            data-testid="stats-favorites"
-            class="!gl-text-inherit"
-            icon="star-o"
-            :title="starCountText"
-            :href="starsHref"
-            size="small"
-            variant="link"
-          >
-            {{ starCount }}
-          </gl-button>
+          <div class="gl-display-flex gl-align-items-center gl-ml-3">
+            <div
+              v-if="isPopularityFeatureEnabled"
+              v-gl-tooltip.top
+              class="gl-display-flex gl-align-items-center gl-mr-3"
+              :title="usageText"
+            >
+              <gl-icon name="chart" :size="16" />
+              <span class="gl-ml-2" data-testid="stats-usage">
+                {{ usageCount }}
+              </span>
+            </div>
+            <gl-button
+              v-gl-tooltip.top
+              data-testid="stats-favorites"
+              class="!gl-text-inherit"
+              icon="star-o"
+              :title="starCountText"
+              :href="starsHref"
+              size="small"
+              variant="link"
+            >
+              {{ starCount }}
+            </gl-button>
+          </div>
         </div>
       </div>
       <div

diff --git a/app/assets/javascripts/ci/catalog/constants.js b/app/assets/javascripts/ci/catalog/constants.js
@@ -9,6 +9,7 @@ export const SCOPE = {
 };
 
 export const SORT_OPTION_CREATED = 'CREATED';
+export const SORT_OPTION_POPULARITY = 'USAGE_COUNT';
 export const SORT_OPTION_RELEASED = 'LATEST_RELEASED_AT';
 export const SORT_OPTION_STAR_COUNT = 'STAR_COUNT';
 export const SORT_ASC = 'ASC';

diff --git a/app/assets/javascripts/ci/catalog/graphql/fragments/catalog_resource.fragment.graphql b/app/assets/javascripts/ci/catalog/graphql/fragments/catalog_resource.fragment.graphql
@@ -5,6 +5,7 @@ fragment CatalogResourceFields on CiCatalogResource {
   icon
   name
   starCount
+  last30DayUsageCount
   starrersPath
   verificationLevel
   versions(first: 1) {

diff --git a/app/assets/javascripts/ci/pipeline_schedules/components/pipeline_schedules.vue b/app/assets/javascripts/ci/pipeline_schedules/components/pipeline_schedules.vue
@@ -18,7 +18,7 @@ import deletePipelineScheduleMutation from '../graphql/mutations/delete_pipeline
 import playPipelineScheduleMutation from '../graphql/mutations/play_pipeline_schedule.mutation.graphql';
 import takeOwnershipMutation from '../graphql/mutations/take_ownership.mutation.graphql';
 import getPipelineSchedulesQuery from '../graphql/queries/get_pipeline_schedules.query.graphql';
-import { ALL_SCOPE, SCHEDULES_PER_PAGE, DEFAULT_SORT_VALUE } from '../constants';
+import { ALL_SCOPE, SCHEDULES_PER_PAGE } from '../constants';
 import PipelineSchedulesTable from './table/pipeline_schedules_table.vue';
 import TakeOwnershipModal from './take_ownership_modal.vue';
 import DeletePipelineScheduleModal from './delete_pipeline_schedule_modal.vue';
@@ -90,7 +90,6 @@ export default {
           // we need to ensure we send null to the API when
           // the scope is 'ALL'
           status: this.scope === ALL_SCOPE ? null : this.scope,
-          sortValue: this.sortValue,
           first: this.pagination.first,
           last: this.pagination.last,
           prevPageCursor: this.pagination.prevPageCursor,
@@ -129,9 +128,6 @@ export default {
       playSuccess: false,
       errorMessage: '',
       scheduleId: null,
-      sortValue: DEFAULT_SORT_VALUE,
-      sortBy: 'ID',
-      sortDesc: true,
       showDeleteModal: false,
       showTakeOwnershipModal: false,
       count: 0,
@@ -336,13 +332,6 @@ export default {
         };
       }
     },
-    onUpdateSorting(sortValue, sortBy, sortDesc) {
-      this.sortValue = sortValue;
-      this.sortBy = sortBy;
-      this.sortDesc = sortDesc;
-
-      this.resetPagination();
-    },
   },
 };
 </script>
@@ -408,12 +397,9 @@ export default {
           <pipeline-schedules-table
             :schedules="schedules.list"
             :current-user="schedules.currentUser"
-            :sort-by="sortBy"
-            :sort-desc="sortDesc"
             @showTakeOwnershipModal="setTakeOwnershipModal"
             @showDeleteModal="setDeleteModal"
             @playPipelineSchedule="playPipelineSchedule"
-            @update-sorting="onUpdateSorting"
           />
 
           <gl-pagination

diff --git a/app/assets/javascripts/ci/pipeline_schedules/components/table/pipeline_schedules_table.vue b/app/assets/javascripts/ci/pipeline_schedules/components/table/pipeline_schedules_table.vue
@@ -1,7 +1,6 @@
 <script>
 import { GlTable } from '@gitlab/ui';
 import { s__ } from '~/locale';
-import { TH_DESCRIPTION_TEST_ID, TH_TARGET_TEST_ID, TH_NEXT_TEST_ID } from '../../constants';
 import PipelineScheduleActions from './cells/pipeline_schedule_actions.vue';
 import PipelineScheduleLastPipeline from './cells/pipeline_schedule_last_pipeline.vue';
 import PipelineScheduleNextRun from './cells/pipeline_schedule_next_run.vue';
@@ -15,21 +14,15 @@ export default {
   fields: [
     {
       key: 'description',
-      actualSortKey: 'DESCRIPTION',
       label: s__('PipelineSchedules|Description'),
       thClass: 'gl-border-t-none!',
       columnClass: 'gl-w-8/20',
-      sortable: true,
-      thAttr: TH_DESCRIPTION_TEST_ID,
     },
     {
       key: 'target',
-      actualSortKey: 'REF',
-      sortable: true,
       label: s__('PipelineSchedules|Target'),
       thClass: 'gl-border-t-none!',
       columnClass: 'gl-w-2/20',
-      thAttr: TH_TARGET_TEST_ID,
     },
     {
       key: 'pipeline',
@@ -39,12 +32,9 @@ export default {
     },
     {
       key: 'next',
-      actualSortKey: 'NEXT_RUN_AT',
       label: s__('PipelineSchedules|Next Run'),
       thClass: 'gl-border-t-none!',
       columnClass: 'gl-w-3/20',
-      sortable: true,
-      thAttr: TH_NEXT_TEST_ID,
     },
     {
       key: 'owner',
@@ -76,24 +66,6 @@ export default {
       type: Object,
       required: true,
     },
-    sortBy: {
-      type: String,
-      required: true,
-    },
-    sortDesc: {
-      type: Boolean,
-      required: true,
-    },
-  },
-  methods: {
-    fetchSortedData({ sortBy, sortDesc }) {
-      const field = this.$options.fields.find(({ key }) => key === sortBy);
-      const sortingDirection = sortDesc ? 'DESC' : 'ASC';
-
-      if (!field?.actualSortKey) return;
-
-      this.$emit('update-sorting', `${field.actualSortKey}_${sortingDirection}`, sortBy, sortDesc);
-    },
   },
 };
 </script>
@@ -104,11 +76,8 @@ export default {
     :items="schedules"
     :tbody-tr-attr="{ 'data-testid': 'pipeline-schedule-table-row' }"
     :empty-text="$options.i18n.emptyText"
-    :sort-by="sortBy"
-    :sort-desc="sortDesc"
     show-empty
     stacked="md"
-    @sort-changed="fetchSortedData"
   >
     <template #table-colgroup="{ fields }">
       <col v-for="field in fields" :key="field.key" :class="field.columnClass" />

diff --git a/app/assets/javascripts/ci/pipeline_schedules/constants.js b/app/assets/javascripts/ci/pipeline_schedules/constants.js
@@ -2,8 +2,3 @@ export const VARIABLE_TYPE = 'ENV_VAR';
 export const FILE_TYPE = 'FILE';
 export const ALL_SCOPE = 'ALL';
 export const SCHEDULES_PER_PAGE = 50;
-export const DEFAULT_SORT_VALUE = 'ID_DESC';
-
-export const TH_DESCRIPTION_TEST_ID = { 'data-testid': 'pipeline-schedules-description-sort' };
-export const TH_TARGET_TEST_ID = { 'data-testid': 'pipeline-schedules-target-sort' };
-export const TH_NEXT_TEST_ID = { 'data-testid': 'pipeline-schedules-next-sort' };
diff --git a/...ts/javascripts/ci/pipeline_schedules/graphql/queries/get_pipeline_schedules.query.graphql b/...ts/javascripts/ci/pipeline_schedules/graphql/queries/get_pipeline_schedules.query.graphql
@@ -4,7 +4,6 @@ query getPipelineSchedulesQuery(
   $projectPath: ID!
   $status: PipelineScheduleStatus
   $ids: [ID!] = null
-  $sortValue: PipelineScheduleSort
   $first: Int
   $last: Int
   $prevPageCursor: String = ""
@@ -22,7 +21,6 @@ query getPipelineSchedulesQuery(
     pipelineSchedules(
       status: $status
       ids: $ids
-      sort: $sortValue
       first: $first
       last: $last
       after: $nextPageCursor