diff options
Diffstat (limited to 'app/assets/javascripts/issuable_suggestions')
4 files changed, 0 insertions, 290 deletions
diff --git a/app/assets/javascripts/issuable_suggestions/components/app.vue b/app/assets/javascripts/issuable_suggestions/components/app.vue deleted file mode 100644 index 48a5e220abf..00000000000 --- a/app/assets/javascripts/issuable_suggestions/components/app.vue +++ /dev/null @@ -1,94 +0,0 @@ -<script> -import { GlTooltipDirective, GlIcon } from '@gitlab/ui'; -import { __ } from '~/locale'; -import query from '../queries/issues.query.graphql'; -import Suggestion from './item.vue'; - -export default { - components: { - Suggestion, - GlIcon, - }, - directives: { - GlTooltip: GlTooltipDirective, - }, - props: { - projectPath: { - type: String, - required: true, - }, - search: { - type: String, - required: true, - }, - }, - apollo: { - issues: { - query, - debounce: 1000, - skip() { - return this.isSearchEmpty; - }, - update: (data) => data.project.issues.edges.map(({ node }) => node), - variables() { - return { - fullPath: this.projectPath, - search: this.search, - }; - }, - }, - }, - data() { - return { - issues: [], - loading: 0, - }; - }, - computed: { - isSearchEmpty() { - return !this.search.length; - }, - showSuggestions() { - return !this.isSearchEmpty && this.issues.length && !this.loading; - }, - }, - watch: { - search() { - if (this.isSearchEmpty) { - this.issues = []; - } - }, - }, - helpText: __( - 'These existing issues have a similar title. It might be better to comment there instead of creating another similar issue.', - ), -}; -</script> - -<template> - <div v-show="showSuggestions" class="form-group row issuable-suggestions"> - <div v-once class="col-form-label col-sm-2 pt-0"> - {{ __('Similar issues') }} - <gl-icon - v-gl-tooltip.bottom - :title="$options.helpText" - :aria-label="$options.helpText" - name="question-o" - class="text-secondary gl-cursor-help" - /> - </div> - <div class="col-sm-10"> - <ul class="list-unstyled m-0"> - <li - v-for="(suggestion, index) in issues" - :key="suggestion.id" - :class="{ - 'gl-mb-3': index !== issues.length - 1, - }" - > - <suggestion :suggestion="suggestion" /> - </li> - </ul> - </div> - </div> -</template> diff --git a/app/assets/javascripts/issuable_suggestions/components/item.vue b/app/assets/javascripts/issuable_suggestions/components/item.vue deleted file mode 100644 index a01f4f747b9..00000000000 --- a/app/assets/javascripts/issuable_suggestions/components/item.vue +++ /dev/null @@ -1,132 +0,0 @@ -<script> -import { GlLink, GlTooltip, GlTooltipDirective, GlIcon } from '@gitlab/ui'; -import { uniqueId } from 'lodash'; -import { __ } from '~/locale'; -import TimeagoTooltip from '~/vue_shared/components/time_ago_tooltip.vue'; -import UserAvatarImage from '~/vue_shared/components/user_avatar/user_avatar_image.vue'; -import timeago from '~/vue_shared/mixins/timeago'; - -export default { - components: { - GlTooltip, - GlLink, - GlIcon, - UserAvatarImage, - TimeagoTooltip, - }, - directives: { - GlTooltip: GlTooltipDirective, - }, - mixins: [timeago], - props: { - suggestion: { - type: Object, - required: true, - }, - }, - computed: { - counts() { - return [ - { - id: uniqueId(), - icon: 'thumb-up', - tooltipTitle: __('Upvotes'), - count: this.suggestion.upvotes, - }, - { - id: uniqueId(), - icon: 'comment', - tooltipTitle: __('Comments'), - count: this.suggestion.userNotesCount, - }, - ].filter(({ count }) => count); - }, - isClosed() { - return this.suggestion.state === 'closed'; - }, - stateIconClass() { - return this.isClosed ? 'gl-text-blue-500' : 'gl-text-green-500'; - }, - stateIconName() { - return this.isClosed ? 'issue-close' : 'issue-open-m'; - }, - stateTitle() { - return this.isClosed ? __('Closed') : __('Opened'); - }, - closedOrCreatedDate() { - return this.suggestion.closedAt || this.suggestion.createdAt; - }, - hasUpdated() { - return this.suggestion.updatedAt !== this.suggestion.createdAt; - }, - }, -}; -</script> - -<template> - <div class="suggestion-item"> - <div class="d-flex align-items-center"> - <gl-icon - v-if="suggestion.confidential" - v-gl-tooltip.bottom - :title="__('Confidential')" - name="eye-slash" - class="gl-cursor-help gl-mr-2 gl-text-orange-500" - /> - <gl-link - :href="suggestion.webUrl" - target="_blank" - class="suggestion bold str-truncated-100 gl-text-gray-900!" - > - {{ suggestion.title }} - </gl-link> - </div> - <div class="text-secondary suggestion-footer"> - <gl-icon ref="state" :name="stateIconName" :class="stateIconClass" class="gl-cursor-help" /> - <gl-tooltip :target="() => $refs.state" placement="bottom"> - <span class="d-block"> - <span class="bold"> {{ stateTitle }} </span> {{ timeFormatted(closedOrCreatedDate) }} - </span> - <span class="text-tertiary">{{ tooltipTitle(closedOrCreatedDate) }}</span> - </gl-tooltip> - #{{ suggestion.iid }} • - <timeago-tooltip - :time="suggestion.createdAt" - tooltip-placement="bottom" - class="gl-cursor-help" - /> - {{ __('by') }} - <gl-link :href="suggestion.author.webUrl"> - <user-avatar-image - :img-src="suggestion.author.avatarUrl" - :size="16" - css-classes="mr-0 float-none" - tooltip-placement="bottom" - class="d-inline-block" - > - <span class="bold d-block">{{ __('Author') }}</span> {{ suggestion.author.name }} - <span class="text-tertiary">@{{ suggestion.author.username }}</span> - </user-avatar-image> - </gl-link> - <template v-if="hasUpdated"> - • {{ __('updated') }} - <timeago-tooltip - :time="suggestion.updatedAt" - tooltip-placement="bottom" - class="gl-cursor-help" - /> - </template> - <span class="suggestion-counts"> - <span - v-for="{ count, icon, tooltipTitle, id } in counts" - :key="id" - v-gl-tooltip.bottom - :title="tooltipTitle" - class="gl-cursor-help gl-ml-3 text-tertiary" - > - <gl-icon :name="icon" /> {{ count }} - </span> - </span> - </div> - </div> -</template> diff --git a/app/assets/javascripts/issuable_suggestions/index.js b/app/assets/javascripts/issuable_suggestions/index.js deleted file mode 100644 index 8f7f317d6b4..00000000000 --- a/app/assets/javascripts/issuable_suggestions/index.js +++ /dev/null @@ -1,38 +0,0 @@ -import Vue from 'vue'; -import VueApollo from 'vue-apollo'; -import createDefaultClient from '~/lib/graphql'; -import App from './components/app.vue'; - -Vue.use(VueApollo); - -export default function initIssuableSuggestions() { - const el = document.getElementById('js-suggestions'); - const issueTitle = document.getElementById('issue_title'); - const { projectPath } = el.dataset; - const apolloProvider = new VueApollo({ - defaultClient: createDefaultClient(), - }); - - return new Vue({ - el, - apolloProvider, - data() { - return { - search: issueTitle.value, - }; - }, - mounted() { - issueTitle.addEventListener('input', () => { - this.search = issueTitle.value; - }); - }, - render(h) { - return h(App, { - props: { - projectPath, - search: this.search, - }, - }); - }, - }); -} diff --git a/app/assets/javascripts/issuable_suggestions/queries/issues.query.graphql b/app/assets/javascripts/issuable_suggestions/queries/issues.query.graphql deleted file mode 100644 index 2384b381344..00000000000 --- a/app/assets/javascripts/issuable_suggestions/queries/issues.query.graphql +++ /dev/null @@ -1,26 +0,0 @@ -query issueSuggestion($fullPath: ID!, $search: String) { - project(fullPath: $fullPath) { - issues(search: $search, sort: updated_desc, first: 5) { - edges { - node { - iid - title - confidential - userNotesCount - upvotes - webUrl - state - closedAt - createdAt - updatedAt - author { - name - username - avatarUrl - webUrl - } - } - } - } - } -} |