diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-07-18 21:10:24 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-07-18 21:10:24 +0300 |
commit | 7488eeff6fdf82ee7b926d684a201212b0509cbb (patch) | |
tree | c7565c44b5042ce711752a48293f38456c6c7ef1 /app/assets/javascripts/admin | |
parent | 93d0784e6d8f43ef5a27f506784b4b0d989c0c2b (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/admin')
3 files changed, 92 insertions, 3 deletions
diff --git a/app/assets/javascripts/admin/abuse_reports/components/abuse_category.vue b/app/assets/javascripts/admin/abuse_reports/components/abuse_category.vue new file mode 100644 index 00000000000..f05f96d6302 --- /dev/null +++ b/app/assets/javascripts/admin/abuse_reports/components/abuse_category.vue @@ -0,0 +1,33 @@ +<script> +import { GlLabel } from '@gitlab/ui'; +import { ABUSE_CATEGORIES } from '../constants'; + +export default { + name: 'AbuseCategory', + components: { + GlLabel, + }, + props: { + category: { + type: String, + required: true, + }, + }, + computed: { + categoryObject() { + return ABUSE_CATEGORIES[this.category]; + }, + }, +}; +</script> + +<template> + <gl-label + v-if="categoryObject" + size="sm" + :background-color="categoryObject.backgroundColor" + :title="categoryObject.title" + :target="null" + :class="`gl-text-${categoryObject.color}`" + /> +</template> diff --git a/app/assets/javascripts/admin/abuse_reports/components/abuse_report_row.vue b/app/assets/javascripts/admin/abuse_reports/components/abuse_report_row.vue index b8a4640de59..b229dd9e993 100644 --- a/app/assets/javascripts/admin/abuse_reports/components/abuse_report_row.vue +++ b/app/assets/javascripts/admin/abuse_reports/components/abuse_report_row.vue @@ -5,12 +5,14 @@ import { queryToObject } from '~/lib/utils/url_utility'; import { s__, __, sprintf } from '~/locale'; import ListItem from '~/vue_shared/components/registry/list_item.vue'; import { SORT_UPDATED_AT } from '../constants'; +import AbuseCategory from './abuse_category.vue'; export default { name: 'AbuseReportRow', components: { GlLink, ListItem, + AbuseCategory, }, props: { report: { @@ -44,13 +46,24 @@ export default { <template> <list-item data-testid="abuse-report-row"> <template #left-primary> - <gl-link :href="report.reportPath" class="gl-font-weight-normal gl-mb-2" data-testid="title"> + <gl-link + :href="report.reportPath" + class="gl-font-weight-normal gl-pt-4 gl-text-gray-900" + data-testid="abuse-report-title" + > {{ title }} </gl-link> </template> + <template #left-secondary> + <abuse-category + :category="report.category" + class="gl-mt-2 gl-mb-3" + data-testid="abuse-report-category" + /> + </template> <template #right-secondary> - <div data-testid="abuse-report-date">{{ displayDate }}</div> + <div class="gl-mt-7" data-testid="abuse-report-date">{{ displayDate }}</div> </template> </list-item> </template> diff --git a/app/assets/javascripts/admin/abuse_reports/constants.js b/app/assets/javascripts/admin/abuse_reports/constants.js index 9458aea299e..acb79293dfb 100644 --- a/app/assets/javascripts/admin/abuse_reports/constants.js +++ b/app/assets/javascripts/admin/abuse_reports/constants.js @@ -5,7 +5,7 @@ import { OPERATORS_IS, TOKEN_TITLE_STATUS, } from '~/vue_shared/components/filtered_search_bar/constants'; -import { __ } from '~/locale'; +import { s__, __ } from '~/locale'; const STATUS_OPTIONS = [ { value: 'closed', title: __('Closed') }, @@ -78,3 +78,46 @@ export const FILTERED_SEARCH_TOKENS = [ FILTERED_SEARCH_TOKEN_REPORTER, FILTERED_SEARCH_TOKEN_STATUS, ]; + +export const ABUSE_CATEGORIES = { + spam: { + backgroundColor: '#f5d9a8', + color: 'orange-700', + title: s__('AbuseReport|Spam'), + }, + offensive: { + backgroundColor: '#e1d8f9', + color: 'purple-700', + title: s__('AbuseReport|Offensive or Abusive'), + }, + phishing: { + backgroundColor: '#7c7ccc', + color: 'indigo-800', + title: s__('AbuseReport|Phishing'), + }, + crypto: { + backgroundColor: '#fdd4cd', + color: 'red-700', + title: s__('AbuseReport|Crypto Mining'), + }, + credentials: { + backgroundColor: '#cbe2f9', + color: 'blue-700', + title: s__('AbuseReport|Personal information or credentials'), + }, + copyright: { + backgroundColor: '#c3e6cd', + color: 'green-700', + title: s__('AbuseReport|Copyright or trademark violation'), + }, + malware: { + backgroundColor: '#fdd4cd', + color: 'red-700', + title: s__('AbuseReport|Malware'), + }, + other: { + backgroundColor: '#dcdcde', + color: 'gray-700', + title: s__('AbuseReport|Other'), + }, +}; |