Add latest changes from gitlab-org/gitlab@13-9-stable-eev13.9.0-rc42

12 files changed, 29 insertions, 155 deletions

diff --git a/app/assets/javascripts/groups/components/app.vue b/app/assets/javascripts/groups/components/app.vue
index 4f26bab8bd3..9d2c7cfe581 100644
--- a/app/assets/javascripts/groups/components/app.vue
+++ b/app/assets/javascripts/groups/components/app.vue
@@ -2,13 +2,13 @@
 /* global Flash */
 
 import { GlLoadingIcon, GlModal } from '@gitlab/ui';
-import { __, s__, sprintf } from '~/locale';
-import { HIDDEN_CLASS } from '~/lib/utils/constants';
 import { getParameterByName } from '~/lib/utils/common_utils';
+import { HIDDEN_CLASS } from '~/lib/utils/constants';
 import { mergeUrlParams } from '~/lib/utils/url_utility';
+import { __, s__, sprintf } from '~/locale';
 
-import eventHub from '../event_hub';
 import { COMMON_STR, CONTENT_LIST_CLASS } from '../constants';
+import eventHub from '../event_hub';
 import groupsComponent from './groups.vue';
 
 export default {
diff --git a/app/assets/javascripts/groups/components/group_item.vue b/app/assets/javascripts/groups/components/group_item.vue
index d65ad974c73..d41fa0b2410 100644
--- a/app/assets/javascripts/groups/components/group_item.vue
+++ b/app/assets/javascripts/groups/components/group_item.vue
@@ -3,16 +3,14 @@
 import { GlLoadingIcon, GlBadge, GlTooltipDirective } from '@gitlab/ui';
 import { visitUrl } from '../../lib/utils/url_utility';
 import identicon from '../../vue_shared/components/identicon.vue';
-import eventHub from '../event_hub';
 import { VISIBILITY_TYPE_ICON, GROUP_VISIBILITY_TYPE } from '../constants';
+import eventHub from '../event_hub';
 
+import itemActions from './item_actions.vue';
 import itemCaret from './item_caret.vue';
-import itemTypeIcon from './item_type_icon.vue';
 import itemStats from './item_stats.vue';
 import itemStatsValue from './item_stats_value.vue';
-import itemActions from './item_actions.vue';
-
-import { showLearnGitLabGroupItemPopover } from '~/onboarding_issues';
+import itemTypeIcon from './item_type_icon.vue';
 
 export default {
   directives: {
@@ -78,11 +76,6 @@ export default {
       return this.group.microdata || {};
     },
   },
-  mounted() {
-    if (this.group.name === 'Learn GitLab') {
-      showLearnGitLabGroupItemPopover(this.group.id);
-    }
-  },
   methods: {
     onClickRowGroup(e) {
       const NO_EXPAND_CLS = 'no-expand';
@@ -179,7 +172,12 @@ export default {
         <div
           class="metadata align-items-md-center d-flex flex-grow-1 flex-shrink-0 flex-wrap justify-content-md-between"
         >
-          <item-actions v-if="isGroup" :group="group" :parent-group="parentGroup" />
+          <item-actions
+            v-if="isGroup"
+            :group="group"
+            :parent-group="parentGroup"
+            :action="action"
+          />
           <item-stats :item="group" class="group-stats gl-mt-2 d-none d-md-flex" />
         </div>
       </div>
diff --git a/app/assets/javascripts/groups/components/groups.vue b/app/assets/javascripts/groups/components/groups.vue
index c7713cbfafc..d407fdd2b90 100644
--- a/app/assets/javascripts/groups/components/groups.vue
+++ b/app/assets/javascripts/groups/components/groups.vue
@@ -1,7 +1,7 @@
 <script>
 import PaginationLinks from '~/vue_shared/components/pagination_links.vue';
-import eventHub from '../event_hub';
 import { getParameterByName } from '../../lib/utils/common_utils';
+import eventHub from '../event_hub';
 
 export default {
   components: {
diff --git a/app/assets/javascripts/groups/components/invite_members_banner.vue b/app/assets/javascripts/groups/components/invite_members_banner.vue
index da7adab1d86..81c5e3ce85d 100644
--- a/app/assets/javascripts/groups/components/invite_members_banner.vue
+++ b/app/assets/javascripts/groups/components/invite_members_banner.vue
@@ -1,7 +1,7 @@
 <script>
 import { GlBanner } from '@gitlab/ui';
-import { s__ } from '~/locale';
 import { parseBoolean, setCookie, getCookie } from '~/lib/utils/common_utils';
+import { s__ } from '~/locale';
 import Tracking from '~/tracking';
 
 const trackingMixin = Tracking.mixin();
diff --git a/app/assets/javascripts/groups/components/item_actions.vue b/app/assets/javascripts/groups/components/item_actions.vue
index ff52f5ef51c..df751a3f37e 100644
--- a/app/assets/javascripts/groups/components/item_actions.vue
+++ b/app/assets/javascripts/groups/components/item_actions.vue
@@ -1,7 +1,7 @@
 <script>
 import { GlTooltipDirective, GlButton, GlModalDirective } from '@gitlab/ui';
-import eventHub from '../event_hub';
 import { COMMON_STR } from '../constants';
+import eventHub from '../event_hub';
 
 export default {
   components: {
diff --git a/app/assets/javascripts/groups/groups_filterable_list.js b/app/assets/javascripts/groups/groups_filterable_list.js
index c33ad8b6ecb..cedf16cd7f1 100644
--- a/app/assets/javascripts/groups/groups_filterable_list.js
+++ b/app/assets/javascripts/groups/groups_filterable_list.js
@@ -1,7 +1,7 @@
 import $ from 'jquery';
 import FilterableList from '~/filterable_list';
-import eventHub from './event_hub';
 import { normalizeHeaders, getParameterByName } from '../lib/utils/common_utils';
+import eventHub from './event_hub';
 
 export default class GroupFilterableList extends FilterableList {
   constructor({
diff --git a/app/assets/javascripts/groups/index.js b/app/assets/javascripts/groups/index.js
index e11c3aaf984..c34810954a3 100644
--- a/app/assets/javascripts/groups/index.js
+++ b/app/assets/javascripts/groups/index.js
@@ -1,16 +1,16 @@
-import Vue from 'vue';
 import { GlToast } from '@gitlab/ui';
-import UserCallout from '~/user_callout';
+import Vue from 'vue';
 import { parseBoolean } from '~/lib/utils/common_utils';
+import UserCallout from '~/user_callout';
 import Translate from '../vue_shared/translate';
-import GroupFilterableList from './groups_filterable_list';
-import GroupsStore from './store/groups_store';
-import GroupsService from './service/groups_service';
 
 import groupsApp from './components/app.vue';
 import groupFolderComponent from './components/group_folder.vue';
 import groupItemComponent from './components/group_item.vue';
 import { GROUPS_LIST_HOLDER_CLASS, CONTENT_LIST_CLASS } from './constants';
+import GroupFilterableList from './groups_filterable_list';
+import GroupsService from './service/groups_service';
+import GroupsStore from './store/groups_store';
 
 Vue.use(Translate);
 
@@ -33,8 +33,8 @@ export default (containerId = 'js-groups-tree', endpoint, action = '') => {
     dataEl = containerEl.querySelector(CONTENT_LIST_CLASS);
   }
 
-  Vue.component('group-folder', groupFolderComponent);
-  Vue.component('group-item', groupItemComponent);
+  Vue.component('GroupFolder', groupFolderComponent);
+  Vue.component('GroupItem', groupItemComponent);
 
   Vue.use(GlToast);
 
diff --git a/app/assets/javascripts/groups/members/components/app.vue b/app/assets/javascripts/groups/members/components/app.vue
deleted file mode 100644
index 34a2c67fa9f..00000000000
--- a/app/assets/javascripts/groups/members/components/app.vue
+++ /dev/null
@@ -1,40 +0,0 @@
-<script>
-import { mapState, mapMutations } from 'vuex';
-import { GlAlert } from '@gitlab/ui';
-import MembersTable from '~/members/components/table/members_table.vue';
-import FilterSortContainer from '~/members/components/filter_sort/filter_sort_container.vue';
-import { scrollToElement } from '~/lib/utils/common_utils';
-import { HIDE_ERROR } from '~/members/store/mutation_types';
-
-export default {
-  name: 'GroupMembersApp',
-  components: { MembersTable, FilterSortContainer, GlAlert },
-  computed: {
-    ...mapState(['showError', 'errorMessage']),
-  },
-  watch: {
-    showError(value) {
-      if (value) {
-        this.$nextTick(() => {
-          scrollToElement(this.$refs.errorAlert.$el);
-        });
-      }
-    },
-  },
-  methods: {
-    ...mapMutations({
-      hideError: HIDE_ERROR,
-    }),
-  },
-};
-</script>
-
-<template>
-  <div>
-    <gl-alert v-if="showError" ref="errorAlert" variant="danger" @dismiss="hideError">{{
-      errorMessage
-    }}</gl-alert>
-    <filter-sort-container />
-    <members-table />
-  </div>
-</template>
diff --git a/app/assets/javascripts/groups/members/constants.js b/app/assets/javascripts/groups/members/constants.js
index 6d71b666d7a..3315712891d 100644
--- a/app/assets/javascripts/groups/members/constants.js
+++ b/app/assets/javascripts/groups/members/constants.js
@@ -1,5 +1 @@
 export const GROUP_MEMBER_BASE_PROPERTY_NAME = 'group_member';
-export const GROUP_MEMBER_ACCESS_LEVEL_PROPERTY_NAME = 'access_level';
-
-export const GROUP_LINK_BASE_PROPERTY_NAME = 'group_link';
-export const GROUP_LINK_ACCESS_LEVEL_PROPERTY_NAME = 'group_access';
diff --git a/app/assets/javascripts/groups/members/index.js b/app/assets/javascripts/groups/members/index.js
deleted file mode 100644
index 3ec874b8d36..00000000000
--- a/app/assets/javascripts/groups/members/index.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import Vue from 'vue';
-import Vuex from 'vuex';
-import { GlToast } from '@gitlab/ui';
-import { parseDataAttributes } from 'ee_else_ce/groups/members/utils';
-import App from './components/app.vue';
-import membersStore from '~/members/store';
-
-export const initGroupMembersApp = (
-  el,
-  {
-    tableFields = [],
-    tableAttrs = {},
-    tableSortableFields = [],
-    requestFormatter = () => {},
-    filteredSearchBar = { show: false },
-  },
-) => {
-  if (!el) {
-    return () => {};
-  }
-
-  Vue.use(Vuex);
-  Vue.use(GlToast);
-
-  const store = new Vuex.Store(
-    membersStore({
-      ...parseDataAttributes(el),
-      currentUserId: gon.current_user_id || null,
-      tableFields,
-      tableAttrs,
-      tableSortableFields,
-      requestFormatter,
-      filteredSearchBar,
-    }),
-  );
-
-  return new Vue({
-    el,
-    components: { App },
-    store,
-    render: (createElement) => createElement('app'),
-  });
-};
diff --git a/app/assets/javascripts/groups/members/utils.js b/app/assets/javascripts/groups/members/utils.js
index 4fcf348b69f..dc4eb7f4422 100644
--- a/app/assets/javascripts/groups/members/utils.js
+++ b/app/assets/javascripts/groups/members/utils.js
@@ -1,45 +1,8 @@
-import { isUndefined } from 'lodash';
-import { convertObjectPropsToCamelCase, parseBoolean } from '~/lib/utils/common_utils';
-import {
-  GROUP_MEMBER_BASE_PROPERTY_NAME,
-  GROUP_MEMBER_ACCESS_LEVEL_PROPERTY_NAME,
-  GROUP_LINK_BASE_PROPERTY_NAME,
-  GROUP_LINK_ACCESS_LEVEL_PROPERTY_NAME,
-} from './constants';
-
-export const parseDataAttributes = (el) => {
-  const { members, groupId, memberPath, canManageMembers } = el.dataset;
-
-  return {
-    members: convertObjectPropsToCamelCase(JSON.parse(members), { deep: true }),
-    sourceId: parseInt(groupId, 10),
-    memberPath,
-    canManageMembers: parseBoolean(canManageMembers),
-  };
-};
-
-const baseRequestFormatter = (basePropertyName, accessLevelPropertyName) => ({
-  accessLevel,
-  ...otherProperties
-}) => {
-  const accessLevelProperty = !isUndefined(accessLevel)
-    ? { [accessLevelPropertyName]: accessLevel }
-    : {};
+import { MEMBER_ACCESS_LEVEL_PROPERTY_NAME } from '~/members/constants';
+import { baseRequestFormatter } from '~/members/utils';
+import { GROUP_MEMBER_BASE_PROPERTY_NAME } from './constants';
 
-  return {
-    [basePropertyName]: {
-      ...accessLevelProperty,
-      ...otherProperties,
-    },
-  };
-};
-
-export const memberRequestFormatter = baseRequestFormatter(
+export const groupMemberRequestFormatter = baseRequestFormatter(
   GROUP_MEMBER_BASE_PROPERTY_NAME,
-  GROUP_MEMBER_ACCESS_LEVEL_PROPERTY_NAME,
-);
-
-export const groupLinkRequestFormatter = baseRequestFormatter(
-  GROUP_LINK_BASE_PROPERTY_NAME,
-  GROUP_LINK_ACCESS_LEVEL_PROPERTY_NAME,
+  MEMBER_ACCESS_LEVEL_PROPERTY_NAME,
 );
diff --git a/app/assets/javascripts/groups/transfer_dropdown.js b/app/assets/javascripts/groups/transfer_dropdown.js
index 59cc779d2ae..d6343f698c0 100644
--- a/app/assets/javascripts/groups/transfer_dropdown.js
+++ b/app/assets/javascripts/groups/transfer_dropdown.js
@@ -1,6 +1,6 @@
 import $ from 'jquery';
-import { __ } from '~/locale';
 import initDeprecatedJQueryDropdown from '~/deprecated_jquery_dropdown';
+import { __ } from '~/locale';
 
 export default class TransferDropdown {
   constructor() {