feat: restore autorequest on stations if you come back within 5 minutes

frontend/src/components/PlaylistTabBase.vue

@@ -105,8 +105,12 @@ const { openModal } = useModalsStore();
 
 const { setPlaylists } = useUserPlaylistsStore();
 
-const { addPlaylistToAutoRequest, removePlaylistFromAutoRequest } =
-	stationStore;
+const {
+	addAutorequestPlaylists,
+	addPlaylistToAutoRequest,
+	removePlaylistFromAutoRequest,
+	updateAutorequestLocalStorage
+} = stationStore;
 
 const showTab = _tab => {
 	tabs.value[`${_tab}-tab`].scrollIntoView({ block: "nearest" });
@@ -295,6 +299,45 @@ onMounted(() => {
 				}
 			}
 		);
+
+		const autorequestLocalStorageItem = localStorage.getItem(
+			`autorequest-${station.value._id}`
+		);
+
+		if (autorequestLocalStorageItem) {
+			const autorequestParsedItem = JSON.parse(
+				autorequestLocalStorageItem
+			);
+			const autorequestUpdatedAt = new Date(
+				autorequestParsedItem.updatedAt
+			);
+			const fiveMinutesAgo = new Date(
+				new Date().getTime() - 5 * 60 * 1000
+			);
+			if (autorequestUpdatedAt > fiveMinutesAgo) {
+				const playlists = [];
+
+				const promises = autorequestParsedItem.playlistIds.map(
+					playlistId =>
+						new Promise<void>(resolve => {
+							socket.dispatch(
+								"playlists.getPlaylist",
+								playlistId,
+								res => {
+									if (res.status === "success") {
+										playlists.push(res.data.playlist);
+									}
+									resolve();
+								}
+							);
+						})
+				);
+
+				Promise.all(promises).then(() => {
+					addAutorequestPlaylists(playlists);
+				});
+			} else updateAutorequestLocalStorage();
+		}
 	});
 });
 </script>

frontend/src/pages/Station/index.vue

@@ -171,6 +171,7 @@ const {
 	updateOwnCurrentSongRatings,
 	updateCurrentSongSkipVotes,
 	updateAutoRequestLock,
+	updateAutorequestLocalStorage,
 	hasPermission,
 	addDj,
 	removeDj,
@@ -200,10 +201,13 @@ const autoRequestSong = () => {
 
 	if (autoRequestLock.value) return;
 	if (!allowAutorequest) return;
-	if (songsList.value.length >= 50) return;
+	if (autoRequest.value.length === 0) return;
+
+	updateAutorequestLocalStorage();
+
 	if (currentUserQueueSongs.value >= limit) return;
 	if (currentUserQueueSongs.value >= autorequestLimit) return;
-	if (autoRequest.value.length === 0) return;
+	if (songsList.value.length >= 50) return;
 
 	const uniqueYoutubeIds = new Set();
 
@@ -1544,6 +1548,15 @@ onBeforeUnmount(() => {
 
 	socket.dispatch("stations.leave", station.value._id, () => {});
 
+	const { allowAutorequest } = station.value.requests;
+
+	if (
+		!autoRequestLock.value &&
+		allowAutorequest &&
+		autoRequest.value.length > 0
+	)
+		updateAutorequestLocalStorage();
+
 	leaveStation();
 
 	// Delete the Pinia store that was created for this station, after all other cleanup tasks are performed

frontend/src/stores/station.ts

@@ -141,8 +141,15 @@ export const useStationStore = defineStore("station", {
 				this.currentSong.skipVotesCurrent = skipVotesCurrent;
 			this.currentSong.voted = voted;
 		},
+		addAutorequestPlaylists(playlists) {
+			playlists.forEach(playlist => {
+				this.autoRequest.push(playlist);
+			});
+			this.updateAutorequestLocalStorage();
+		},
 		addPlaylistToAutoRequest(playlist) {
 			this.autoRequest.push(playlist);
+			this.updateAutorequestLocalStorage();
 		},
 		removePlaylistFromAutoRequest(playlistId) {
 			this.autoRequest.forEach((playlist, index) => {
@@ -150,6 +157,16 @@ export const useStationStore = defineStore("station", {
 					this.autoRequest.splice(index, 1);
 				}
 			});
+			this.updateAutorequestLocalStorage();
+		},
+		updateAutorequestLocalStorage() {
+			const key = `autorequest-${this.station._id}`;
+			const playlistIds = this.autoRequest.map(playlist => playlist._id);
+			const value = {
+				updatedAt: new Date(),
+				playlistIds
+			};
+			localStorage.setItem(key, JSON.stringify(value));
 		},
 		updateMediaModalPlayingAudio(mediaModalPlayingAudio) {
 			this.mediaModalPlayingAudio = mediaModalPlayingAudio;