Add latest changes from gitlab-org/gitlab@13-5-stable-eev13.5.0-rc42

1 files changed, 35 insertions, 38 deletions

diff --git a/app/assets/javascripts/packages/list/components/packages_list_app.vue b/app/assets/javascripts/packages/list/components/packages_list_app.vue
index 6304f723f6a..cbb3bfd35ac 100644
--- a/app/assets/javascripts/packages/list/components/packages_list_app.vue
+++ b/app/assets/javascripts/packages/list/components/packages_list_app.vue
@@ -3,13 +3,13 @@ import { mapActions, mapState } from 'vuex';
 import { GlEmptyState, GlTab, GlTabs, GlLink, GlSprintf } from '@gitlab/ui';
 import { s__, sprintf } from '~/locale';
 import createFlash from '~/flash';
+import { historyReplaceState } from '~/lib/utils/common_utils';
+import { SHOW_DELETE_SUCCESS_ALERT } from '~/packages/shared/constants';
 import PackageFilter from './packages_filter.vue';
 import PackageList from './packages_list.vue';
 import PackageSort from './packages_sort.vue';
 import { PACKAGE_REGISTRY_TABS, DELETE_PACKAGE_SUCCESS_MESSAGE } from '../constants';
-import PackagesComingSoon from '../coming_soon/packages_coming_soon.vue';
-import { SHOW_DELETE_SUCCESS_ALERT } from '~/packages/shared/constants';
-import { historyReplaceState } from '~/lib/utils/common_utils';
+import PackageTitle from './package_title.vue';
 
 export default {
   components: {
@@ -21,15 +21,16 @@ export default {
     PackageFilter,
     PackageList,
     PackageSort,
-    PackagesComingSoon,
+    PackageTitle,
   },
   computed: {
     ...mapState({
       emptyListIllustration: state => state.config.emptyListIllustration,
       emptyListHelpUrl: state => state.config.emptyListHelpUrl,
-      comingSoon: state => state.config.comingSoon,
       filterQuery: state => state.filterQuery,
       selectedType: state => state.selectedType,
+      packageHelpUrl: state => state.config.packageHelpUrl,
+      packagesCount: state => state.pagination?.total,
     }),
     tabsToRender() {
       return PACKAGE_REGISTRY_TABS;
@@ -89,39 +90,35 @@ export default {
 </script>
 
 <template>
-  <gl-tabs @input="tabChanged">
-    <template #tabs-end>
-      <div
-        class="gl-display-flex gl-align-self-center gl-py-2 gl-flex-grow-1 gl-justify-content-end"
-      >
-        <package-filter class="mr-1" @filter="requestPackagesList" />
-        <package-sort @sort:changed="requestPackagesList" />
-      </div>
-    </template>
+  <div>
+    <package-title :package-help-url="packageHelpUrl" :packages-count="packagesCount" />
 
-    <gl-tab v-for="(tab, index) in tabsToRender" :key="index" :title="tab.title">
-      <package-list @page:changed="onPageChanged" @package:delete="onPackageDeleteRequest">
-        <template #empty-state>
-          <gl-empty-state :title="emptyStateTitle(tab)" :svg-path="emptyListIllustration">
-            <template #description>
-              <gl-sprintf v-if="filterQuery" :message="$options.i18n.widenFilters" />
-              <gl-sprintf v-else :message="$options.i18n.noResults">
-                <template #noPackagesLink="{content}">
-                  <gl-link :href="emptyListHelpUrl" target="_blank">{{ content }}</gl-link>
-                </template>
-              </gl-sprintf>
-            </template>
-          </gl-empty-state>
-        </template>
-      </package-list>
-    </gl-tab>
+    <gl-tabs @input="tabChanged">
+      <template #tabs-end>
+        <div
+          class="gl-display-flex gl-align-self-center gl-py-2 gl-flex-grow-1 gl-justify-content-end"
+        >
+          <package-filter class="gl-mr-2" @filter="requestPackagesList" />
+          <package-sort @sort:changed="requestPackagesList" />
+        </div>
+      </template>
 
-    <gl-tab v-if="comingSoon" :title="__('Coming soon')" lazy>
-      <packages-coming-soon
-        :illustration="emptyListIllustration"
-        :project-path="comingSoon.projectPath"
-        :suggested-contributions-path="comingSoon.suggestedContributions"
-      />
-    </gl-tab>
-  </gl-tabs>
+      <gl-tab v-for="(tab, index) in tabsToRender" :key="index" :title="tab.title">
+        <package-list @page:changed="onPageChanged" @package:delete="onPackageDeleteRequest">
+          <template #empty-state>
+            <gl-empty-state :title="emptyStateTitle(tab)" :svg-path="emptyListIllustration">
+              <template #description>
+                <gl-sprintf v-if="filterQuery" :message="$options.i18n.widenFilters" />
+                <gl-sprintf v-else :message="$options.i18n.noResults">
+                  <template #noPackagesLink="{content}">
+                    <gl-link :href="emptyListHelpUrl" target="_blank">{{ content }}</gl-link>
+                  </template>
+                </gl-sprintf>
+              </template>
+            </gl-empty-state>
+          </template>
+        </package-list>
+      </gl-tab>
+    </gl-tabs>
+  </div>
 </template>