forked from AkkomaGang/akkoma-fe
fixes to timeline error handling
This commit is contained in:
parent
e6ca489d30
commit
d150dae5d1
7 changed files with 20 additions and 42 deletions
|
@ -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
|
||||||
|
|
|
@ -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"
|
||||||
|
|
|
@ -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'
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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",
|
||||||
|
|
|
@ -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(),
|
||||||
|
|
|
@ -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
|
||||||
|
|
|
@ -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 }) => {
|
||||||
|
|
Loading…
Reference in a new issue