fix: Auto eslint fixes

frontend/src/api/auth.ts

@@ -23,7 +23,7 @@ export default {
 								const date = new Date();
 								date.setTime(
 									new Date().getTime() +
-									2 * 365 * 24 * 60 * 60 * 1000
+										2 * 365 * 24 * 60 * 60 * 1000
 								);
 
 								const secure = cookie.secure
@@ -34,8 +34,9 @@ export default {
 								if (cookie.domain !== "localhost")
 									domain = ` domain=${cookie.domain};`;
 
-								document.cookie = `${cookie.SIDname}=${res.SID
-									}; expires=${date.toUTCString()}; ${domain}${secure}path=/`;
+								document.cookie = `${cookie.SIDname}=${
+									res.SID
+								}; expires=${date.toUTCString()}; ${domain}${secure}path=/`;
 
 								return resolve({
 									status: "success",
@@ -70,8 +71,9 @@ export default {
 						if (cookie.domain !== "localhost")
 							domain = ` domain=${cookie.domain};`;
 
-						document.cookie = `${cookie.SIDname}=${res.data.SID
-							}; expires=${date.toUTCString()}; ${domain}${secure}path=/`;
+						document.cookie = `${cookie.SIDname}=${
+							res.data.SID
+						}; expires=${date.toUTCString()}; ${domain}${secure}path=/`;
 
 						return resolve({ status: "success" });
 					});

frontend/src/classes/ListenerHandler.class.ts

@@ -1,7 +1,10 @@
 export default class ListenerHandler extends EventTarget {
 	listeners: {
-		[name: string]: Array<{ cb: (event: any) => void, options: { replaceable: boolean } }>
-	}
+		[name: string]: Array<{
+			cb: (event: any) => void;
+			options: { replaceable: boolean };
+		}>;
+	};
 
 	constructor() {
 		super();

frontend/src/composables/useDragBox.ts

@@ -26,7 +26,7 @@ export function useDragBox() {
 
 	const setOnDragBoxUpdate = newOnDragBoxUpdate => {
 		onDragBoxUpdate.value = newOnDragBoxUpdate;
-	}
+	};
 
 	const setInitialBox = (initial, reset = false) => {
 		dragBox.value.initial = initial || dragBox.value.initial;
@@ -123,8 +123,7 @@ export function useDragBox() {
 				dragBox.value.left === dragBox.value.latest.left
 			) {
 				resetBoxPosition();
-			}
-			else {
+			} else {
 				if (
 					dragBox.value.top >
 					document.body.clientHeight - dragBox.value.height
@@ -169,4 +168,4 @@ export function useDragBox() {
 		onWindowResizeDragBox,
 		setOnDragBoxUpdate
 	};
-};
+}

frontend/src/composables/useSearchMusare.ts

@@ -4,88 +4,96 @@ import { useStore } from "vuex";
 import Toast from "toasters";
 
 export function useSearchMusare() {
-    const store = useStore();
+	const store = useStore();
 
-    const musareSearch = ref({
-        query: "",
-        searchedQuery: "",
-        page: 0,
-        count: 0,
-        resultsLeft: 0,
-        results: [],
-        pageSize: 0
-    });
+	const musareSearch = ref({
+		query: "",
+		searchedQuery: "",
+		page: 0,
+		count: 0,
+		resultsLeft: 0,
+		results: [],
+		pageSize: 0
+	});
 
-    const resultsLeftCount = computed(() =>
-        musareSearch.value.count - musareSearch.value.results.length);
+	const resultsLeftCount = computed(
+		() => musareSearch.value.count - musareSearch.value.results.length
+	);
 
-    const nextPageResultsCount = computed(() =>
-        Math.min(musareSearch.value.pageSize, resultsLeftCount.value));
+	const nextPageResultsCount = computed(() =>
+		Math.min(musareSearch.value.pageSize, resultsLeftCount.value)
+	);
 
-    const { socket } = store.state.websockets;
+	const { socket } = store.state.websockets;
 
-    const searchForMusareSongs = (page, toast = true) => {
-        if (
-            musareSearch.value.page >= page ||
-            musareSearch.value.searchedQuery !== musareSearch.value.query
-        ) {
-            musareSearch.value.results = [];
-            musareSearch.value.page = 0;
-            musareSearch.value.count = 0;
-            musareSearch.value.resultsLeft = 0;
-            musareSearch.value.pageSize = 0;
-        }
+	const searchForMusareSongs = (page, toast = true) => {
+		if (
+			musareSearch.value.page >= page ||
+			musareSearch.value.searchedQuery !== musareSearch.value.query
+		) {
+			musareSearch.value.results = [];
+			musareSearch.value.page = 0;
+			musareSearch.value.count = 0;
+			musareSearch.value.resultsLeft = 0;
+			musareSearch.value.pageSize = 0;
+		}
 
-        musareSearch.value.searchedQuery = musareSearch.value.query;
-        socket.dispatch(
-            "songs.searchOfficial",
-            musareSearch.value.query,
-            page,
-            res => {
-                if (res.status === "success") {
-                    const { data } = res;
-                    const { count, pageSize, songs } = data;
+		musareSearch.value.searchedQuery = musareSearch.value.query;
+		socket.dispatch(
+			"songs.searchOfficial",
+			musareSearch.value.query,
+			page,
+			res => {
+				if (res.status === "success") {
+					const { data } = res;
+					const { count, pageSize, songs } = data;
 
-                    const newSongs = songs.map(song => ({
-                        isAddedToQueue: false,
-                        ...song
-                    }));
+					const newSongs = songs.map(song => ({
+						isAddedToQueue: false,
+						...song
+					}));
 
-                    musareSearch.value.results = [
-                        ...musareSearch.value.results,
-                        ...newSongs
-                    ];
-                    musareSearch.value.page = page;
-                    musareSearch.value.count = count;
-                    musareSearch.value.resultsLeft =
-                        count - musareSearch.value.results.length;
-                    musareSearch.value.pageSize = pageSize;
-                } else if (res.status === "error") {
-                    musareSearch.value.results = [];
-                    musareSearch.value.page = 0;
-                    musareSearch.value.count = 0;
-                    musareSearch.value.resultsLeft = 0;
-                    musareSearch.value.pageSize = 0;
-                    if (toast) new Toast(res.message);
-                }
-            }
-        );
-    }
+					musareSearch.value.results = [
+						...musareSearch.value.results,
+						...newSongs
+					];
+					musareSearch.value.page = page;
+					musareSearch.value.count = count;
+					musareSearch.value.resultsLeft =
+						count - musareSearch.value.results.length;
+					musareSearch.value.pageSize = pageSize;
+				} else if (res.status === "error") {
+					musareSearch.value.results = [];
+					musareSearch.value.page = 0;
+					musareSearch.value.count = 0;
+					musareSearch.value.resultsLeft = 0;
+					musareSearch.value.pageSize = 0;
+					if (toast) new Toast(res.message);
+				}
+			}
+		);
+	};
 
-    const addMusareSongToPlaylist = (id, index) => {
-        return new Error("Not done yet.");
-        socket.dispatch(
-            "playlists.addSongToPlaylist",
-            false,
-            id,
-            this.playlist._id,
-            res => {
-                new Toast(res.message);
-                if (res.status === "success")
-                    musareSearch.value.results[index].isAddedToQueue = true;
-            }
-        );
-    }
+	const addMusareSongToPlaylist = (id, index) => {
+		return new Error("Not done yet.");
+		socket.dispatch(
+			"playlists.addSongToPlaylist",
+			false,
+			id,
+			this.playlist._id,
+			res => {
+				new Toast(res.message);
+				if (res.status === "success")
+					musareSearch.value.results[index].isAddedToQueue = true;
+			}
+		);
+	};
 
-    return { musareSearch, resultsLeftCount, nextPageResultsCount, searchForMusareSongs, addMusareSongToPlaylist };
-}
+	return {
+		musareSearch,
+		resultsLeftCount,
+		nextPageResultsCount,
+		searchForMusareSongs,
+		addMusareSongToPlaylist
+	};
+}

frontend/src/composables/useSearchYoutube.ts

@@ -4,100 +4,103 @@ import { useStore } from "vuex";
 import Toast from "toasters";
 
 export function useSearchYoutube() {
-    const store = useStore();
+	const store = useStore();
 
-    const youtubeSearch = ref({
-        songs: {
-            results: [],
-            query: "",
-            nextPageToken: ""
-        },
-        playlist: {
-            query: "",
-            isImportingOnlyMusic: true
-        }
-    });
+	const youtubeSearch = ref({
+		songs: {
+			results: [],
+			query: "",
+			nextPageToken: ""
+		},
+		playlist: {
+			query: "",
+			isImportingOnlyMusic: true
+		}
+	});
 
-    const { socket } = store.state.websockets;
+	const { socket } = store.state.websockets;
 
-    const searchForSongs = () => {
-        let { query } = youtubeSearch.value.songs;
+	const searchForSongs = () => {
+		let { query } = youtubeSearch.value.songs;
 
-        if (query.indexOf("&index=") !== -1) {
-            query = query.split("&index=");
-            query.pop();
-            query = query.join("");
-        }
+		if (query.indexOf("&index=") !== -1) {
+			query = query.split("&index=");
+			query.pop();
+			query = query.join("");
+		}
 
-        if (query.indexOf("&list=") !== -1) {
-            query = query.split("&list=");
-            query.pop();
-            query = query.join("");
-        }
+		if (query.indexOf("&list=") !== -1) {
+			query = query.split("&list=");
+			query.pop();
+			query = query.join("");
+		}
 
-        socket.dispatch("apis.searchYoutube", query, res => {
-            if (res.status === "success") {
-                youtubeSearch.value.songs.nextPageToken =
-                    res.data.nextPageToken;
-                youtubeSearch.value.songs.results = [];
+		socket.dispatch("apis.searchYoutube", query, res => {
+			if (res.status === "success") {
+				youtubeSearch.value.songs.nextPageToken =
+					res.data.nextPageToken;
+				youtubeSearch.value.songs.results = [];
 
-                res.data.items.forEach(result => {
-                    youtubeSearch.value.songs.results.push({
-                        id: result.id.videoId,
-                        url: `https://www.youtube.com/watch?v=${result.id.videoId}`,
-                        title: result.snippet.title,
-                        thumbnail: result.snippet.thumbnails.default.url,
-                        channelId: result.snippet.channelId,
-                        channelTitle: result.snippet.channelTitle,
-                        isAddedToQueue: false
-                    });
-                });
-            } else if (res.status === "error") new Toast(res.message);
-        });
-    }
+				res.data.items.forEach(result => {
+					youtubeSearch.value.songs.results.push({
+						id: result.id.videoId,
+						url: `https://www.youtube.com/watch?v=${result.id.videoId}`,
+						title: result.snippet.title,
+						thumbnail: result.snippet.thumbnails.default.url,
+						channelId: result.snippet.channelId,
+						channelTitle: result.snippet.channelTitle,
+						isAddedToQueue: false
+					});
+				});
+			} else if (res.status === "error") new Toast(res.message);
+		});
+	};
 
-    const loadMoreSongs = () => {
-        socket.dispatch(
-            "apis.searchYoutubeForPage",
-            youtubeSearch.value.songs.query,
-            youtubeSearch.value.songs.nextPageToken,
-            res => {
-                if (res.status === "success") {
-                    youtubeSearch.value.songs.nextPageToken =
-                        res.data.nextPageToken;
+	const loadMoreSongs = () => {
+		socket.dispatch(
+			"apis.searchYoutubeForPage",
+			youtubeSearch.value.songs.query,
+			youtubeSearch.value.songs.nextPageToken,
+			res => {
+				if (res.status === "success") {
+					youtubeSearch.value.songs.nextPageToken =
+						res.data.nextPageToken;
 
-                    res.data.items.forEach(result => {
-                        youtubeSearch.value.songs.results.push({
-                            id: result.id.videoId,
-                            url: `https://www.youtube.com/watch?v=${result.id.videoId}`,
-                            title: result.snippet.title,
-                            thumbnail:
-                                result.snippet.thumbnails.default.url,
-                            channelId: result.snippet.channelId,
-                            channelTitle: result.snippet.channelTitle,
-                            isAddedToQueue: false
-                        });
-                    });
-                } else if (res.status === "error") new Toast(res.message);
-            }
-        );
-    }
+					res.data.items.forEach(result => {
+						youtubeSearch.value.songs.results.push({
+							id: result.id.videoId,
+							url: `https://www.youtube.com/watch?v=${result.id.videoId}`,
+							title: result.snippet.title,
+							thumbnail: result.snippet.thumbnails.default.url,
+							channelId: result.snippet.channelId,
+							channelTitle: result.snippet.channelTitle,
+							isAddedToQueue: false
+						});
+					});
+				} else if (res.status === "error") new Toast(res.message);
+			}
+		);
+	};
 
-    const addYouTubeSongToPlaylist = (id, index) => {
-        socket.dispatch(
-            "playlists.addSongToPlaylist",
-            false,
-            id,
-            this.playlist._id,
-            res => {
-                new Toast(res.message);
-                if (res.status === "success")
-                    youtubeSearch.value.songs.results[
-                        index
-                    ].isAddedToQueue = true;
-            }
-        );
-    }
+	const addYouTubeSongToPlaylist = (id, index) => {
+		socket.dispatch(
+			"playlists.addSongToPlaylist",
+			false,
+			id,
+			this.playlist._id,
+			res => {
+				new Toast(res.message);
+				if (res.status === "success")
+					youtubeSearch.value.songs.results[index].isAddedToQueue =
+						true;
+			}
+		);
+	};
 
-    return { youtubeSearch, searchForSongs, loadMoreSongs, addYouTubeSongToPlaylist };
-}
+	return {
+		youtubeSearch,
+		searchForSongs,
+		loadMoreSongs,
+		addYouTubeSongToPlaylist
+	};
+}

frontend/src/composables/useSortablePlaylists.ts

@@ -5,53 +5,48 @@ import Toast from "toasters";
 import ws from "@/ws";
 
 export function useSortablePlaylists() {
-    const orderOfPlaylists = ref([]);
-    const drag = ref(false);
-    const userId = ref();
-
-    const store = useStore();
-
-    const playlists = computed({
-        get: () => {
-            return store.state.user.playlists.playlists;
-        },
-        set: (playlists) => {
-            store.commit("user/playlists/updatePlaylists", playlists);
-        }
-    });
-    const myUserId = computed(() => store.state.user.auth.userId);
-    const isCurrentUser = computed(() => userId.value === myUserId.value);
-	const dragOptions = computed(() => ({
-        animation: 200,
-        group: "playlists",
-        disabled: !isCurrentUser.value,
-        ghostClass: "draggable-list-ghost"
-    }));
-
-    const { socket } = store.state.websockets;
-
-    const setPlaylists = playlists => store.dispatch("user/playlists/setPlaylists", playlists);
-    const addPlaylist = playlist => store.dispatch("user/playlists/addPlaylist", playlist);
-    const removePlaylist = playlist => store.dispatch("user/playlists/removePlaylist", playlist);
-
-    const calculatePlaylistOrder = () => {
-        const calculatedOrder = [];
-        playlists.value.forEach(playlist =>
-            calculatedOrder.push(playlist._id)
-        );
+	const orderOfPlaylists = ref([]);
+	const drag = ref(false);
+	const userId = ref();
 
-        return calculatedOrder;
-    };
+	const store = useStore();
 
-    const savePlaylistOrder = ({ oldIndex, newIndex }) => {
-        if (oldIndex === newIndex) return;
+	const playlists = computed({
+		get: () => store.state.user.playlists.playlists,
+		set: playlists => {
+			store.commit("user/playlists/updatePlaylists", playlists);
+		}
+	});
+	const myUserId = computed(() => store.state.user.auth.userId);
+	const isCurrentUser = computed(() => userId.value === myUserId.value);
+	const dragOptions = computed(() => ({
+		animation: 200,
+		group: "playlists",
+		disabled: !isCurrentUser.value,
+		ghostClass: "draggable-list-ghost"
+	}));
+
+	const { socket } = store.state.websockets;
+
+	const setPlaylists = playlists =>
+		store.dispatch("user/playlists/setPlaylists", playlists);
+	const addPlaylist = playlist =>
+		store.dispatch("user/playlists/addPlaylist", playlist);
+	const removePlaylist = playlist =>
+		store.dispatch("user/playlists/removePlaylist", playlist);
+
+	const calculatePlaylistOrder = () => {
+		const calculatedOrder = [];
+		playlists.value.forEach(playlist => calculatedOrder.push(playlist._id));
+
+		return calculatedOrder;
+	};
+
+	const savePlaylistOrder = ({ oldIndex, newIndex }) => {
+		if (oldIndex === newIndex) return;
 		const oldPlaylists = playlists.value;
 
-		oldPlaylists.splice(
-			newIndex,
-			0,
-			oldPlaylists.splice(oldIndex, 1)[0]
-		);
+		oldPlaylists.splice(newIndex, 0, oldPlaylists.splice(oldIndex, 1)[0]);
 
 		setPlaylists(oldPlaylists).then(() => {
 			const recalculatedOrder = calculatePlaylistOrder();
@@ -67,9 +62,9 @@ export function useSortablePlaylists() {
 				}
 			);
 		});
-    };
+	};
 
-    onMounted(async () => {
+	onMounted(async () => {
 		await nextTick();
 
 		if (!userId.value) userId.value = myUserId.value;
@@ -194,13 +189,13 @@ export function useSortablePlaylists() {
 			);
 	});
 
-    return {
+	return {
 		Sortable,
-        drag,
-        userId,
-        isCurrentUser,
-        playlists,
-        dragOptions,
-        savePlaylistOrder
-    };
-};
+		drag,
+		userId,
+		isCurrentUser,
+		playlists,
+		dragOptions,
+		savePlaylistOrder
+	};
+}

frontend/src/pages/Profile/Tabs/Playlists.vue

@@ -49,7 +49,7 @@ onMounted(() => {
 
 			<hr class="section-horizontal-rule" />
 
-			<Sortable
+			<sortable
 				:component-data="{
 					name: !drag ? 'draggable-list-transition' : null
 				}"
@@ -104,7 +104,7 @@ onMounted(() => {
 						</template>
 					</playlist-item>
 				</template>
-			</Sortable>
+			</sortable>
 
 			<button
 				v-if="isCurrentUser"

frontend/src/types/global.d.ts

@@ -1,6 +1,6 @@
 declare global {
-    var lofig: any;
-    var stationInterval: number;
+	var lofig: any;
+	var stationInterval: number;
 }
 
-export { };
+export {};

frontend/src/utils.ts

@@ -4,8 +4,8 @@ export default {
 			.map(b =>
 				b
 					? Math.floor((1 + Math.random()) * 0x10000)
-						.toString(16)
-						.substring(1)
+							.toString(16)
+							.substring(1)
 					: "-"
 			)
 			.join("");

frontend/src/vuex_helpers.ts

@@ -6,41 +6,43 @@ const mapModalState = (namespace, map) => {
 	const modalState = {};
 	// console.log("MAP MODAL STATE", namespace);
 
-	Object.entries(map).forEach(([mapKey, mapValue]: [string, (value: object) => void]) => {
-		modalState[mapKey] = function func() {
-			// console.log(
-			// 	321,
-			// 	namespace
-			// 		.replace(
-			// 			"MODAL_MODULE_PATH",
-			// 			namespace.indexOf("MODAL_MODULE_PATH") !== -1
-			// 				? this.modalModulePath
-			// 				: null
-			// 		)
-			// 		.replace("MODAL_UUID", this.modalUuid)
-			// 		.split("/")
-			// );
-			// console.log(3211, mapKey);
-
-			const state = namespace
-				.replace(
-					"MODAL_MODULE_PATH",
-					namespace.indexOf("MODAL_MODULE_PATH") !== -1
-						? this.modalModulePath
-						: null
-				)
-				.replace("MODAL_UUID", this.modalUuid)
-				.split("/")
-				.reduce((a, b) => a[b], this.$store.state);
-
-			// console.log(32111, state);
-			// if (state) console.log(321111, mapValue(state));
-			// else console.log(321111, "NADA");
-
-			if (state) return mapValue(state);
-			return mapValue({});
-		};
-	});
+	Object.entries(map).forEach(
+		([mapKey, mapValue]: [string, (value: object) => void]) => {
+			modalState[mapKey] = function func() {
+				// console.log(
+				// 	321,
+				// 	namespace
+				// 		.replace(
+				// 			"MODAL_MODULE_PATH",
+				// 			namespace.indexOf("MODAL_MODULE_PATH") !== -1
+				// 				? this.modalModulePath
+				// 				: null
+				// 		)
+				// 		.replace("MODAL_UUID", this.modalUuid)
+				// 		.split("/")
+				// );
+				// console.log(3211, mapKey);
+
+				const state = namespace
+					.replace(
+						"MODAL_MODULE_PATH",
+						namespace.indexOf("MODAL_MODULE_PATH") !== -1
+							? this.modalModulePath
+							: null
+					)
+					.replace("MODAL_UUID", this.modalUuid)
+					.split("/")
+					.reduce((a, b) => a[b], this.$store.state);
+
+				// console.log(32111, state);
+				// if (state) console.log(321111, mapValue(state));
+				// else console.log(321111, "NADA");
+
+				if (state) return mapValue(state);
+				return mapValue({});
+			};
+		}
+	);
 	return modalState;
 };
 
@@ -68,8 +70,8 @@ const mapModalComponents = (baseDirectory, map) => {
 	const modalComponents = {};
 	Object.entries(map).forEach(([mapKey, mapValue]) => {
 		modalComponents[mapKey] = () =>
-			defineAsyncComponent(() =>
-				import(`./${baseDirectory}/${mapValue}`)
+			defineAsyncComponent(
+				() => import(`./${baseDirectory}/${mapValue}`)
 			);
 	});
 	return modalComponents;
@@ -89,7 +91,7 @@ const useModalState = (namespace, options) => {
 		.split("/")
 		.reduce((a, b) => a[b], store.state);
 
-	return modalState ? modalState : {};
+	return modalState || {};
 };
 
 const useModalActions = (namespace, actions, options) => {
@@ -104,12 +106,12 @@ const useModalActions = (namespace, actions, options) => {
 		)
 		.replace("MODAL_UUID", options.modalUuid)}`;
 
-	const actionDispatchers = actions.map(actionName => ([actionName, function func(value) {
-		return store.dispatch(
-			`${pathStart}/${actionName}`,
-			value
-		);
-	}]));
+	const actionDispatchers = actions.map(actionName => [
+		actionName,
+		function func(value) {
+			return store.dispatch(`${pathStart}/${actionName}`, value);
+		}
+	]);
 
 	return Object.fromEntries(actionDispatchers);
 };
@@ -117,12 +119,18 @@ const useModalActions = (namespace, actions, options) => {
 const useModalComponents = (baseDirectory, map) => {
 	const modalComponents = {};
 	Object.entries(map).forEach(([mapKey, mapValue]) => {
-		modalComponents[mapKey] =
-			defineAsyncComponent(() =>
-				import(`./${baseDirectory}/${mapValue}`)
-			);
+		modalComponents[mapKey] = defineAsyncComponent(
+			() => import(`./${baseDirectory}/${mapValue}`)
+		);
 	});
 	return modalComponents;
 };
 
-export { mapModalState, mapModalActions, mapModalComponents, useModalState, useModalActions, useModalComponents };
+export {
+	mapModalState,
+	mapModalActions,
+	mapModalComponents,
+	useModalState,
+	useModalActions,
+	useModalComponents
+};