refactor: fixed eslint issues

frontend/.eslintrc

@@ -41,6 +41,7 @@
 			"error"
 		],
 		"vue/order-in-components": 2,
-		"vue/no-v-for-template-key": 0
+		"vue/no-v-for-template-key": 0,
+		"vue/multi-word-component-names": 0
 	}
 }

frontend/src/App.vue

@@ -210,18 +210,14 @@ export default {
 		this.$router.isReady().then(() => {
 			if (this.$route.query.err) {
 				let { err } = this.$route.query;
-				err = err
-					.replace(new RegExp("<", "g"), "&lt;")
-					.replace(new RegExp(">", "g"), "&gt;");
+				err = err.replace(/</g, "&lt;").replace(/>/g, "&gt;");
 				this.$router.push({ query: {} });
 				new Toast({ content: err, timeout: 20000 });
 			}
 
 			if (this.$route.query.msg) {
 				let { msg } = this.$route.query;
-				msg = msg
-					.replace(new RegExp("<", "g"), "&lt;")
-					.replace(new RegExp(">", "g"), "&gt;");
+				msg = msg.replace(/</g, "&lt;").replace(/>/g, "&gt;");
 				this.$router.push({ query: {} });
 				new Toast({ content: msg, timeout: 20000 });
 			}

frontend/src/api/admin/reports.js

@@ -5,13 +5,13 @@ import ws from "@/ws";
 
 export default {
 	resolve(reportId) {
-		return new Promise((resolve, reject) =>
+		return new Promise((resolve, reject) => {
 			ws.socket.dispatch("reports.resolve", reportId, res => {
 				new Toast(res.message);
 				if (res.status === "success")
 					return resolve({ status: "success" });
 				return reject(new Error(res.message));
-			})
-		);
+			});
+		});
 	}
 };

frontend/src/components/AdvancedTable.vue

@@ -70,11 +70,7 @@
 							<div
 								v-for="(filter, index) in editingFilters"
 								:key="`filter-${index}`"
-								class="
-									advanced-filter
-									control
-									is-grouped is-expanded
-								"
+								class="advanced-filter control is-grouped is-expanded"
 							>
 								<div class="control select">
 									<select
@@ -228,10 +224,7 @@
 										@click="applyFilterAndGetData()"
 									>
 										<i
-											class="
-												material-icons
-												icon-with-button
-											"
+											class="material-icons icon-with-button"
 											>filter_list</i
 										>
 										Apply filters
@@ -248,10 +241,7 @@
 										@click="applyFilterAndGetData()"
 									>
 										<i
-											class="
-												material-icons
-												icon-with-button
-											"
+											class="material-icons icon-with-button"
 											>filter_list</i
 										>
 										Apply filters
@@ -372,11 +362,7 @@
 										"
 									>
 										<p
-											class="
-												control
-												is-expanded
-												checkbox-control
-											"
+											class="control is-expanded checkbox-control"
 										>
 											<label class="switch">
 												<input

frontend/src/components/SongItem.vue

@@ -109,10 +109,7 @@
 							>
 								<template #button>
 									<i
-										class="
-											material-icons
-											add-to-playlist-icon
-										"
+										class="material-icons add-to-playlist-icon"
 										content="Add Song to Playlist"
 										v-tippy
 										>playlist_add</i

frontend/src/components/modals/EditPlaylist/Tabs/ImportPlaylists.vue

@@ -58,7 +58,7 @@ export default {
 			if (!this.youtubeSearch.playlist.query)
 				return new Toast("Please enter a YouTube playlist URL.");
 
-			const regex = new RegExp(`[\\?&]list=([^&#]*)`);
+			const regex = /`[\\?&]list=([^&#]*)`/;
 			const splitQuery = regex.exec(this.youtubeSearch.playlist.query);
 
 			if (!splitQuery) {

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

@@ -113,10 +113,7 @@
 									>
 										<template #tippyActions>
 											<i
-												class="
-													material-icons
-													add-to-queue-icon
-												"
+												class="material-icons add-to-queue-icon"
 												v-if="
 													station.partyMode &&
 													!station.locked
@@ -144,10 +141,7 @@
 												"
 											>
 												<i
-													class="
-														material-icons
-														delete-icon
-													"
+													class="material-icons delete-icon"
 													content="Remove Song from Playlist"
 													v-tippy
 													>delete_forever</i

frontend/src/components/modals/EditSong/Tabs/Discogs.vue

@@ -202,7 +202,7 @@ export default {
 					.then(data => {
 						apiResult.album.artists = [];
 						apiResult.album.artistIds = [];
-						const artistRegex = new RegExp(" \\([0-9]+\\)$");
+						const artistRegex = /" \\([0-9]+\\)$"/;
 
 						apiResult.dataQuality = data.data_quality;
 						data.artists.forEach(artist => {

frontend/src/components/modals/EditSong/Tabs/Reports.vue

@@ -50,11 +50,7 @@
 							:key="issueIndex"
 						>
 							<i
-								class="
-									material-icons
-									duration-icon
-									report-sub-item-left-icon
-								"
+								class="material-icons duration-icon report-sub-item-left-icon"
 								:content="issue.category"
 								v-tippy
 							>
@@ -74,10 +70,7 @@
 							</p>
 
 							<div
-								class="
-									report-sub-item-actions
-									universal-item-actions
-								"
+								class="report-sub-item-actions universal-item-actions"
 							>
 								<i
 									class="material-icons resolve-icon"
@@ -145,11 +138,7 @@
 							:key="issueIndex"
 						>
 							<i
-								class="
-									material-icons
-									duration-icon
-									report-sub-item-left-icon
-								"
+								class="material-icons duration-icon report-sub-item-left-icon"
 								:content="issue.category"
 								v-tippy
 							>
@@ -168,10 +157,7 @@
 							</p>
 
 							<div
-								class="
-									report-sub-item-actions
-									universal-item-actions
-								"
+								class="report-sub-item-actions universal-item-actions"
 							>
 								<i
 									class="material-icons resolve-icon"

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

@@ -511,12 +511,7 @@
 							</button>
 						</quick-confirm>
 						<button
-							class="
-								button
-								is-danger
-								icon-with-button
-								material-icons
-							"
+							class="button is-danger icon-with-button material-icons"
 							@click.prevent="
 								confirmAction({
 									message:
@@ -1320,9 +1315,9 @@ export default {
 			error = undefined;
 			song.tags.forEach(tag => {
 				if (
-					!new RegExp(
-						/^[a-zA-Z0-9_]{1,64}$|^[a-zA-Z0-9_]{1,64}\[[a-zA-Z0-9_]{1,64}\]$/
-					).test(tag)
+					!/^[a-zA-Z0-9_]{1,64}$|^[a-zA-Z0-9_]{1,64}\[[a-zA-Z0-9_]{1,64}\]$/.test(
+						tag
+					)
 				) {
 					error = "Invalid tag format.";
 					return error;
@@ -1440,8 +1435,6 @@ export default {
 		},
 		settings(type) {
 			switch (type) {
-				default:
-					break;
 				case "stop":
 					this.stopVideo();
 					this.pauseVideo(true);
@@ -1459,6 +1452,8 @@ export default {
 						this.song.duration - 10 + this.song.skipDuration
 					);
 					break;
+				default:
+					break;
 			}
 		},
 		play() {

frontend/src/components/modals/EditSongs.vue

@@ -59,11 +59,7 @@
 								<template #leftIcon>
 									<i
 										v-if="currentSong._id === song._id"
-										class="
-											material-icons
-											item-icon
-											editing-icon
-										"
+										class="material-icons item-icon editing-icon"
 										content="Currently editing song"
 										v-tippy="{ theme: 'info' }"
 										@click="toggleDone(index)"
@@ -71,22 +67,14 @@
 									>
 									<i
 										v-else-if="song.removed"
-										class="
-											material-icons
-											item-icon
-											removed-icon
-										"
+										class="material-icons item-icon removed-icon"
 										content="Song removed"
 										v-tippy="{ theme: 'info' }"
 										>delete_forever</i
 									>
 									<i
 										v-else-if="status === 'error'"
-										class="
-											material-icons
-											item-icon
-											error-icon
-										"
+										class="material-icons item-icon error-icon"
 										content="Error saving song"
 										v-tippy="{ theme: 'info' }"
 										@click="toggleDone(index)"
@@ -94,22 +82,14 @@
 									>
 									<i
 										v-else-if="status === 'saving'"
-										class="
-											material-icons
-											item-icon
-											saving-icon
-										"
+										class="material-icons item-icon saving-icon"
 										content="Currently saving song"
 										v-tippy="{ theme: 'info' }"
 										>pending</i
 									>
 									<i
 										v-else-if="flagged"
-										class="
-											material-icons
-											item-icon
-											flag-icon
-										"
+										class="material-icons item-icon flag-icon"
 										content="Song flagged"
 										v-tippy="{ theme: 'info' }"
 										@click="toggleDone(index)"
@@ -117,11 +97,7 @@
 									>
 									<i
 										v-else-if="status === 'done'"
-										class="
-											material-icons
-											item-icon
-											done-icon
-										"
+										class="material-icons item-icon done-icon"
 										content="Song marked complete"
 										v-tippy="{ theme: 'info' }"
 										@click="toggleDone(index)"
@@ -129,11 +105,7 @@
 									>
 									<i
 										v-else-if="status === 'todo'"
-										class="
-											material-icons
-											item-icon
-											todo-icon
-										"
+										class="material-icons item-icon todo-icon"
 										content="Song marked todo"
 										v-tippy="{ theme: 'info' }"
 										@click="toggleDone(index)"

frontend/src/components/modals/ImportAlbum.vue

@@ -149,11 +149,7 @@
 								!discogs.disableLoadMore &&
 								discogs.page < discogs.pages
 							"
-							class="
-								button
-								is-fullwidth is-info
-								discogs-load-more
-							"
+							class="button is-fullwidth is-info discogs-load-more"
 							@click="loadNextDiscogsPage()"
 						>
 							Load more...
@@ -470,7 +466,7 @@ export default {
 			if (!this.search.playlist.query)
 				return new Toast("Please enter a YouTube playlist URL.");
 
-			const regex = new RegExp(`[\\?&]list=([^&#]*)`);
+			const regex = /`[\\?&]list=([^&#]*)`/;
 			const splitQuery = regex.exec(this.search.playlist.query);
 
 			if (!splitQuery) {
@@ -561,7 +557,7 @@ export default {
 					.then(data => {
 						apiResult.album.artists = [];
 						apiResult.album.artistIds = [];
-						const artistRegex = new RegExp(" \\([0-9]+\\)$");
+						const artistRegex = /" \\([0-9]+\\)$"/;
 
 						apiResult.dataQuality = data.data_quality;
 						data.artists.forEach(artist => {

frontend/src/components/modals/ManageStation/Tabs/Songs.vue

@@ -75,10 +75,7 @@
 												song.youtubeId
 											) !== -1
 										"
-										class="
-											material-icons
-											added-to-playlist-icon
-										"
+										class="material-icons added-to-playlist-icon"
 										content="Song is already in queue"
 										v-tippy
 										>done</i
@@ -148,10 +145,7 @@
 											songsInQueue.indexOf(result.id) !==
 											-1
 										"
-										class="
-											material-icons
-											added-to-playlist-icon
-										"
+										class="material-icons added-to-playlist-icon"
 										content="Song is already in queue"
 										v-tippy
 										>done</i

frontend/src/components/modals/Report.vue

@@ -89,10 +89,7 @@
 											@click="customIssues.push('')"
 										>
 											<i
-												class="
-													material-icons
-													icon-with-button
-												"
+												class="material-icons icon-with-button"
 												>add</i
 											>
 											<span> Add Custom Issue </span>
@@ -100,12 +97,7 @@
 									</div>
 
 									<div
-										class="
-											custom-issue
-											control
-											is-grouped
-											input-with-button
-										"
+										class="custom-issue control is-grouped input-with-button"
 										v-for="(issue, index) in customIssues"
 										:key="index"
 									>

frontend/src/components/modals/RequestSong.vue

@@ -194,7 +194,7 @@ export default {
 			if (!this.youtubeSearch.playlist.query)
 				return new Toast("Please enter a YouTube playlist URL.");
 
-			const regex = new RegExp(`[\\?&]list=([^&#]*)`);
+			const regex = /`[\\?&]list=([^&#]*)`/;
 			const splitQuery = regex.exec(this.youtubeSearch.playlist.query);
 
 			if (!splitQuery) {

frontend/src/components/modals/ViewReport.vue

@@ -28,11 +28,7 @@
 						:key="issueIndex"
 					>
 						<i
-							class="
-								material-icons
-								duration-icon
-								report-sub-item-left-icon
-							"
+							class="material-icons duration-icon report-sub-item-left-icon"
 							:content="issue.category"
 							v-tippy
 						>
@@ -51,10 +47,7 @@
 						</p>
 
 						<div
-							class="
-								report-sub-item-actions
-								universal-item-actions
-							"
+							class="report-sub-item-actions universal-item-actions"
 						>
 							<i
 								class="material-icons resolve-icon"

frontend/src/pages/Admin/tabs/News.vue

@@ -19,12 +19,7 @@
 				<template #column-options="slotProps">
 					<div class="row-options">
 						<button
-							class="
-								button
-								is-primary
-								icon-with-button
-								material-icons
-							"
+							class="button is-primary icon-with-button material-icons"
 							@click="edit(slotProps.item._id)"
 							content="Edit News"
 							v-tippy
@@ -36,12 +31,7 @@
 							:disabled="slotProps.item.removed"
 						>
 							<button
-								class="
-									button
-									is-danger
-									icon-with-button
-									material-icons
-								"
+								class="button is-danger icon-with-button material-icons"
 								content="Remove News"
 								v-tippy
 							>

frontend/src/pages/Admin/tabs/Playlists.vue

@@ -16,12 +16,7 @@
 				<template #column-options="slotProps">
 					<div class="row-options">
 						<button
-							class="
-								button
-								is-primary
-								icon-with-button
-								material-icons
-							"
+							class="button is-primary icon-with-button material-icons"
 							@click="edit(slotProps.item._id)"
 							:disabled="slotProps.item.removed"
 							content="Edit Playlist"

frontend/src/pages/Admin/tabs/Punishments.vue

@@ -13,12 +13,7 @@
 				<template #column-options="slotProps">
 					<div class="row-options">
 						<button
-							class="
-								button
-								is-primary
-								icon-with-button
-								material-icons
-							"
+							class="button is-primary icon-with-button material-icons"
 							@click="view(slotProps.item._id)"
 							:disabled="slotProps.item.removed"
 							content="View Punishment"

frontend/src/pages/Admin/tabs/Reports.vue

@@ -14,12 +14,7 @@
 				<template #column-options="slotProps">
 					<div class="row-options">
 						<button
-							class="
-								button
-								is-primary
-								icon-with-button
-								material-icons
-							"
+							class="button is-primary icon-with-button material-icons"
 							@click="view(slotProps.item._id)"
 							:disabled="slotProps.item.removed"
 							content="View Report"
@@ -28,12 +23,7 @@
 							open_in_full
 						</button>
 						<button
-							class="
-								button
-								is-success
-								icon-with-button
-								material-icons
-							"
+							class="button is-success icon-with-button material-icons"
 							@click="resolve(slotProps.item._id)"
 							:disabled="slotProps.item.removed"
 							content="Resolve Report"

frontend/src/pages/Admin/tabs/Songs.vue

@@ -28,12 +28,7 @@
 				<template #column-options="slotProps">
 					<div class="row-options">
 						<button
-							class="
-								button
-								is-primary
-								icon-with-button
-								material-icons
-							"
+							class="button is-primary icon-with-button material-icons"
 							@click="editOne(slotProps.item)"
 							:disabled="slotProps.item.removed"
 							content="Edit Song"
@@ -46,12 +41,7 @@
 							@confirm="unverifyOne(slotProps.item._id)"
 						>
 							<button
-								class="
-									button
-									is-danger
-									icon-with-button
-									material-icons
-								"
+								class="button is-danger icon-with-button material-icons"
 								:disabled="slotProps.item.removed"
 								content="Unverify Song"
 								v-tippy
@@ -61,12 +51,7 @@
 						</quick-confirm>
 						<button
 							v-else
-							class="
-								button
-								is-success
-								icon-with-button
-								material-icons
-							"
+							class="button is-success icon-with-button material-icons"
 							@click="verifyOne(slotProps.item._id)"
 							:disabled="slotProps.item.removed"
 							content="Verify Song"
@@ -75,12 +60,7 @@
 							check_circle
 						</button>
 						<button
-							class="
-								button
-								is-danger
-								icon-with-button
-								material-icons
-							"
+							class="button is-danger icon-with-button material-icons"
 							@click.prevent="
 								confirmAction({
 									message:
@@ -722,9 +702,7 @@ export default {
 				name: "tags",
 				action: "songs.editTags",
 				items: selectedRows.map(row => row._id),
-				regex: new RegExp(
-					/^[a-zA-Z0-9_]{1,64}$|^[a-zA-Z0-9_]{1,64}\[[a-zA-Z0-9_]{1,64}\]$/
-				),
+				regex: /^[a-zA-Z0-9_]{1,64}$|^[a-zA-Z0-9_]{1,64}\[[a-zA-Z0-9_]{1,64}\]$/,
 				autosuggest: true,
 				autosuggestDataAction: "songs.getTags"
 			};
@@ -735,7 +713,7 @@ export default {
 				name: "artists",
 				action: "songs.editArtists",
 				items: selectedRows.map(row => row._id),
-				regex: new RegExp(/^(?=.{1,64}$).*$/),
+				regex: /^(?=.{1,64}$).*$/,
 				autosuggest: true,
 				autosuggestDataAction: "songs.getArtists"
 			};
@@ -746,7 +724,7 @@ export default {
 				name: "genres",
 				action: "songs.editGenres",
 				items: selectedRows.map(row => row._id),
-				regex: new RegExp(/^[\x00-\x7F]{1,32}$/),
+				regex: /^[\x00-\x7F]{1,32}$/,
 				autosuggest: true,
 				autosuggestDataAction: "songs.getGenres"
 			};

frontend/src/pages/Admin/tabs/Stations.vue

@@ -22,12 +22,7 @@
 				<template #column-options="slotProps">
 					<div class="row-options">
 						<button
-							class="
-								button
-								is-primary
-								icon-with-button
-								material-icons
-							"
+							class="button is-primary icon-with-button material-icons"
 							@click="edit(slotProps.item._id)"
 							:disabled="slotProps.item.removed"
 							content="Manage Station"
@@ -40,12 +35,7 @@
 							:disabled="slotProps.item.removed"
 						>
 							<button
-								class="
-									button
-									is-danger
-									icon-with-button
-									material-icons
-								"
+								class="button is-danger icon-with-button material-icons"
 								content="Remove Station"
 								v-tippy
 							>

frontend/src/pages/Admin/tabs/Users.vue

@@ -22,12 +22,7 @@
 							:disabled="slotProps.item.removed"
 						>
 							<button
-								class="
-									button
-									is-success
-									icon-with-button
-									material-icons
-								"
+								class="button is-success icon-with-button material-icons"
 								content="Resolve Data Request"
 								v-tippy
 							>
@@ -76,12 +71,7 @@
 				<template #column-options="slotProps">
 					<div class="row-options">
 						<button
-							class="
-								button
-								is-primary
-								icon-with-button
-								material-icons
-							"
+							class="button is-primary icon-with-button material-icons"
 							@click="edit(slotProps.item._id)"
 							:disabled="slotProps.item.removed"
 							content="Edit User"

frontend/src/pages/Home.vue

@@ -68,10 +68,7 @@
 									<div class="icon-container">
 										<div
 											v-if="isOwnerOrAdmin(element)"
-											class="
-												material-icons
-												manage-station
-											"
+											class="material-icons manage-station"
 											@click.prevent="
 												manageStation(element._id)
 											"
@@ -82,10 +79,7 @@
 										</div>
 										<div
 											v-else
-											class="
-												material-icons
-												manage-station
-											"
+											class="material-icons manage-station"
 											@click.prevent="
 												manageStation(element._id)
 											"
@@ -127,10 +121,7 @@
 										<h5>{{ element.displayName }}</h5>
 										<i
 											v-if="element.type === 'official'"
-											class="
-												material-icons
-												verified-station
-											"
+											class="material-icons verified-station"
 											content="Verified Station"
 											v-tippy="{
 												theme: 'info'

frontend/src/pages/ResetPassword.vue

@@ -39,11 +39,7 @@
 
 								<div class="content-box-inputs">
 									<div
-										class="
-											control
-											is-grouped
-											input-with-button
-										"
+										class="control is-grouped input-with-button"
 									>
 										<p class="control is-expanded">
 											<input
@@ -63,10 +59,7 @@
 												@click="submitEmail()"
 											>
 												<i
-													class="
-														material-icons
-														icon-with-button
-													"
+													class="material-icons icon-with-button"
 													>mail</i
 												>Request
 											</button>
@@ -108,11 +101,7 @@
 
 								<div class="content-box-inputs">
 									<div
-										class="
-											control
-											is-grouped
-											input-with-button
-										"
+										class="control is-grouped input-with-button"
 									>
 										<p class="control is-expanded">
 											<input
@@ -130,10 +119,7 @@
 												@click="verifyCode()"
 											>
 												<i
-													class="
-														material-icons
-														icon-with-button
-													"
+													class="material-icons icon-with-button"
 													>vpn_key</i
 												>Verify
 											</button>

frontend/src/pages/Station/index.vue

@@ -323,10 +323,7 @@
 										v-tippy
 									>
 										<i
-											class="
-												material-icons
-												icon-with-button
-											"
+											class="material-icons icon-with-button"
 										>
 											bug_report
 										</i>
@@ -362,10 +359,7 @@
 										v-tippy
 									>
 										<i
-											class="
-												material-icons
-												icon-with-button
-											"
+											class="material-icons icon-with-button"
 											>skip_next</i
 										>
 									</button>
@@ -377,10 +371,7 @@
 										v-tippy
 									>
 										<i
-											class="
-												material-icons
-												icon-with-button
-											"
+											class="material-icons icon-with-button"
 											>skip_next</i
 										>
 										{{ currentSong.skipVotes }}
@@ -392,10 +383,7 @@
 										v-tippy="{ theme: 'info' }"
 									>
 										<i
-											class="
-												material-icons
-												icon-with-button
-											"
+											class="material-icons icon-with-button"
 											>skip_next</i
 										>
 										{{ currentSong.skipVotes }}
@@ -464,10 +452,7 @@
 											v-tippy
 										>
 											<i
-												class="
-													material-icons
-													icon-with-button
-												"
+												class="material-icons icon-with-button"
 												:class="{
 													liked: currentSong.liked
 												}"
@@ -477,21 +462,14 @@
 
 										<!-- Dislike Song Button -->
 										<button
-											class="
-												button
-												is-danger
-												dislike-song
-											"
+											class="button is-danger dislike-song"
 											id="dislike-song"
 											@click="toggleDislike()"
 											content="Dislike Song"
 											v-tippy
 										>
 											<i
-												class="
-													material-icons
-													icon-with-button
-												"
+												class="material-icons icon-with-button"
 												:class="{
 													disliked:
 														currentSong.disliked
@@ -503,42 +481,26 @@
 									<div id="ratings" class="disabled" v-else>
 										<!-- Like Song Button -->
 										<button
-											class="
-												button
-												is-success
-												like-song
-												disabled
-											"
+											class="button is-success like-song disabled"
 											id="like-song"
 											content="Ratings have not been loaded yet"
 											v-tippy
 										>
 											<i
-												class="
-													material-icons
-													icon-with-button
-												"
+												class="material-icons icon-with-button"
 												>thumb_up_alt</i
 											>
 										</button>
 
 										<!-- Dislike Song Button -->
 										<button
-											class="
-												button
-												is-danger
-												dislike-song
-												disabled
-											"
+											class="button is-danger dislike-song disabled"
 											id="dislike-song"
 											content="Ratings have not been loaded yet"
 											v-tippy
 										>
 											<i
-												class="
-													material-icons
-													icon-with-button
-												"
+												class="material-icons icon-with-button"
 												>thumb_down_alt</i
 											>
 										</button>
@@ -557,15 +519,10 @@
 											>
 												<div class="control has-addons">
 													<button
-														class="
-															button
-															is-primary
-														"
+														class="button is-primary"
 													>
 														<i
-															class="
-																material-icons
-															"
+															class="material-icons"
 														>
 															playlist_add
 														</i>
@@ -575,9 +532,7 @@
 														id="dropdown-toggle"
 													>
 														<i
-															class="
-																material-icons
-															"
+															class="material-icons"
 														>
 															{{
 																showPlaylistDropdown
@@ -602,10 +557,7 @@
 											v-tippy="{ theme: 'info' }"
 										>
 											<i
-												class="
-													material-icons
-													icon-with-button
-												"
+												class="material-icons icon-with-button"
 												>thumb_up_alt</i
 											>{{ currentSong.likes }}
 										</button>
@@ -618,10 +570,7 @@
 											v-tippy="{ theme: 'info' }"
 										>
 											<i
-												class="
-													material-icons
-													icon-with-button
-												"
+												class="material-icons icon-with-button"
 												>thumb_down_alt</i
 											>{{ currentSong.dislikes }}
 										</button>
@@ -635,10 +584,7 @@
 											v-tippy="{ theme: 'info' }"
 										>
 											<i
-												class="
-													material-icons
-													icon-with-button
-												"
+												class="material-icons icon-with-button"
 												>thumb_up_alt</i
 											>
 										</button>
@@ -651,10 +597,7 @@
 											v-tippy="{ theme: 'info' }"
 										>
 											<i
-												class="
-													material-icons
-													icon-with-button
-												"
+												class="material-icons icon-with-button"
 												>thumb_down_alt</i
 											>
 										</button>
@@ -663,11 +606,7 @@
 									<div id="add-song-to-playlist">
 										<div class="control has-addons">
 											<button
-												class="
-													button
-													is-primary
-													disabled
-												"
+												class="button is-primary disabled"
 												content="Log in to add songs to playlist"
 												v-tippy="{ theme: 'info' }"
 											>

frontend/src/store/modules/admin.js

@@ -30,12 +30,12 @@ const modules = {
 		actions: {
 			/* eslint-disable-next-line no-unused-vars */
 			resolveReport: ({ commit }, reportId) =>
-				new Promise((resolve, reject) =>
+				new Promise((resolve, reject) => {
 					admin.reports
 						.resolve(reportId)
 						.then(res => resolve(res))
-						.catch(err => reject(new Error(err.message)))
-				)
+						.catch(err => reject(new Error(err.message)));
+				})
 		},
 		mutations: {}
 	},

frontend/src/store/modules/user.js

@@ -33,60 +33,52 @@ const modules = {
 					const { username, email, password } = user;
 
 					if (!email || !username || !password)
-						return reject(new Error("Please fill in all fields"));
-
-					if (!validation.isLength(email, 3, 254))
-						return reject(
+						reject(new Error("Please fill in all fields"));
+					else if (!validation.isLength(email, 3, 254))
+						reject(
 							new Error(
 								"Email must have between 3 and 254 characters."
 							)
 						);
-
-					if (
+					else if (
 						email.indexOf("@") !== email.lastIndexOf("@") ||
 						!validation.regex.emailSimple.test(email)
 					)
-						return reject(new Error("Invalid email format."));
-
-					if (!validation.isLength(username, 2, 32))
-						return reject(
+						reject(new Error("Invalid email format."));
+					else if (!validation.isLength(username, 2, 32))
+						reject(
 							new Error(
 								"Username must have between 2 and 32 characters."
 							)
 						);
-
-					if (!validation.regex.azAZ09_.test(username))
-						return reject(
+					else if (!validation.regex.azAZ09_.test(username))
+						reject(
 							new Error(
 								"Invalid username format. Allowed characters: a-z, A-Z, 0-9 and _."
 							)
 						);
-
-					if (username.replaceAll(/[_]/g, "").length === 0)
-						return reject(
+					else if (username.replaceAll(/[_]/g, "").length === 0)
+						reject(
 							new Error(
 								"Invalid username format. Allowed characters: a-z, A-Z, 0-9 and _, and there has to be at least one letter or number."
 							)
 						);
-
-					if (!validation.isLength(password, 6, 200))
-						return reject(
+					else if (!validation.isLength(password, 6, 200))
+						reject(
 							new Error(
 								"Password must have between 6 and 200 characters."
 							)
 						);
-
-					if (!validation.regex.password.test(password))
-						return reject(
+					else if (!validation.regex.password.test(password))
+						reject(
 							new Error(
 								"Invalid password format. Must have one lowercase letter, one uppercase letter, one number and one special character."
 							)
 						);
-
-					return auth
-						.register(user)
-						.then(res => resolve(res))
-						.catch(err => reject(new Error(err.message)));
+					else
+						auth.register(user)
+							.then(res => resolve(res))
+							.catch(err => reject(new Error(err.message)));
 				}),
 			/* eslint-disable-next-line no-unused-vars */
 			login: ({ commit }, user) =>
@@ -108,12 +100,11 @@ const modules = {
 						.catch(err => reject(new Error(err.message)));
 				}),
 			logout: () =>
-				new Promise((resolve, reject) =>
-					auth
-						.logout()
+				new Promise((resolve, reject) => {
+					auth.logout()
 						.then(() => resolve())
-						.catch(() => reject())
-				),
+						.catch(() => reject());
+				}),
 			getUsernameFromId: ({ commit, state }, userId) =>
 				new Promise(resolve => {
 					if (typeof state.userIdMap[`Z${userId}`] !== "string") {