Add latest changes from gitlab-org/gitlab@14-8-stable-eev14.8.0-rc42

14 files changed, 81 insertions, 68 deletions

diff --git a/app/assets/javascripts/packages_and_registries/container_registry/explorer/components/details_page/tags_list.vue b/app/assets/javascripts/packages_and_registries/container_registry/explorer/components/details_page/tags_list.vue
index 4fda4058711..7659ba5f9ea 100644
--- a/app/assets/javascripts/packages_and_registries/container_registry/explorer/components/details_page/tags_list.vue
+++ b/app/assets/javascripts/packages_and_registries/container_registry/explorer/components/details_page/tags_list.vue
@@ -7,6 +7,7 @@ import RegistryList from '~/packages_and_registries/shared/components/registry_l
 
 import PersistedSearch from '~/packages_and_registries/shared/components/persisted_search.vue';
 import { FILTERED_SEARCH_TERM } from '~/packages_and_registries/shared/constants';
+import TagsLoader from '~/packages_and_registries/shared/components/tags_loader.vue';
 import {
   REMOVE_TAGS_BUTTON_TITLE,
   TAGS_LIST_TITLE,
@@ -20,7 +21,6 @@ import {
 } from '../../constants/index';
 import getContainerRepositoryTagsQuery from '../../graphql/queries/get_container_repository_tags.query.graphql';
 import TagsListRow from './tags_list_row.vue';
-import TagsLoader from './tags_loader.vue';
 
 export default {
   name: 'TagsList',
diff --git a/app/assets/javascripts/packages_and_registries/container_registry/explorer/pages/details.vue b/app/assets/javascripts/packages_and_registries/container_registry/explorer/pages/details.vue
index bb687ffdb89..931849c9918 100644
--- a/app/assets/javascripts/packages_and_registries/container_registry/explorer/pages/details.vue
+++ b/app/assets/javascripts/packages_and_registries/container_registry/explorer/pages/details.vue
@@ -5,6 +5,7 @@ import createFlash from '~/flash';
 import axios from '~/lib/utils/axios_utils';
 import { joinPaths } from '~/lib/utils/url_utility';
 import Tracking from '~/tracking';
+import TagsLoader from '~/packages_and_registries/shared/components/tags_loader.vue';
 import DeleteImage from '../components/delete_image.vue';
 import DeleteAlert from '../components/details_page/delete_alert.vue';
 import DeleteModal from '../components/details_page/delete_modal.vue';
@@ -12,7 +13,6 @@ import DetailsHeader from '../components/details_page/details_header.vue';
 import PartialCleanupAlert from '../components/details_page/partial_cleanup_alert.vue';
 import StatusAlert from '../components/details_page/status_alert.vue';
 import TagsList from '../components/details_page/tags_list.vue';
-import TagsLoader from '../components/details_page/tags_loader.vue';
 
 import {
   ALERT_SUCCESS_TAG,
diff --git a/app/assets/javascripts/packages_and_registries/container_registry/explorer/pages/list.vue b/app/assets/javascripts/packages_and_registries/container_registry/explorer/pages/list.vue
index 3274de05803..e2acebf39d6 100644
--- a/app/assets/javascripts/packages_and_registries/container_registry/explorer/pages/list.vue
+++ b/app/assets/javascripts/packages_and_registries/container_registry/explorer/pages/list.vue
@@ -52,7 +52,7 @@ export default {
       ),
     CliCommands: () =>
       import(
-        /* webpackChunkName: 'container_registry_components' */ '../components/list_page/cli_commands.vue'
+        /* webpackChunkName: 'container_registry_components' */ '~/packages_and_registries/shared/components/cli_commands.vue'
       ),
     GlModal,
     GlSprintf,
@@ -68,7 +68,7 @@ export default {
     GlTooltip: GlTooltipDirective,
   },
   mixins: [Tracking.mixin()],
-  inject: ['config'],
+  inject: ['config', 'dockerBuildCommand', 'dockerPushCommand', 'dockerLoginCommand'],
   loader: {
     repeat: 10,
     width: 1000,
@@ -96,6 +96,9 @@ export default {
         return data[this.graphqlResource]?.containerRepositories.nodes;
       },
       result({ data }) {
+        if (!data) {
+          return;
+        }
         this.pageInfo = data[this.graphqlResource]?.containerRepositories?.pageInfo;
         this.containerRepositoriesCount = data[this.graphqlResource]?.containerRepositoriesCount;
       },
@@ -321,7 +324,12 @@ export default {
         :hide-expiration-policy-data="config.isGroupPage"
       >
         <template #commands>
-          <cli-commands v-if="showCommands" />
+          <cli-commands
+            v-if="showCommands"
+            :docker-build-command="dockerBuildCommand"
+            :docker-push-command="dockerPushCommand"
+            :docker-login-command="dockerLoginCommand"
+          />
         </template>
       </registry-header>
 
diff --git a/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/infrastructure_title.vue b/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/infrastructure_title.vue
index 2a479c65d0c..9bab08b8548 100644
--- a/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/infrastructure_title.vue
+++ b/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/infrastructure_title.vue
@@ -21,13 +21,17 @@ export default {
     },
   },
   computed: {
-    showModuleCount() {
-      return Number.isInteger(this.count);
+    hasModules() {
+      return Number.isInteger(this.count) && this.count > 0;
     },
     moduleAmountText() {
       return n__(`%d Module`, `%d Modules`, this.count);
     },
     infoMessages() {
+      if (!this.hasModules) {
+        return [];
+      }
+
       return [{ text: this.$options.i18n.LIST_INTRO_TEXT, link: this.helpUrl }];
     },
   },
@@ -43,11 +47,7 @@ export default {
 <template>
   <title-area :title="$options.i18n.LIST_TITLE_TEXT" :info-messages="infoMessages">
     <template #metadata-amount>
-      <metadata-item
-        v-if="showModuleCount"
-        icon="infrastructure-registry"
-        :text="moduleAmountText"
-      />
+      <metadata-item v-if="hasModules" icon="infrastructure-registry" :text="moduleAmountText" />
     </template>
   </title-area>
 </template>
diff --git a/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/packages_list_app.vue b/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/packages_list_app.vue
index 462618a7f12..184a24047eb 100644
--- a/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/packages_list_app.vue
+++ b/app/assets/javascripts/packages_and_registries/infrastructure_registry/list/components/packages_list_app.vue
@@ -99,7 +99,7 @@ export default {
 <template>
   <div>
     <infrastructure-title :help-url="packageHelpUrl" :count="packagesCount" />
-    <infrastructure-search @update="requestPackagesList" />
+    <infrastructure-search v-if="packagesCount > 0" @update="requestPackagesList" />
 
     <package-list @page:changed="onPageChanged" @package:delete="onPackageDeleteRequest">
       <template #empty-state>
diff --git a/app/assets/javascripts/packages_and_registries/package_registry/components/details/version_row.vue b/app/assets/javascripts/packages_and_registries/package_registry/components/details/version_row.vue
index 1afd1b69db0..57ff3cd2a83 100644
--- a/app/assets/javascripts/packages_and_registries/package_registry/components/details/version_row.vue
+++ b/app/assets/javascripts/packages_and_registries/package_registry/components/details/version_row.vue
@@ -61,11 +61,13 @@ export default {
     </template>
 
     <template #right-secondary>
-      <gl-sprintf :message="__('Created %{timestamp}')">
-        <template #timestamp>
-          <time-ago-tooltip :time="packageEntity.createdAt" />
-        </template>
-      </gl-sprintf>
+      <span>
+        <gl-sprintf :message="__('Created %{timestamp}')">
+          <template #timestamp>
+            <time-ago-tooltip :time="packageEntity.createdAt" />
+          </template>
+        </gl-sprintf>
+      </span>
     </template>
   </list-item>
 </template>
diff --git a/app/assets/javascripts/packages_and_registries/package_registry/components/list/package_search.vue b/app/assets/javascripts/packages_and_registries/package_registry/components/list/package_search.vue
index 3483d23e251..c27083261b5 100644
--- a/app/assets/javascripts/packages_and_registries/package_registry/components/list/package_search.vue
+++ b/app/assets/javascripts/packages_and_registries/package_registry/components/list/package_search.vue
@@ -9,6 +9,8 @@ import {
   FILTERED_SEARCH_TERM,
   FILTERED_SEARCH_TYPE,
 } from '~/packages_and_registries/shared/constants';
+import { LIST_KEY_CREATED_AT } from '~/packages_and_registries/package_registry/constants';
+import LocalStorageSync from '~/vue_shared/components/local_storage_sync.vue';
 import PackageTypeToken from './tokens/package_type_token.vue';
 
 export default {
@@ -22,13 +24,13 @@ export default {
       operators: OPERATOR_IS_ONLY,
     },
   ],
-  components: { RegistrySearch, UrlSync },
+  components: { RegistrySearch, UrlSync, LocalStorageSync },
   inject: ['isGroupPage'],
   data() {
     return {
       filters: [],
       sorting: {
-        orderBy: 'name',
+        orderBy: LIST_KEY_CREATED_AT,
         sort: 'desc',
       },
       mountRegistrySearch: false,
@@ -94,19 +96,26 @@ export default {
 </script>
 
 <template>
-  <url-sync>
-    <template #default="{ updateQuery }">
-      <registry-search
-        v-if="mountRegistrySearch"
-        :filter="filters"
-        :sorting="sorting"
-        :tokens="$options.tokens"
-        :sortable-fields="sortableFields"
-        @sorting:changed="updateSortingAndEmitUpdate"
-        @filter:changed="updateFilters"
-        @filter:submit="emitUpdate"
-        @query:changed="updateQuery"
-      />
-    </template>
-  </url-sync>
+  <local-storage-sync
+    storage-key="package_registry_list_sorting"
+    :value="sorting"
+    as-json
+    @input="updateSorting"
+  >
+    <url-sync>
+      <template #default="{ updateQuery }">
+        <registry-search
+          v-if="mountRegistrySearch"
+          :filter="filters"
+          :sorting="sorting"
+          :tokens="$options.tokens"
+          :sortable-fields="sortableFields"
+          @sorting:changed="updateSortingAndEmitUpdate"
+          @filter:changed="updateFilters"
+          @filter:submit="emitUpdate"
+          @query:changed="updateQuery"
+        />
+      </template>
+    </url-sync>
+  </local-storage-sync>
 </template>
diff --git a/app/assets/javascripts/packages_and_registries/package_registry/graphql/fragmentTypes.json b/app/assets/javascripts/packages_and_registries/package_registry/graphql/fragmentTypes.json
deleted file mode 100644
index c61a653d10b..00000000000
--- a/app/assets/javascripts/packages_and_registries/package_registry/graphql/fragmentTypes.json
+++ /dev/null
@@ -1,17 +0,0 @@
-{
-  "__schema": {
-    "types": [
-      {
-        "kind": "UNION",
-        "name": "PackageMetadata",
-        "possibleTypes": [
-          { "name": "ComposerMetadata" },
-          { "name": "ConanMetadata" },
-          { "name": "MavenMetadata" },
-          { "name": "NugetMetadata" },
-          { "name": "PypiMetadata" }
-        ]
-      }
-    ]
-  }
-}
diff --git a/app/assets/javascripts/packages_and_registries/package_registry/graphql/index.js b/app/assets/javascripts/packages_and_registries/package_registry/graphql/index.js
index 21d6fbc9e1f..56f95fa2c1f 100644
--- a/app/assets/javascripts/packages_and_registries/package_registry/graphql/index.js
+++ b/app/assets/javascripts/packages_and_registries/package_registry/graphql/index.js
@@ -1,22 +1,9 @@
-import { IntrospectionFragmentMatcher } from 'apollo-cache-inmemory';
 import Vue from 'vue';
 import VueApollo from 'vue-apollo';
 import createDefaultClient from '~/lib/graphql';
-import introspectionQueryResultData from './fragmentTypes.json';
-
-const fragmentMatcher = new IntrospectionFragmentMatcher({
-  introspectionQueryResultData,
-});
 
 Vue.use(VueApollo);
 
 export const apolloProvider = new VueApollo({
-  defaultClient: createDefaultClient(
-    {},
-    {
-      cacheConfig: {
-        fragmentMatcher,
-      },
-    },
-  ),
+  defaultClient: createDefaultClient(),
 });
diff --git a/app/assets/javascripts/packages_and_registries/container_registry/explorer/components/list_page/cli_commands.vue b/app/assets/javascripts/packages_and_registries/shared/components/cli_commands.vue
index 07ee3c6083b..de7ab3e6d7b 100644
--- a/app/assets/javascripts/packages_and_registries/container_registry/explorer/components/list_page/cli_commands.vue
+++ b/app/assets/javascripts/packages_and_registries/shared/components/cli_commands.vue
@@ -10,7 +10,7 @@ import {
   COPY_BUILD_TITLE,
   PUSH_COMMAND_LABEL,
   COPY_PUSH_TITLE,
-} from '../../constants/index';
+} from '../constants';
 
 const trackingLabel = 'quickstart_dropdown';
 
@@ -20,7 +20,20 @@ export default {
     CodeInstruction,
   },
   mixins: [Tracking.mixin({ label: trackingLabel })],
-  inject: ['config', 'dockerBuildCommand', 'dockerPushCommand', 'dockerLoginCommand'],
+  props: {
+    dockerBuildCommand: {
+      type: String,
+      required: true,
+    },
+    dockerPushCommand: {
+      type: String,
+      required: true,
+    },
+    dockerLoginCommand: {
+      type: String,
+      required: true,
+    },
+  },
   trackingLabel,
   i18n: {
     QUICK_START,
diff --git a/app/assets/javascripts/packages_and_registries/container_registry/explorer/components/details_page/tags_loader.vue b/app/assets/javascripts/packages_and_registries/shared/components/tags_loader.vue
index b7afa5fba33..b7afa5fba33 100644
--- a/app/assets/javascripts/packages_and_registries/container_registry/explorer/components/details_page/tags_loader.vue
+++ b/app/assets/javascripts/packages_and_registries/shared/components/tags_loader.vue
diff --git a/app/assets/javascripts/packages_and_registries/shared/constants/index.js b/app/assets/javascripts/packages_and_registries/shared/constants/index.js
new file mode 100644
index 00000000000..7659781d96e
--- /dev/null
+++ b/app/assets/javascripts/packages_and_registries/shared/constants/index.js
@@ -0,0 +1,2 @@
+export * from './package_registry';
+export * from './quick_start';
diff --git a/app/assets/javascripts/packages_and_registries/shared/constants.js b/app/assets/javascripts/packages_and_registries/shared/constants/package_registry.js
index afc72a2c627..afc72a2c627 100644
--- a/app/assets/javascripts/packages_and_registries/shared/constants.js
+++ b/app/assets/javascripts/packages_and_registries/shared/constants/package_registry.js
diff --git a/app/assets/javascripts/packages_and_registries/shared/constants/quick_start.js b/app/assets/javascripts/packages_and_registries/shared/constants/quick_start.js
new file mode 100644
index 00000000000..6a39c07eba2
--- /dev/null
+++ b/app/assets/javascripts/packages_and_registries/shared/constants/quick_start.js
@@ -0,0 +1,9 @@
+import { s__ } from '~/locale';
+
+export const QUICK_START = s__('ContainerRegistry|CLI Commands');
+export const LOGIN_COMMAND_LABEL = s__('ContainerRegistry|Login');
+export const COPY_LOGIN_TITLE = s__('ContainerRegistry|Copy login command');
+export const BUILD_COMMAND_LABEL = s__('ContainerRegistry|Build an image');
+export const COPY_BUILD_TITLE = s__('ContainerRegistry|Copy build command');
+export const PUSH_COMMAND_LABEL = s__('ContainerRegistry|Push an image');
+export const COPY_PUSH_TITLE = s__('ContainerRegistry|Copy push command');