Automatically refetch timeline every 30sec

Signed-off-by: Louis Chemineau <louis@chmn.me>

1 files changed, 21 insertions, 2 deletions

diff --git a/src/components/TimelineList.vue b/src/components/TimelineList.vue
index 1cfebee8..daedd0e8 100644
--- a/src/components/TimelineList.vue
+++ b/src/components/TimelineList.vue
@@ -70,6 +70,7 @@ export default {
 		return {
 			infoHidden: false,
 			state: [],
+			intervalId: -1,
 			emptyContent: {
 				default: {
 					image: 'img/undraw/posts.svg',
@@ -141,8 +142,11 @@ export default {
 			return this.$store.getters.getTimeline
 		},
 	},
-	beforeMount() {
-
+	mounted() {
+		this.intervalId = setInterval(() => this.fetchNewStatuses(), 30 * 1000)
+	},
+	destroyed() {
+		clearInterval(this.intervalId)
 	},
 	methods: {
 		async infiniteHandler($state) {
@@ -159,6 +163,21 @@ export default {
 				$state.complete()
 			}
 		},
+		async fetchNewStatuses() {
+			try {
+				const response = await this.$store.dispatch('fetchTimeline', {
+					account: this.currentUser.uid,
+					min_id: this.timeline[0]?.id ?? undefined,
+				})
+
+				if (response.length > 0) {
+					this.fetchNewStatuses()
+				}
+			} catch (error) {
+				showError('Failed to load newer timeline entries')
+				logger.error('Failed to load newer timeline entries', { error })
+			}
+		},
 	},
 }
 </script>