feat: show reason a song was added to queue, and fixed a few small bugs

backend/logic/actions/stations.js

@@ -1891,7 +1891,7 @@ export default {
 	 * @param youtubeId - the song id
 	 * @param cb
 	 */
-	addToQueue: isLoginRequired(async function addToQueue(session, stationId, youtubeId, cb) {
+	addToQueue: isLoginRequired(async function addToQueue(session, stationId, youtubeId, requestType, cb) {
 		async.waterfall(
 			[
 				next => {
@@ -1939,7 +1939,8 @@ export default {
 						{
 							stationId,
 							youtubeId,
-							requestUser: session.userId
+							requestUser: session.userId,
+							requestType
 						},
 						this
 					)

backend/logic/db/schemas/station.js

@@ -17,6 +17,7 @@ export default {
 		skipVotes: [{ type: String }],
 		requestedBy: { type: String },
 		requestedAt: { type: Date },
+		requestedType: { type: String, enum: ["manual", "autorequest", "autofill"] },
 		verified: { type: Boolean }
 	},
 	currentSongIndex: { type: Number, default: 0, required: true },
@@ -36,6 +37,7 @@ export default {
 			thumbnail: { type: String },
 			requestedBy: { type: String },
 			requestedAt: { type: Date },
+			requestedType: { type: String, enum: ["manual", "autorequest", "autofill"] },
 			verified: { type: Boolean }
 		}
 	],

backend/logic/stations.js

@@ -127,8 +127,12 @@ class _StationsModule extends CoreClass {
 		const stationModel = (this.stationModel = await DBModule.runJob("GET_MODEL", { modelName: "station" }));
 		const stationSchema = (this.stationSchema = await CacheModule.runJob("GET_SCHEMA", { schemaName: "station" }));
 
-		const stationHistoryModel = (this.stationHistoryModel = await DBModule.runJob("GET_MODEL", { modelName: "stationHistory" }));
+		const stationHistoryModel = (this.stationHistoryModel = await DBModule.runJob("GET_MODEL", {
-		const stationHistorySchema = (this.stationHistorySchema = await CacheModule.runJob("GET_SCHEMA", { schemaName: "stationHistory" }));
+			modelName: "stationHistory"
+		}));
+		const stationHistorySchema = (this.stationHistorySchema = await CacheModule.runJob("GET_SCHEMA", {
+			schemaName: "stationHistory"
+		}));
 
 		return new Promise((resolve, reject) => {
 			async.waterfall(
@@ -687,6 +691,7 @@ class _StationsModule extends CoreClass {
 						const newPlaylist = [...currentSongs, ...songsToAdd].map(song => {
 							if (!song._id) song._id = null;
 							if (!song.requestedAt) song.requestedAt = Date.now();
+							if (!song.requestedType) song.requestedType = "autofill";
 							return song;
 						});
 						next(null, newPlaylist, currentSongIndex);
@@ -774,6 +779,7 @@ class _StationsModule extends CoreClass {
 									verified,
 									requestedAt: queueSong.requestedAt,
 									requestedBy: queueSong.requestedBy,
+									requestedType: queueSong.requestedType,
 									likes: song.likes || 0,
 									dislikes: song.dislikes || 0
 								});
@@ -1115,6 +1121,7 @@ class _StationsModule extends CoreClass {
 								thumbnail: song.thumbnail,
 								requestedAt: song.requestedAt,
 								requestedBy: song.requestedBy,
+								requestedType: song.requestedType,
 								verified: song.verified
 							};
 						}
@@ -1888,11 +1895,12 @@ class _StationsModule extends CoreClass {
 	 * @param {string} payload.stationId - the station id
 	 * @param {string} payload.youtubeId - the youtube id
 	 * @param {string} payload.requestUser - the requesting user id
+	 * @param {string} payload.requestType - the request type
 	 * @returns {Promise} - returns a promise (resolve, reject)
 	 */
 	ADD_TO_QUEUE(payload) {
 		return new Promise((resolve, reject) => {
-			const { stationId, youtubeId, requestUser } = payload;
+			const { stationId, youtubeId, requestUser, requestType } = payload;
 			async.waterfall(
 				[
 					next => {
@@ -1973,6 +1981,7 @@ class _StationsModule extends CoreClass {
 					(song, station, next) => {
 						song.requestedBy = requestUser;
 						song.requestedAt = Date.now();
+						song.requestedType = requestType;
 						if (station.queue.length === 0) return next(null, song, station);
 						if (
 							requestUser &&

frontend/src/components/Queue.vue

@@ -168,6 +168,7 @@ defineEmits(["onChangeTab"]);
 						<song-item
 							:song="element"
 							:requested-by="true"
+							:requested-type="true"
 							:disabled-actions="[]"
 							:ref="el => (songItems[`song-item-${index}`] = el)"
 							:key="`queue-song-item-${element.youtubeId}`"
@@ -219,7 +220,7 @@ defineEmits(["onChangeTab"]);
 				There are no songs currently queued
 			</p>
 			<button
-				v-if="canRequest && sector === 'station'"
+				v-if="canRequest() && sector === 'station'"
 				class="floating button is-primary"
 				@click="$emit('onChangeTab', 'request')"
 			>

frontend/src/components/Request.vue

@@ -108,6 +108,7 @@ const addSongToQueue = (youtubeId: string, index?: number) => {
 		"stations.addToQueue",
 		station.value._id,
 		youtubeId,
+		"manual",
 		res => {
 			if (res.status !== "success") new Toast(`Error: ${res.message}`);
 			else {

frontend/src/components/SongItem.vue

@@ -23,6 +23,10 @@ const props = defineProps({
 		type: Boolean,
 		default: false
 	},
+	requestedType: {
+		type: Boolean,
+		default: false
+	},
 	duration: {
 		type: Boolean,
 		default: true
@@ -167,7 +171,10 @@ onUnmounted(() => {
 				>
 					{{ formatArtists() }}
 				</h5>
-				<p class="song-request-time" v-if="requestedBy">
+				<p
+					class="song-request-time"
+					v-if="requestedBy && !requestedType"
+				>
 					Requested by
 					<strong>
 						<user-link
@@ -180,6 +187,33 @@ onUnmounted(() => {
 						ago
 					</strong>
 				</p>
+				<p
+					class="song-request-time"
+					v-if="requestedBy && requestedType"
+				>
+					<template v-if="song.requestedType === 'automatic'">
+						Requested automaticaly
+						<strong>
+							{{ formatedRequestedAt }}
+							ago
+						</strong>
+					</template>
+					<template v-else>
+						<span v-if="song.requestedType === 'autorequest'"
+							>Autorequested</span
+						><span v-else>Requested</span> by
+						<strong>
+							<user-link
+								v-if="song.requestedBy"
+								:key="song.youtubeId"
+								:user-id="song.requestedBy"
+							/>
+							<span v-else>station</span>
+							{{ formatedRequestedAt }}
+							ago
+						</strong>
+					</template>
+				</p>
 			</div>
 		</div>
 

frontend/src/components/modals/EditPlaylist/index.vue

@@ -207,6 +207,7 @@ const addSongToQueue = youtubeId => {
 		"stations.addToQueue",
 		station.value._id,
 		youtubeId,
+		"manual",
 		data => {
 			if (data.status !== "success")
 				new Toast({

frontend/src/composables/useYoutubeDirect.ts

@@ -69,6 +69,7 @@ export const useYoutubeDirect = () => {
 				"stations.addToQueue",
 				stationId,
 				youtubeVideoId,
+				"manual",
 				res => {
 					if (res.status !== "success")
 						new Toast(`Error: ${res.message}`);

frontend/src/pages/Station/Sidebar/History.vue

@@ -74,6 +74,7 @@ const addSongToQueue = (youtubeId: string) => {
 		"stations.addToQueue",
 		station.value._id,
 		youtubeId,
+		"manual",
 		res => {
 			if (res.status !== "success") new Toast(`Error: ${res.message}`);
 			else {

frontend/src/pages/Station/index.vue

@@ -284,6 +284,7 @@ const autoRequestSong = () => {
 			"stations.addToQueue",
 			station.value._id,
 			youtubeId,
+			"autorequest",
 			data => {
 				updateAutoRequestLock(false);
 				if (data.status !== "success") {
@@ -2407,6 +2408,7 @@ onBeforeUnmount(() => {
 									:song="currentSong"
 									:duration="false"
 									:requested-by="true"
+									:requested-type="true"
 									header="Currently Playing.."
 								/>
 							</div>
@@ -2420,6 +2422,7 @@ onBeforeUnmount(() => {
 									:song="nextSong"
 									:duration="false"
 									:requested-by="true"
+									:requested-type="true"
 									header="Next Up.."
 								/>
 							</div>