error display

This commit is contained in:
Henry Jameson 2018-08-20 20:45:54 +03:00
parent f9b0a95969
commit b97db4912d
4 changed files with 28 additions and 2 deletions

View file

@ -14,6 +14,9 @@ const Notifications = {
notifications () {
return this.$store.state.statuses.notifications.data
},
error () {
return this.$store.state.statuses.notifications.error
},
unseenNotifications () {
return filter(this.notifications, ({seen}) => !seen)
},

View file

@ -4,6 +4,10 @@
// a bit of a hack to allow scrolling below notifications
padding-bottom: 15em;
.title {
display: inline-block;
}
.panel {
background: $fallback--bg;
background: var(--bg, $fallback--bg)
@ -22,6 +26,8 @@
background: var(--btn, $fallback--btn);
color: $fallback--fg;
color: var(--fg, $fallback--fg);
display: flex;
align-items: baseline;
.read-button {
position: absolute;
right: 0.7em;
@ -44,6 +50,19 @@
line-height: 1.3em;
}
.loadmore-error {
position: absolute;
right: 0.6em;
font-size: 14px;
min-width: 6em;
font-family: sans-serif;
text-align: center;
padding: 0 0.25em 0 0.25em;
margin: 0;
color: $fallback--fg;
color: var(--fg, $fallback--fg);
}
.unseen {
box-shadow: inset 4px 0 0 var(--cRed, $fallback--cRed);
padding-left: 0;

View file

@ -3,7 +3,10 @@
<div class="panel panel-default">
<div class="panel-heading">
<span class="unseen-count" v-if="unseenCount">{{unseenCount}}</span>
{{$t('notifications.notifications')}}
<div class="title"> {{$t('notifications.notifications')}}</div>
<div @click.prevent class="loadmore-error alert error" v-if="error">
{{$t('timeline.error_fetching')}}
</div>
<button v-if="unseenCount" @click.prevent="markAsSeen" class="read-button">{{$t('notifications.read')}}</button>
</div>
<div class="panel-body">

View file

@ -29,6 +29,7 @@ export const defaultState = {
maxSavedId: 0,
minId: Number.POSITIVE_INFINITY,
data: [],
error: false,
brokenFavorites: {}
},
favorites: new Set(),
@ -364,7 +365,7 @@ export const mutations = {
state.error = value
},
setNotificationsError (state, { value }) {
state.notificationsError = value
state.notifications.error = value
},
setNotificationsSilence (state, { value }) {
state.notifications.desktopNotificationSilence = value