diff options
Diffstat (limited to 'app/assets/javascripts/contribution_events/components/contribution_event')
4 files changed, 212 insertions, 0 deletions
diff --git a/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_closed.vue b/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_closed.vue new file mode 100644 index 00000000000..85c42ca5485 --- /dev/null +++ b/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_closed.vue @@ -0,0 +1,43 @@ +<script> +import { + EVENT_CLOSED_I18N, + TARGET_TYPE_MERGE_REQUEST, + EVENT_CLOSED_ICONS, +} from 'ee_else_ce/contribution_events/constants'; +import { getValueByEventTarget } from '../../utils'; +import ContributionEventBase from './contribution_event_base.vue'; + +export default { + name: 'ContributionEventClosed', + components: { ContributionEventBase }, + props: { + event: { + type: Object, + required: true, + }, + }, + computed: { + targetType() { + return this.event.target.type; + }, + message() { + return getValueByEventTarget(EVENT_CLOSED_I18N, this.event); + }, + iconName() { + return getValueByEventTarget(EVENT_CLOSED_ICONS, this.event); + }, + iconClass() { + return this.targetType === TARGET_TYPE_MERGE_REQUEST ? 'gl-text-red-500' : 'gl-text-blue-500'; + }, + }, +}; +</script> + +<template> + <contribution-event-base + :event="event" + :message="message" + :icon-name="iconName" + :icon-class="iconClass" + /> +</template> diff --git a/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_commented.vue b/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_commented.vue new file mode 100644 index 00000000000..ee433c17792 --- /dev/null +++ b/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_commented.vue @@ -0,0 +1,71 @@ +<script> +import { GlSprintf, GlLink } from '@gitlab/ui'; +import { + EVENT_COMMENTED_I18N, + EVENT_COMMENTED_SNIPPET_I18N, +} from 'ee_else_ce/contribution_events/constants'; +import { SNIPPET_NOTEABLE_TYPE, COMMIT_NOTEABLE_TYPE } from '~/notes/constants'; +import SafeHtml from '~/vue_shared/directives/safe_html'; +import ResourceParentLink from '../resource_parent_link.vue'; +import ContributionEventBase from './contribution_event_base.vue'; + +export default { + name: 'ContributionEventCommented', + components: { ContributionEventBase, GlSprintf, GlLink, ResourceParentLink }, + directives: { + SafeHtml, + }, + props: { + event: { + type: Object, + required: true, + }, + }, + computed: { + resourceParent() { + return this.event.resource_parent; + }, + noteable() { + return this.event.noteable; + }, + noteableType() { + return this.noteable.type; + }, + message() { + if (this.noteableType === SNIPPET_NOTEABLE_TYPE) { + return ( + EVENT_COMMENTED_SNIPPET_I18N[this.resourceParent?.type] || + EVENT_COMMENTED_SNIPPET_I18N.fallback + ); + } + + return EVENT_COMMENTED_I18N[this.noteableType] || EVENT_COMMENTED_I18N.fallback; + }, + noteableLinkClass() { + if (this.noteableType === COMMIT_NOTEABLE_TYPE) { + return ['gl-font-monospace']; + } + + return []; + }, + }, +}; +</script> + +<template> + <contribution-event-base :event="event" icon-name="comment" icon-class="gl-text-blue-600"> + <gl-sprintf :message="message"> + <template #noteableLink> + <gl-link :class="noteableLinkClass" :href="noteable.web_url">{{ + noteable.reference_link_text + }}</gl-link> + </template> + <template #resourceParentLink> + <resource-parent-link :event="event" /> + </template> + </gl-sprintf> + <template v-if="noteable.first_line_in_markdown" #additional-info> + <div v-safe-html="noteable.first_line_in_markdown" class="md"></div> + </template> + </contribution-event-base> +</template> diff --git a/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_created.vue b/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_created.vue new file mode 100644 index 00000000000..7915cd6679d --- /dev/null +++ b/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_created.vue @@ -0,0 +1,62 @@ +<script> +import { + EVENT_CREATED_I18N, + TARGET_TYPE_DESIGN, + TYPE_FALLBACK, +} from 'ee_else_ce/contribution_events/constants'; +import { getValueByEventTarget } from '../../utils'; +import ContributionEventBase from './contribution_event_base.vue'; + +export default { + name: 'ContributionEventCreated', + components: { ContributionEventBase }, + props: { + event: { + type: Object, + required: true, + }, + }, + computed: { + target() { + return this.event.target; + }, + resourceParent() { + return this.event.resource_parent; + }, + message() { + if (!this.target) { + return EVENT_CREATED_I18N[this.resourceParent.type] || EVENT_CREATED_I18N[TYPE_FALLBACK]; + } + + return getValueByEventTarget(EVENT_CREATED_I18N, this.event); + }, + iconName() { + switch (this.target?.type) { + case TARGET_TYPE_DESIGN: + return 'upload'; + + default: + return 'status_open'; + } + }, + iconClass() { + switch (this.target?.type) { + case TARGET_TYPE_DESIGN: + return null; + + default: + return 'gl-text-green-500'; + } + }, + }, +}; +</script> + +<template> + <contribution-event-base + :event="event" + :message="message" + :icon-name="iconName" + :icon-class="iconClass" + /> +</template> diff --git a/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_reopened.vue b/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_reopened.vue new file mode 100644 index 00000000000..36c65950238 --- /dev/null +++ b/app/assets/javascripts/contribution_events/components/contribution_event/contribution_event_reopened.vue @@ -0,0 +1,36 @@ +<script> +import { + EVENT_REOPENED_I18N, + EVENT_REOPENED_ICONS, +} from 'ee_else_ce/contribution_events/constants'; +import { getValueByEventTarget } from '../../utils'; +import ContributionEventBase from './contribution_event_base.vue'; + +export default { + name: 'ContributionEventReopened', + components: { ContributionEventBase }, + props: { + event: { + type: Object, + required: true, + }, + }, + computed: { + message() { + return getValueByEventTarget(EVENT_REOPENED_I18N, this.event); + }, + iconName() { + return getValueByEventTarget(EVENT_REOPENED_ICONS, this.event); + }, + }, +}; +</script> + +<template> + <contribution-event-base + :event="event" + :message="message" + :icon-name="iconName" + icon-class="gl-text-green-500" + /> +</template> |