diff --git a/src/renderer/components/TimelineSpace/Contents/Notifications.vue b/src/renderer/components/TimelineSpace/Contents/Notifications.vue index 7d9b80c0..ee38a023 100644 --- a/src/renderer/components/TimelineSpace/Contents/Notifications.vue +++ b/src/renderer/components/TimelineSpace/Contents/Notifications.vue @@ -12,6 +12,7 @@ :overlaid="modalOpened" @focusNext="focusNext" @focusPrev="focusPrev" + @focusRight="focusSidebar" @selectNotification="focusNotification(message)" > @@ -31,6 +32,7 @@ import { mapState, mapGetters } from 'vuex' import Notification from '~/src/renderer/components/molecules/Notification' import scrollTop from '../../utils/scroll' import reloadable from '~/src/renderer/components/mixins/reloadable' +import { Event } from '~/src/renderer/components/event' export default { name: 'notifications', @@ -71,12 +73,24 @@ export default { this.$store.commit('TimelineSpace/SideMenu/changeUnreadNotifications', false) this.$store.dispatch('TimelineSpace/Contents/Notifications/resetBadge') document.getElementById('scrollable').addEventListener('scroll', this.onScroll) + + Event.$on('focus-timeline', () => { + // If focusedId does not change, we have to refresh focusedId because Toot component watch change events. + const previousFocusedId = this.focusedId + this.focusedId = 0 + this.$nextTick(function () { + this.focusedId = previousFocusedId + }) + }) }, beforeUpdate () { if (this.$store.state.TimelineSpace.SideMenu.unreadNotifications) { this.$store.commit('TimelineSpace/SideMenu/changeUnreadNotifications', false) } }, + beforeDestroy () { + Event.$off('focus-timeline') + }, destroyed () { this.$store.commit('TimelineSpace/Contents/Notifications/changeHeading', true) this.$store.commit('TimelineSpace/Contents/Notifications/mergeNotifications') @@ -160,6 +174,9 @@ export default { focusNotification (notification) { this.focusedId = notification.id }, + focusSidebar () { + Event.$emit('focus-sidebar') + }, handleKey (event) { switch (event.srcKey) { case 'next': diff --git a/src/renderer/components/molecules/Notification.vue b/src/renderer/components/molecules/Notification.vue index 838acffb..6d862cf8 100644 --- a/src/renderer/components/molecules/Notification.vue +++ b/src/renderer/components/molecules/Notification.vue @@ -7,6 +7,7 @@ :overlaid="overlaid" @focusNext="$emit('focusNext')" @focusPrev="$emit('focusPrev')" + @focusRight="$emit('focusRight')" @select="$emit('selectNotification')" > @@ -26,6 +27,7 @@ :overlaid="overlaid" @focusNext="$emit('focusNext')" @focusPrev="$emit('focusPrev')" + @focusRight="$emit('focusRight')" @select="$emit('selectNotification')" > @@ -36,6 +38,7 @@ :overlaid="overlaid" @focusNext="$emit('focusNext')" @focusPrev="$emit('focusPrev')" + @focusRight="$emit('focusRight')" @select="$emit('selectNotification')" > diff --git a/src/renderer/components/molecules/Notification/Favourite.vue b/src/renderer/components/molecules/Notification/Favourite.vue index fb8b533b..d8573b0c 100644 --- a/src/renderer/components/molecules/Notification/Favourite.vue +++ b/src/renderer/components/molecules/Notification/Favourite.vue @@ -2,7 +2,7 @@