diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-06-26 18:07:59 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-06-26 18:07:59 +0300 |
commit | c46e0d0c271a21b67a3412faf750d27dd63432bb (patch) | |
tree | 58d5ac8c94228c1c282f3ca3929eeb61b65c6c36 /app/assets/javascripts/issuable | |
parent | a46fed716c91d449fde2f08d25e0f4530170bc15 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/issuable')
4 files changed, 44 insertions, 33 deletions
diff --git a/app/assets/javascripts/issuable/components/status_box.vue b/app/assets/javascripts/issuable/components/status_box.vue index 799c0a18444..a83884dd261 100644 --- a/app/assets/javascripts/issuable/components/status_box.vue +++ b/app/assets/javascripts/issuable/components/status_box.vue @@ -4,7 +4,13 @@ import Vue from 'vue'; import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; import { fetchPolicies } from '~/lib/graphql'; import { __ } from '~/locale'; -import { STATUS_CLOSED, STATUS_OPEN, TYPE_ISSUE, TYPE_MERGE_REQUEST } from '~/issues/constants'; +import { + STATUS_CLOSED, + STATUS_OPEN, + TYPE_ISSUE, + TYPE_MERGE_REQUEST, + TYPE_EPIC, +} from '~/issues/constants'; export const badgeState = Vue.observable({ state: '', @@ -18,17 +24,22 @@ const CLASSES = { merged: 'issuable-status-badge-merged', }; -const ISSUE_ICONS = { - opened: 'issues', - locked: 'issues', - closed: 'issue-closed', -}; - -const MERGE_REQUEST_ICONS = { - opened: 'merge-request-open', - locked: 'merge-request-open', - closed: 'merge-request-close', - merged: 'merge', +const ICONS = { + [TYPE_EPIC]: { + opened: 'epic', + closed: 'epic-closed', + }, + [TYPE_ISSUE]: { + opened: 'issues', + locked: 'issues', + closed: 'issue-closed', + }, + [TYPE_MERGE_REQUEST]: { + opened: 'merge-request-open', + locked: 'merge-request-open', + closed: 'merge-request-close', + merged: 'merge', + }, }; const STATUS = { @@ -91,10 +102,8 @@ export default { return STATUS[this.state]; }, badgeIcon() { - if (this.issuableType === TYPE_ISSUE) { - return ISSUE_ICONS[this.state]; - } - return MERGE_REQUEST_ICONS[this.state]; + const type = this.issuableType || TYPE_MERGE_REQUEST; + return ICONS[type][this.state]; }, }, created() { diff --git a/app/assets/javascripts/issuable/popover/components/issue_popover.vue b/app/assets/javascripts/issuable/popover/components/issue_popover.vue index 55fb3958e82..044a1bba7ad 100644 --- a/app/assets/javascripts/issuable/popover/components/issue_popover.vue +++ b/app/assets/javascripts/issuable/popover/components/issue_popover.vue @@ -28,7 +28,7 @@ export default { type: HTMLAnchorElement, required: true, }, - projectPath: { + namespacePath: { type: String, required: true, }, @@ -65,10 +65,10 @@ export default { query, update: (data) => data.project.issue, variables() { - const { projectPath, iid } = this; + const { namespacePath, iid } = this; return { - projectPath, + projectPath: namespacePath, iid, }; }, @@ -100,7 +100,7 @@ export default { <!-- eslint-disable @gitlab/vue-require-i18n-strings --> <div> <work-item-type-icon v-if="!$apollo.queries.issue.loading" :work-item-type="issue.type" /> - <span class="gl-text-secondary">{{ `${projectPath}#${iid}` }}</span> + <span class="gl-text-secondary">{{ `${namespacePath}#${iid}` }}</span> </div> <!-- eslint-enable @gitlab/vue-require-i18n-strings --> diff --git a/app/assets/javascripts/issuable/popover/components/mr_popover.vue b/app/assets/javascripts/issuable/popover/components/mr_popover.vue index af93430963e..e2c2181684f 100644 --- a/app/assets/javascripts/issuable/popover/components/mr_popover.vue +++ b/app/assets/javascripts/issuable/popover/components/mr_popover.vue @@ -19,7 +19,7 @@ export default { type: HTMLAnchorElement, required: true, }, - projectPath: { + namespacePath: { type: String, required: true, }, @@ -76,10 +76,10 @@ export default { query, update: (data) => data.project.mergeRequest, variables() { - const { projectPath, iid } = this; + const { namespacePath, iid } = this; return { - projectPath, + projectPath: namespacePath, iid, }; }, @@ -108,7 +108,7 @@ export default { <h5 v-if="!$apollo.queries.mergeRequest.loading" class="my-2">{{ title }}</h5> <!-- eslint-disable @gitlab/vue-require-i18n-strings --> <div class="gl-text-secondary"> - {{ `${projectPath}!${iid}` }} + {{ `${namespacePath}!${iid}` }} </div> <!-- eslint-enable @gitlab/vue-require-i18n-strings --> </div> diff --git a/app/assets/javascripts/issuable/popover/index.js b/app/assets/javascripts/issuable/popover/index.js index 9430419685b..58f015fe40e 100644 --- a/app/assets/javascripts/issuable/popover/index.js +++ b/app/assets/javascripts/issuable/popover/index.js @@ -4,7 +4,7 @@ import createDefaultClient from '~/lib/graphql'; import IssuePopover from './components/issue_popover.vue'; import MRPopover from './components/mr_popover.vue'; -const componentsByReferenceType = { +export const componentsByReferenceTypeMap = { issue: IssuePopover, work_item: IssuePopover, merge_request: MRPopover, @@ -26,9 +26,10 @@ const popoverMountedAttr = 'data-popover-mounted'; * Adds a MergeRequestPopover component to the body, hands over as much data as the target element has in data attributes. * loads based on data-project-path and data-iid more data about an MR from the API and sets it on the popover */ -const handleIssuablePopoverMount = ({ +export const handleIssuablePopoverMount = ({ + componentsByReferenceType = componentsByReferenceTypeMap, apolloProvider, - projectPath, + namespacePath, title, iid, referenceType, @@ -42,7 +43,7 @@ const handleIssuablePopoverMount = ({ new PopoverComponent({ propsData: { target, - projectPath, + namespacePath, iid, cachedTitle: title, }, @@ -53,7 +54,7 @@ const handleIssuablePopoverMount = ({ }, 200); // 200ms delay so not every mouseover triggers Popover + API Call }; -export default (elements) => { +export default (elements, issuablePopoverMount = handleIssuablePopoverMount) => { if (elements.length > 0) { Vue.use(VueApollo); @@ -63,15 +64,16 @@ export default (elements) => { const listenerAddedAttr = 'data-popover-listener-added'; elements.forEach((el) => { - const { projectPath, iid, referenceType } = el.dataset; + const { projectPath, groupPath, iid, referenceType } = el.dataset; const title = el.dataset.mrTitle || el.title; + const namespacePath = groupPath || projectPath; - if (!el.getAttribute(listenerAddedAttr) && projectPath && title && iid && referenceType) { + if (!el.getAttribute(listenerAddedAttr) && namespacePath && title && iid && referenceType) { el.addEventListener('mouseenter', ({ target }) => { if (!el.getAttribute(popoverMountedAttr)) { - handleIssuablePopoverMount({ + issuablePopoverMount({ apolloProvider, - projectPath, + namespacePath, title, iid, referenceType, |