diff options
Diffstat (limited to 'app/assets/javascripts/issuable_list/components')
3 files changed, 29 insertions, 21 deletions
diff --git a/app/assets/javascripts/issuable_list/components/issuable_item.vue b/app/assets/javascripts/issuable_list/components/issuable_item.vue index 583e5cb703d..39852eba71a 100644 --- a/app/assets/javascripts/issuable_list/components/issuable_item.vue +++ b/app/assets/javascripts/issuable_list/components/issuable_item.vue @@ -1,13 +1,13 @@ <script> import { GlLink, GlIcon, GlLabel, GlFormCheckbox, GlTooltipDirective } from '@gitlab/ui'; -import { __, sprintf } from '~/locale'; import { getIdFromGraphQLId } from '~/graphql_shared/utils'; -import { getTimeago } from '~/lib/utils/datetime_utility'; import { isScopedLabel } from '~/lib/utils/common_utils'; -import timeagoMixin from '~/vue_shared/mixins/timeago'; - +import { getTimeago } from '~/lib/utils/datetime_utility'; +import { isExternal, setUrlFragment } from '~/lib/utils/url_utility'; +import { __, sprintf } from '~/locale'; import IssuableAssignees from '~/vue_shared/components/issue/issue_assignees.vue'; +import timeagoMixin from '~/vue_shared/mixins/timeago'; export default { components: { @@ -48,17 +48,14 @@ export default { author() { return this.issuable.author; }, + webUrl() { + return this.issuable.gitlabWebUrl || this.issuable.webUrl; + }, authorId() { return getIdFromGraphQLId(`${this.author.id}`); }, isIssuableUrlExternal() { - // Check if URL is relative, which means it is internal. - if (!/^https?:\/\//g.test(this.issuable.webUrl)) { - return false; - } - // In case URL is absolute, it may or may not be internal, - // hence use `gon.gitlab_url` which is current instance domain. - return !this.issuable.webUrl.includes(gon.gitlab_url); + return isExternal(this.webUrl); }, labels() { return this.issuable.labels?.nodes || this.issuable.labels || []; @@ -92,6 +89,9 @@ export default { this.hasSlotContents('status') || this.showDiscussions || this.issuable.assignees, ); }, + issuableNotesLink() { + return setUrlFragment(this.webUrl, 'notes'); + }, }, methods: { hasSlotContents(slotName) { @@ -139,7 +139,13 @@ export default { <div class="issuable-main-info"> <div data-testid="issuable-title" class="issue-title title"> <span class="issue-title-text" dir="auto"> - <gl-link :href="issuable.webUrl" v-bind="issuableTitleProps" + <gl-icon + v-if="issuable.confidential" + v-gl-tooltip + name="eye-slash" + :title="__('Confidential')" + /> + <gl-link :href="webUrl" v-bind="issuableTitleProps" >{{ issuable.title }}<gl-icon v-if="isIssuableUrlExternal" name="external-link" class="gl-ml-2" /></gl-link> @@ -196,12 +202,12 @@ export default { <li v-if="showDiscussions" data-testid="issuable-discussions" - class="issuable-comments gl-display-none gl-display-sm-block" + class="issuable-comments gl-display-none gl-sm-display-block" > <gl-link v-gl-tooltip:tooltipcontainer.top :title="__('Comments')" - :href="`${issuable.webUrl}#notes`" + :href="issuableNotesLink" :class="{ 'no-comments': !issuable.userDiscussionsCount }" class="gl-reset-color!" > diff --git a/app/assets/javascripts/issuable_list/components/issuable_list_root.vue b/app/assets/javascripts/issuable_list/components/issuable_list_root.vue index c5475a34d3c..708e175cdb2 100644 --- a/app/assets/javascripts/issuable_list/components/issuable_list_root.vue +++ b/app/assets/javascripts/issuable_list/components/issuable_list_root.vue @@ -5,11 +5,10 @@ import { uniqueId } from 'lodash'; import { updateHistory, setUrlParams } from '~/lib/utils/url_utility'; import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue'; -import IssuableTabs from './issuable_tabs.vue'; -import IssuableItem from './issuable_item.vue'; -import IssuableBulkEditSidebar from './issuable_bulk_edit_sidebar.vue'; - import { DEFAULT_SKELETON_COUNT } from '../constants'; +import IssuableBulkEditSidebar from './issuable_bulk_edit_sidebar.vue'; +import IssuableItem from './issuable_item.vue'; +import IssuableTabs from './issuable_tabs.vue'; export default { components: { @@ -230,7 +229,7 @@ export default { :initial-sort-by="initialSortBy" :show-checkbox="showBulkEditSidebar" :checkbox-checked="allIssuablesChecked" - class="gl-flex-grow-1 row-content-block" + class="gl-flex-grow-1 gl-border-t-none row-content-block" @checked-input="handleAllIssuablesCheckedInput" @onFilter="$emit('filter', $event)" @onSort="$emit('sort', $event)" diff --git a/app/assets/javascripts/issuable_list/components/issuable_tabs.vue b/app/assets/javascripts/issuable_list/components/issuable_tabs.vue index d9aab004077..57da030e22e 100644 --- a/app/assets/javascripts/issuable_list/components/issuable_tabs.vue +++ b/app/assets/javascripts/issuable_list/components/issuable_tabs.vue @@ -32,7 +32,10 @@ export default { <template> <div class="top-area"> - <gl-tabs class="nav-links mobile-separator issuable-state-filters"> + <gl-tabs + class="gl-display-flex gl-flex-fill-1 gl-p-0 gl-m-0 mobile-separator issuable-state-filters" + nav-class="gl-border-b-0" + > <gl-tab v-for="tab in tabs" :key="tab.id" @@ -41,7 +44,7 @@ export default { > <template #title> <span :title="tab.titleTooltip">{{ tab.title }}</span> - <gl-badge v-if="tabCounts" variant="neutral" size="sm" class="gl-px-2 gl-py-1!">{{ + <gl-badge v-if="tabCounts" variant="neutral" size="sm" class="gl-tab-counter-badge">{{ tabCounts[tab.name] }}</gl-badge> </template> |