Add latest changes from gitlab-org/gitlab@master

4 files changed, 20 insertions, 3 deletions

diff --git a/app/assets/javascripts/error_tracking_settings/components/app.vue b/app/assets/javascripts/error_tracking_settings/components/app.vue
index 70fb1fa9cd7..3bc91a2adbf 100644
--- a/app/assets/javascripts/error_tracking_settings/components/app.vue
+++ b/app/assets/javascripts/error_tracking_settings/components/app.vue
@@ -190,7 +190,7 @@ export default {
         <gl-form-radio name="error-tracking-integrated" :value="true">
           {{ __('GitLab') }}
           <template #help>
-            {{ __('Uses GitLab as a lightweight alternative to Sentry.') }}
+            {{ __('Uses GitLab as an alternative to Sentry.') }}
           </template>
         </gl-form-radio>
       </gl-form-radio-group>
diff --git a/app/assets/javascripts/packages_and_registries/package_registry/components/details/package_title.vue b/app/assets/javascripts/packages_and_registries/package_registry/components/details/package_title.vue
index 11fd0db3106..cee976656f9 100644
--- a/app/assets/javascripts/packages_and_registries/package_registry/components/details/package_title.vue
+++ b/app/assets/javascripts/packages_and_registries/package_registry/components/details/package_title.vue
@@ -2,7 +2,8 @@
 import { GlSprintf, GlBadge, GlResizeObserverDirective } from '@gitlab/ui';
 import { GlBreakpointInstance } from '@gitlab/ui/dist/utils';
 import { numberToHumanSize } from '~/lib/utils/number_utils';
-import { __ } from '~/locale';
+import { __, s__, sprintf } from '~/locale';
+import { formatDate } from '~/lib/utils/datetime_utility';
 import PackageTags from '~/packages_and_registries/shared/components/package_tags.vue';
 import { PACKAGE_TYPE_NUGET } from '~/packages_and_registries/package_registry/constants';
 import { getPackageTypeLabel } from '~/packages_and_registries/package_registry/utils';
@@ -25,6 +26,7 @@ export default {
   },
   inject: ['isGroupPage'],
   i18n: {
+    lastDownloadedAt: s__('PackageRegistry|Last downloaded %{dateTime}'),
     packageInfo: __('v%{version} published %{timeAgo}'),
   },
   props: {
@@ -39,6 +41,11 @@ export default {
     };
   },
   computed: {
+    packageLastDownloadedAtDisplay() {
+      return sprintf(this.$options.i18n.lastDownloadedAt, {
+        dateTime: formatDate(this.packageEntity.lastDownloadedAt, 'mmm d, yyyy'),
+      });
+    },
     packageTypeDisplay() {
       return getPackageTypeLabel(this.packageEntity.packageType);
     },
@@ -136,6 +143,15 @@ export default {
       <metadata-item data-testid="package-ref" icon="branch" :text="packagePipeline.ref" />
     </template>
 
+    <template v-if="packageEntity.lastDownloadedAt" #metadata-last-downloaded-at>
+      <metadata-item
+        data-testid="package-last-downloaded-at"
+        icon="download"
+        :text="packageLastDownloadedAtDisplay"
+        size="m"
+      />
+    </template>
+
     <template #right-actions>
       <slot name="delete-button"></slot>
     </template>
diff --git a/app/assets/javascripts/packages_and_registries/package_registry/graphql/queries/get_package_details.query.graphql b/app/assets/javascripts/packages_and_registries/package_registry/graphql/queries/get_package_details.query.graphql
index f3f0d096d10..8e50c95b10b 100644
--- a/app/assets/javascripts/packages_and_registries/package_registry/graphql/queries/get_package_details.query.graphql
+++ b/app/assets/javascripts/packages_and_registries/package_registry/graphql/queries/get_package_details.query.graphql
@@ -4,6 +4,7 @@ query getPackageDetails($id: PackagesPackageID!) {
     name
     packageType
     version
+    lastDownloadedAt
     createdAt
     updatedAt
     status
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/widget/widget.vue b/app/assets/javascripts/vue_merge_request_widget/components/widget/widget.vue
index c9fc2dde0bd..26d715c48b6 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/widget/widget.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/widget/widget.vue
@@ -187,7 +187,7 @@ export default {
 
 <template>
   <section class="media-section" data-testid="widget-extension">
-    <div class="media gl-p-5">
+    <div class="gl-p-5 gl-align-items-center gl-display-flex">
       <status-icon
         :level="1"
         :name="widgetName"