Added included/excluded playlists in Vuex for ManageStation modal

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

@@ -144,7 +144,7 @@
 <script>
 import { mapActions, mapState, mapGetters } from "vuex";
 
-import Toast from "toasters";
+// import Toast from "toasters";
 import draggable from "vuedraggable";
 import PlaylistItem from "@/components/PlaylistItem.vue";
 
@@ -154,8 +154,8 @@ import SortablePlaylists from "@/mixins/SortablePlaylists.vue";
 export default {
 	components: {
 		draggable,
-		PlaylistItem,
-		CreatePlaylist: () => import("@/components/modals/CreatePlaylist.vue")
+		PlaylistItem
+		// CreatePlaylist: () => import("@/components/modals/CreatePlaylist.vue")
 	},
 	mixins: [TabQueryHandler, SortablePlaylists],
 	data() {
@@ -177,7 +177,7 @@ export default {
 			myUserId: state => state.user.auth.userId,
 			userId: state => state.user.auth.userId
 		}),
-		...mapState("modals/editStation", {
+		...mapState("modals/manageStation", {
 			station: state => state.station,
 			originalStation: state => state.originalStation
 		}),

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

@@ -302,7 +302,7 @@ export default {
 		};
 	},
 	computed: {
-		...mapState("modals/editStation", {
+		...mapState("modals/manageStation", {
 			station: state => state.station,
 			originalStation: state => state.originalStation
 		}),

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

@@ -79,7 +79,7 @@ export default {
 	},
 	mixins: [SearchYoutube],
 	computed: {
-		...mapState("modals/editStation", {
+		...mapState("modals/manageStation", {
 			station: state => state.station,
 			originalStation: state => state.originalStation
 		}),

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

@@ -98,7 +98,7 @@ export default {
 		};
 	},
 	computed: {
-		...mapState("modals/editStation", {
+		...mapState("modals/manageStation", {
 			station: state => state.station,
 			originalStation: state => state.originalStation
 		}),
@@ -111,6 +111,26 @@ export default {
 			if (res.status === "success") {
 				const { station } = res.data;
 				this.editStation(station);
+
+				this.socket.dispatch(
+					"stations.getStationIncludedPlaylistsById",
+					this.stationId,
+					res => {
+						if (res.status === "success") {
+							this.setIncludedPlaylists(res.data.playlists);
+						}
+					}
+				);
+
+				this.socket.dispatch(
+					"stations.getStationExcludedPlaylistsById",
+					this.stationId,
+					res => {
+						if (res.status === "success") {
+							this.setExcludedPlaylists(res.data.playlists);
+						}
+					}
+				);
 			} else {
 				new Toast(`Station with that ID not found${this.stationId}`);
 				this.closeModal({
@@ -138,7 +158,12 @@ export default {
 				}
 			);
 		},
-		...mapActions("modals/editStation", ["editStation", "clearStation"]),
+		...mapActions("modals/manageStation", [
+			"editStation",
+			"setIncludedPlaylists",
+			"setExcludedPlaylists",
+			"clearStation"
+		]),
 		...mapActions("modalVisibility", ["closeModal"])
 	}
 };

frontend/src/store/index.js

@@ -12,6 +12,7 @@ import admin from "./modules/admin";
 
 import editSongModal from "./modules/modals/editSong";
 import editStationModal from "./modules/modals/editStation";
+import manageStationModal from "./modules/modals/manageStation";
 import editUserModal from "./modules/modals/editUser";
 import editNewsModal from "./modules/modals/editNews";
 import viewPunishmentModal from "./modules/modals/viewPunishment";
@@ -33,6 +34,7 @@ export default new Vuex.Store({
 			modules: {
 				editSong: editSongModal,
 				editStation: editStationModal,
+				manageStation: manageStationModal,
 				editUser: editUserModal,
 				editNews: editNewsModal,
 				viewPunishment: viewPunishmentModal,

frontend/src/store/modules/modals/manageStation.js

@@ -0,0 +1,57 @@
+/* eslint no-param-reassign: 0 */
+
+import Vue from "vue";
+
+export default {
+	namespaced: true,
+	state: {
+		originalStation: {},
+		station: {}
+	},
+	getters: {},
+	actions: {
+		editStation: ({ commit }, station) => commit("editStation", station),
+		setGenres: ({ commit }, genres) => commit("setGenres", genres),
+		setBlacklistedGenres: ({ commit }, blacklistedGenres) =>
+			commit("setBlacklistedGenres", blacklistedGenres),
+		setIncludedPlaylists: ({ commit }, includedPlaylists) =>
+			commit("setIncludedPlaylists", includedPlaylists),
+		setExcludedPlaylists: ({ commit }, excludedPlaylists) =>
+			commit("setExcludedPlaylists", excludedPlaylists),
+		clearStation: ({ commit }) => commit("clearStation")
+	},
+	mutations: {
+		editStation(state, station) {
+			state.originalStation = JSON.parse(JSON.stringify(station));
+			state.station = JSON.parse(JSON.stringify(station));
+		},
+		setGenres(state, genres) {
+			Vue.set(
+				state.station,
+				"genres",
+				JSON.parse(JSON.stringify(genres))
+			);
+		},
+		setBlacklistedGenres(state, blacklistedGenres) {
+			Vue.set(
+				state.station,
+				"blacklistedGenres",
+				JSON.parse(JSON.stringify(blacklistedGenres))
+			);
+		},
+		setIncludedPlaylists(state, includedPlaylists) {
+			state.includedPlaylists = JSON.parse(
+				JSON.stringify(includedPlaylists)
+			);
+		},
+		setExcludedPlaylists(state, excludedPlaylists) {
+			state.excludedPlaylists = JSON.parse(
+				JSON.stringify(excludedPlaylists)
+			);
+		},
+		clearStation(state) {
+			state.originalStation = null;
+			state.station = null;
+		}
+	}
+};