fixes to timeline error handling

This commit is contained in:
Shpuld Shpuldson 2020-11-10 12:52:54 +02:00
parent e6ca489d30
commit d150dae5d1
7 changed files with 20 additions and 42 deletions

View file

@ -50,17 +50,10 @@ const Timeline = {
TimelineMenu TimelineMenu
}, },
computed: { computed: {
timelineError () {
return this.$store.state.statuses.error
},
errorData () {
return this.$store.state.statuses.errorData
},
newStatusCount () { newStatusCount () {
return this.timeline.newStatusCount return this.timeline.newStatusCount
}, },
showLoadButton () { showLoadButton () {
if (this.timelineError || this.errorData) return false
return this.timeline.newStatusCount > 0 || this.timeline.flushMarker !== 0 return this.timeline.newStatusCount > 0 || this.timeline.flushMarker !== 0
}, },
loadButtonString () { loadButtonString () {
@ -171,11 +164,12 @@ const Timeline = {
userId: this.userId, userId: this.userId,
tag: this.tag tag: this.tag
}).then(({ statuses }) => { }).then(({ statuses }) => {
store.commit('setLoading', { timeline: this.timelineName, value: false })
if (statuses && statuses.length === 0) { if (statuses && statuses.length === 0) {
this.bottomedOut = true this.bottomedOut = true
} }
}) }).finally(() =>
store.commit('setLoading', { timeline: this.timelineName, value: false })
)
}, 1000, this), }, 1000, this),
determineVisibleStatuses () { determineVisibleStatuses () {
if (!this.$refs.timeline) return if (!this.$refs.timeline) return

View file

@ -2,22 +2,8 @@
<div :class="[classes.root, 'Timeline']"> <div :class="[classes.root, 'Timeline']">
<div :class="classes.header"> <div :class="classes.header">
<TimelineMenu v-if="!embedded" /> <TimelineMenu v-if="!embedded" />
<div
v-if="timelineError"
class="loadmore-error alert error"
@click.prevent
>
{{ $t('timeline.error_fetching') }}
</div>
<div
v-else-if="errorData"
class="loadmore-error alert error"
@click.prevent
>
{{ errorData.statusText }}
</div>
<button <button
v-else-if="showLoadButton" v-if="showLoadButton"
class="loadmore-button" class="loadmore-button"
@click.prevent="showNewStatuses" @click.prevent="showNewStatuses"
> >
@ -76,18 +62,12 @@
{{ $t('timeline.no_more_statuses') }} {{ $t('timeline.no_more_statuses') }}
</div> </div>
<a <a
v-else-if="!timeline.loading && !errorData" v-else-if="!timeline.loading"
href="#" href="#"
@click.prevent="fetchOlderStatuses()" @click.prevent="fetchOlderStatuses()"
> >
<div class="new-status-notification text-center panel-footer">{{ $t('timeline.load_older') }}</div> <div class="new-status-notification text-center panel-footer">{{ $t('timeline.load_older') }}</div>
</a> </a>
<a
v-else-if="errorData"
href="#"
>
<div class="new-status-notification text-center panel-footer">{{ errorData.error }}</div>
</a>
<div <div
v-else v-else
class="new-status-notification text-center panel-footer" class="new-status-notification text-center panel-footer"

View file

@ -19,7 +19,7 @@ library.add(
faChevronDown faChevronDown
) )
// Route -> i18n key mapping, exported andnot in the computed // Route -> i18n key mapping, exported and not in the computed
// because nav panel benefits from the same information. // because nav panel benefits from the same information.
export const timelineNames = () => { export const timelineNames = () => {
return { return {
@ -27,8 +27,7 @@ export const timelineNames = () => {
'bookmarks': 'nav.bookmarks', 'bookmarks': 'nav.bookmarks',
'dms': 'nav.dms', 'dms': 'nav.dms',
'public-timeline': 'nav.public_tl', 'public-timeline': 'nav.public_tl',
'public-external-timeline': 'nav.twkn', 'public-external-timeline': 'nav.twkn'
'tag-timeline': 'tag'
} }
} }

View file

@ -634,7 +634,7 @@
"timeline": { "timeline": {
"collapse": "Collapse", "collapse": "Collapse",
"conversation": "Conversation", "conversation": "Conversation",
"error_fetching": "Error fetching updates", "error": "Error fetching timeline: {0}",
"load_older": "Load older statuses", "load_older": "Load older statuses",
"no_retweet_hint": "Post is marked as followers-only or direct and cannot be repeated", "no_retweet_hint": "Post is marked as followers-only or direct and cannot be repeated",
"repeated": "repeated", "repeated": "repeated",

View file

@ -50,8 +50,6 @@ export const defaultState = () => ({
maxId: 0, maxId: 0,
notifications: emptyNotifications(), notifications: emptyNotifications(),
favorites: new Set(), favorites: new Set(),
error: false,
errorData: null,
timelines: { timelines: {
mentions: emptyTl(), mentions: emptyTl(),
public: emptyTl(), public: emptyTl(),

View file

@ -560,7 +560,7 @@ const fetchTimeline = ({
}) })
.then((data) => data.json()) .then((data) => data.json())
.then((data) => { .then((data) => {
if (!data.error) { if (!data.errors) {
return { data: data.map(isNotifications ? parseNotification : parseStatus), pagination } return { data: data.map(isNotifications ? parseNotification : parseStatus), pagination }
} else { } else {
data.status = status data.status = status

View file

@ -52,9 +52,8 @@ const fetchAndUpdate = ({
return apiService.fetchTimeline(args) return apiService.fetchTimeline(args)
.then(response => { .then(response => {
if (response.error) { if (response.errors) {
store.dispatch('setErrorData', { value: response }) throw new Error(`${response.status} ${response.statusText}`)
return
} }
const { data: statuses, pagination } = response const { data: statuses, pagination } = response
@ -63,7 +62,15 @@ const fetchAndUpdate = ({
} }
update({ store, statuses, timeline, showImmediately, userId, pagination }) update({ store, statuses, timeline, showImmediately, userId, pagination })
return { statuses, pagination } return { statuses, pagination }
}, () => store.dispatch('setError', { value: true })) })
.catch((error) => {
store.dispatch('pushGlobalNotice', {
level: 'error',
messageKey: 'timeline.error',
messageArgs: [error.message],
timeout: 5000
})
})
} }
const startFetching = ({ timeline = 'friends', credentials, store, userId = false, tag = false }) => { const startFetching = ({ timeline = 'friends', credentials, store, userId = false, tag = false }) => {