Add latest changes from gitlab-org/gitlab@14-9-stable-eev14.9.0-rc42

6 files changed, 191 insertions, 6 deletions

diff --git a/app/assets/javascripts/admin/applications/components/delete_application.vue b/app/assets/javascripts/admin/applications/components/delete_application.vue
new file mode 100644
index 00000000000..77694296b0a
--- /dev/null
+++ b/app/assets/javascripts/admin/applications/components/delete_application.vue
@@ -0,0 +1,84 @@
+<script>
+import { GlModal, GlSprintf } from '@gitlab/ui';
+import { __ } from '~/locale';
+import csrf from '~/lib/utils/csrf';
+
+export default {
+  components: {
+    GlModal,
+    GlSprintf,
+  },
+  data() {
+    return {
+      name: '',
+      path: '',
+      buttons: [],
+    };
+  },
+  mounted() {
+    this.buttons = document.querySelectorAll('.js-application-delete-button');
+
+    this.buttons.forEach((button) => button.addEventListener('click', this.buttonEvent));
+  },
+  destroy() {
+    this.buttons.forEach((button) => button.removeEventListener('click', this.buttonEvent));
+  },
+  methods: {
+    buttonEvent(e) {
+      e.preventDefault();
+      this.show(e.target.dataset);
+    },
+    show(dataset) {
+      const { name, path } = dataset;
+
+      this.name = name;
+      this.path = path;
+
+      this.$refs.deleteModal.show();
+    },
+    deleteApplication() {
+      this.$refs.deleteForm.submit();
+    },
+  },
+  i18n: {
+    destroy: __('Destroy'),
+    title: __('Confirm destroy application'),
+    body: __('Are you sure that you want to destroy %{application}'),
+  },
+  modal: {
+    actionPrimary: {
+      text: __('Destroy'),
+      attributes: {
+        variant: 'danger',
+      },
+    },
+    actionSecondary: {
+      text: __('Cancel'),
+      attributes: {
+        variant: 'default',
+      },
+    },
+  },
+  csrf,
+};
+</script>
+<template>
+  <gl-modal
+    ref="deleteModal"
+    :title="$options.i18n.title"
+    :action-primary="$options.modal.actionPrimary"
+    :action-secondary="$options.modal.actionSecondary"
+    modal-id="delete-application-modal"
+    size="sm"
+    @primary="deleteApplication"
+    ><gl-sprintf :message="$options.i18n.body">
+      <template #application>
+        <strong>{{ name }}</strong>
+      </template></gl-sprintf
+    >
+    <form ref="deleteForm" method="post" :action="path">
+      <input type="hidden" name="_method" value="delete" />
+      <input type="hidden" name="authenticity_token" :value="$options.csrf.token" />
+    </form>
+  </gl-modal>
+</template>
diff --git a/app/assets/javascripts/admin/applications/index.js b/app/assets/javascripts/admin/applications/index.js
new file mode 100644
index 00000000000..5875fd18729
--- /dev/null
+++ b/app/assets/javascripts/admin/applications/index.js
@@ -0,0 +1,15 @@
+import Vue from 'vue';
+import DeleteApplication from './components/delete_application.vue';
+
+export default () => {
+  const el = document.querySelector('.js-application-delete-modal');
+
+  if (!el) return false;
+
+  return new Vue({
+    el,
+    render(h) {
+      return h(DeleteApplication);
+    },
+  });
+};
diff --git a/app/assets/javascripts/admin/topics/components/remove_avatar.vue b/app/assets/javascripts/admin/topics/components/remove_avatar.vue
new file mode 100644
index 00000000000..5e94d6185e0
--- /dev/null
+++ b/app/assets/javascripts/admin/topics/components/remove_avatar.vue
@@ -0,0 +1,67 @@
+<script>
+import { uniqueId } from 'lodash';
+import { GlButton, GlModal, GlModalDirective } from '@gitlab/ui';
+import { __ } from '~/locale';
+import csrf from '~/lib/utils/csrf';
+
+export default {
+  components: {
+    GlButton,
+    GlModal,
+  },
+  directives: {
+    GlModal: GlModalDirective,
+  },
+  inject: ['path'],
+  data() {
+    return {
+      modalId: uniqueId('remove-topic-avatar-'),
+    };
+  },
+  methods: {
+    deleteApplication() {
+      this.$refs.deleteForm.submit();
+    },
+  },
+  i18n: {
+    remove: __('Remove avatar'),
+    title: __('Confirm remove avatar'),
+    body: __('Avatar will be removed. Are you sure?'),
+  },
+  modal: {
+    actionPrimary: {
+      text: __('Remove'),
+      attributes: {
+        variant: 'danger',
+      },
+    },
+    actionSecondary: {
+      text: __('Cancel'),
+      attributes: {
+        variant: 'default',
+      },
+    },
+  },
+  csrf,
+};
+</script>
+<template>
+  <div>
+    <gl-button v-gl-modal="modalId" variant="danger" category="secondary" class="gl-mt-2">{{
+      $options.i18n.remove
+    }}</gl-button>
+    <gl-modal
+      :title="$options.i18n.title"
+      :action-primary="$options.modal.actionPrimary"
+      :action-secondary="$options.modal.actionSecondary"
+      :modal-id="modalId"
+      size="sm"
+      @primary="deleteApplication"
+      >{{ $options.i18n.body }}
+      <form ref="deleteForm" method="post" :action="path">
+        <input type="hidden" name="_method" value="delete" />
+        <input type="hidden" name="authenticity_token" :value="$options.csrf.token" />
+      </form>
+    </gl-modal>
+  </div>
+</template>
diff --git a/app/assets/javascripts/admin/topics/index.js b/app/assets/javascripts/admin/topics/index.js
new file mode 100644
index 00000000000..8fbcadf3369
--- /dev/null
+++ b/app/assets/javascripts/admin/topics/index.js
@@ -0,0 +1,22 @@
+import Vue from 'vue';
+import RemoveAvatar from './components/remove_avatar.vue';
+
+export default () => {
+  const el = document.querySelector('.js-remove-topic-avatar');
+
+  if (!el) {
+    return false;
+  }
+
+  const { path } = el.dataset;
+
+  return new Vue({
+    el,
+    provide: {
+      path,
+    },
+    render(h) {
+      return h(RemoveAvatar);
+    },
+  });
+};
diff --git a/app/assets/javascripts/admin/users/components/user_actions.vue b/app/assets/javascripts/admin/users/components/user_actions.vue
index f5d21ece138..829174d7593 100644
--- a/app/assets/javascripts/admin/users/components/user_actions.vue
+++ b/app/assets/javascripts/admin/users/components/user_actions.vue
@@ -69,7 +69,6 @@ export default {
     editButtonAttrs() {
       return {
         'data-testid': 'edit',
-        icon: 'pencil-square',
         href: this.userPaths.edit,
       };
     },
@@ -101,6 +100,7 @@ export default {
       <gl-button
         v-else
         v-gl-tooltip="$options.i18n.edit"
+        icon="pencil-square"
         v-bind="editButtonAttrs"
         :aria-label="$options.i18n.edit"
       />
@@ -108,10 +108,9 @@ export default {
 
     <div v-if="hasDropdownActions" class="gl-p-2">
       <gl-dropdown
+        v-gl-tooltip="$options.i18n.userAdministration"
         data-testid="dropdown-toggle"
-        :text="$options.i18n.userAdministration"
-        :text-sr-only="!showButtonLabels"
-        icon="ellipsis_h"
+        icon="ellipsis_v"
         data-qa-selector="user_actions_dropdown_toggle"
         :data-qa-username="user.username"
         no-caret
diff --git a/app/assets/javascripts/admin/users/components/user_avatar.vue b/app/assets/javascripts/admin/users/components/user_avatar.vue
index ce22595609d..dd354794cf3 100644
--- a/app/assets/javascripts/admin/users/components/user_avatar.vue
+++ b/app/assets/javascripts/admin/users/components/user_avatar.vue
@@ -27,8 +27,6 @@ export default {
       return this.adminUserPath.replace('id', this.user.username);
     },
     adminUserMailto() {
-      // NOTE: 'mailto:' is a false positive: https://gitlab.com/gitlab-org/frontend/eslint-plugin-i18n/issues/26#possible-false-positives
-      // eslint-disable-next-line @gitlab/require-i18n-strings
       return `mailto:${this.user.email}`;
     },
     userNoteShort() {