Skip to content
Snippets Groups Projects

External issues list: Don't show empty state when error occurs

Merged External issues list: Don't show empty state when error occurs
338396-integrations-override-table-don-t-show-empty-state-when-error-occurs-2 into master
All threads resolved!
Merged Tom Quirk requested to merge 338396-integrations-override-table-don-t-show-empty-state-when-error-occurs-2 into master
All threads resolved!
Compare
and
Show latest version
2 files
+ 102
− 94
Compare changes
  • Side-by-side
  • Inline
Files
2
ee/app/assets/javascripts/external_issues_list/components/external_issues_list_root.vue
+ 72
− 66
<script>
import { GlButton, GlIcon, GlLink, GlSprintf, GlSafeHtmlDirective as SafeHtml } from '@gitlab/ui';
import {
GlButton,
GlIcon,
GlLink,
GlSprintf,
GlSafeHtmlDirective as SafeHtml,
GlAlert,
} from '@gitlab/ui';
import * as Sentry from '@sentry/browser';
import createFlash from '~/flash';
import IssuableList from '~/issuable_list/components/issuable_list_root.vue';
import {
IssuableStates,
@@ -30,6 +37,7 @@ export default {
GlIcon,
GlLink,
GlSprintf,
GlAlert,
IssuableList,
ExternalIssuesListEmptyState,
},
@@ -176,7 +184,7 @@ export default {
onExternalIssuesQueryError(error, message) {
this.errorMessage = message || error.message;
throw error;
Sentry.captureException(error);
},
onIssuableListClickTab(selectedIssueState) {
this.currentPage = 1;
@@ -224,67 +232,65 @@ export default {
</script>
<template>
<div>
<gl-alert v-if="errorMessage" :dismissible="false">
{{ errorMessage }}
</gl-alert>
<issuable-list
v-else
:namespace="projectFullPath"
:tabs="$options.IssuableListTabs"
:current-tab="currentState"
:search-input-placeholder="searchInputPlaceholderText"
:search-tokens="getFilteredSearchTokens()"
:sort-options="$options.AvailableSortOptions"
:initial-filter-value="getFilteredSearchValue()"
:initial-sort-by="sortedBy"
:issuables="issues"
:issuables-loading="issuesListLoading"
:show-pagination-controls="showPaginationControls"
:default-page-size="$options.defaultPageSize"
:total-items="totalIssues"
:current-page="currentPage"
:previous-page="currentPage - 1"
:next-page="currentPage + 1"
:url-params="urlParams"
label-filter-param="labels"
:recent-searches-storage-key="recentSearchesStorageKey"
@click-tab="onIssuableListClickTab"
@page-change="onIssuableListPageChange"
@sort="onIssuableListSort"
@filter="onIssuableListFilter"
>
<template #nav-actions>
<gl-button :href="issueCreateUrl" target="_blank" class="gl-my-5">
{{ createNewIssueText }}
<gl-icon name="external-link" />
</gl-button>
</template>
<template #reference="{ issuable }">
<span v-safe-html="externalIssuesLogo" class="svg-container logo-container"></span>
<span v-if="issuable">
{{ issuable.references ? issuable.references.relative : issuable.id }}
</span>
</template>
<template #author="{ author }">
<gl-sprintf :message="`%{authorName} in ${externalIssueTrackerName}`">
<template #authorName>
<gl-link class="author-link js-user-link" target="_blank" :href="author.webUrl">
{{ author.name }}
</gl-link>
</template>
</gl-sprintf>
</template>
<template #status="{ issuable }">
<template v-if="issuable"> {{ issuable.status }} </template>
</template>
<template #empty-state>
<external-issues-list-empty-state
:current-state="currentState"
:issues-count="issuesCount"
:has-filters-applied="hasFiltersApplied"
/>
</template>
</issuable-list>
</div>
<gl-alert v-if="errorMessage" class="gl-mt-3" variant="danger" :dismissible="false">
{{ errorMessage }}
</gl-alert>
<issuable-list
v-else
:namespace="projectFullPath"
:tabs="$options.IssuableListTabs"
:current-tab="currentState"
:search-input-placeholder="searchInputPlaceholderText"
:search-tokens="getFilteredSearchTokens()"
:sort-options="$options.AvailableSortOptions"
:initial-filter-value="getFilteredSearchValue()"
:initial-sort-by="sortedBy"
:issuables="issues"
:issuables-loading="issuesListLoading"
:show-pagination-controls="showPaginationControls"
:default-page-size="$options.defaultPageSize"
:total-items="totalIssues"
:current-page="currentPage"
:previous-page="currentPage - 1"
:next-page="currentPage + 1"
:url-params="urlParams"
label-filter-param="labels"
:recent-searches-storage-key="recentSearchesStorageKey"
@click-tab="onIssuableListClickTab"
@page-change="onIssuableListPageChange"
@sort="onIssuableListSort"
@filter="onIssuableListFilter"
>
<template #nav-actions>
<gl-button :href="issueCreateUrl" target="_blank" class="gl-my-5">
{{ createNewIssueText }}
<gl-icon name="external-link" />
</gl-button>
</template>
<template #reference="{ issuable }">
<span v-safe-html="externalIssuesLogo" class="svg-container logo-container"></span>
<span v-if="issuable">
{{ issuable.references ? issuable.references.relative : issuable.id }}
</span>
</template>
<template #author="{ author }">
<gl-sprintf :message="`%{authorName} in ${externalIssueTrackerName}`">
<template #authorName>
<gl-link class="author-link js-user-link" target="_blank" :href="author.webUrl">
{{ author.name }}
</gl-link>
</template>
</gl-sprintf>
</template>
<template #status="{ issuable }">
<template v-if="issuable"> {{ issuable.status }} </template>
</template>
<template #empty-state>
<external-issues-list-empty-state
:current-state="currentState"
:issues-count="issuesCount"
:has-filters-applied="hasFiltersApplied"
/>
</template>
</issuable-list>
</template>