diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-08-09 03:08:46 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-08-09 03:08:46 +0300 |
commit | 4596c2f5a5aef62aee84c24c26d9dc8db538ef3e (patch) | |
tree | c8d6979bc588b9f7c8553c9ed1603a550a9d46a2 /app/assets/javascripts/work_items/list | |
parent | 929b0ad5007d1b9a006b8b9b477f01702f9a780f (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/work_items/list')
3 files changed, 107 insertions, 5 deletions
diff --git a/app/assets/javascripts/work_items/list/components/work_items_list_app.vue b/app/assets/javascripts/work_items/list/components/work_items_list_app.vue index 4180d484357..fe7cb719bbb 100644 --- a/app/assets/javascripts/work_items/list/components/work_items_list_app.vue +++ b/app/assets/javascripts/work_items/list/components/work_items_list_app.vue @@ -1,8 +1,11 @@ <script> +import * as Sentry from '@sentry/browser'; import { STATUS_OPEN } from '~/issues/constants'; -import { __ } from '~/locale'; +import { __, s__ } from '~/locale'; import IssuableList from '~/vue_shared/issuable/list/components/issuable_list_root.vue'; import { issuableListTabs } from '~/vue_shared/issuable/list/constants'; +import { STATE_CLOSED } from '../../constants'; +import getWorkItemsQuery from '../queries/get_work_items.query.graphql'; export default { i18n: { @@ -12,26 +15,59 @@ export default { components: { IssuableList, }, + inject: ['fullPath'], data() { return { - issues: [], + error: undefined, searchTokens: [], sortOptions: [], state: STATUS_OPEN, + workItems: [], }; }, + apollo: { + workItems: { + query: getWorkItemsQuery, + variables() { + return { + fullPath: this.fullPath, + }; + }, + update(data) { + return data.group.workItems.nodes ?? []; + }, + error(error) { + this.error = s__( + 'WorkItem|Something went wrong when fetching work items. Please try again.', + ); + Sentry.captureException(error); + }, + }, + }, + methods: { + getStatus(issue) { + return issue.state === STATE_CLOSED ? __('Closed') : undefined; + }, + }, }; </script> <template> <issuable-list :current-tab="state" - :issuables="issues" + :error="error" + :issuables="workItems" namespace="work-items" recent-searches-storage-key="issues" :search-input-placeholder="$options.i18n.searchPlaceholder" :search-tokens="searchTokens" + show-work-item-type-icon :sort-options="sortOptions" :tabs="$options.issuableListTabs" - /> + @dismiss-alert="error = undefined" + > + <template #status="{ issuable }"> + {{ getStatus(issuable) }} + </template> + </issuable-list> </template> diff --git a/app/assets/javascripts/work_items/list/index.js b/app/assets/javascripts/work_items/list/index.js index 5b701893471..5cd38600779 100644 --- a/app/assets/javascripts/work_items/list/index.js +++ b/app/assets/javascripts/work_items/list/index.js @@ -1,5 +1,7 @@ import Vue from 'vue'; -import WorkItemsListApp from '~/work_items/list/components/work_items_list_app.vue'; +import VueApollo from 'vue-apollo'; +import createDefaultClient from '~/lib/graphql'; +import WorkItemsListApp from './components/work_items_list_app.vue'; export const mountWorkItemsListApp = () => { const el = document.querySelector('.js-work-items-list-root'); @@ -8,9 +10,17 @@ export const mountWorkItemsListApp = () => { return null; } + Vue.use(VueApollo); + return new Vue({ el, name: 'WorkItemsListRoot', + apolloProvider: new VueApollo({ + defaultClient: createDefaultClient(), + }), + provide: { + fullPath: el.dataset.fullPath, + }, render: (createComponent) => createComponent(WorkItemsListApp), }); }; diff --git a/app/assets/javascripts/work_items/list/queries/get_work_items.query.graphql b/app/assets/javascripts/work_items/list/queries/get_work_items.query.graphql new file mode 100644 index 00000000000..7ada2cf12dd --- /dev/null +++ b/app/assets/javascripts/work_items/list/queries/get_work_items.query.graphql @@ -0,0 +1,56 @@ +query getWorkItems($fullPath: ID!) { + group(fullPath: $fullPath) { + id + workItems { + nodes { + id + author { + id + avatarUrl + name + username + webUrl + } + closedAt + confidential + createdAt + iid + reference(full: true) + state + title + updatedAt + webUrl + widgets { + ... on WorkItemWidgetAssignees { + assignees { + nodes { + id + avatarUrl + name + username + webUrl + } + } + type + } + ... on WorkItemWidgetLabels { + allowsScopedLabels + labels { + nodes { + id + color + description + title + } + } + type + } + } + workItemType { + id + name + } + } + } + } +} |