Replaced editingSongId with modal state for opening editSong modal

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

@@ -103,7 +103,7 @@
 				</tbody>
 			</table>
 		</div>
-		<edit-song v-if="modals.editSong" :song-id="editingSongId" />
+		<edit-song v-if="modals.editSong" />
 		<floating-box
 			id="keyboardShortcutsHelper"
 			ref="keyboardShortcutsHelper"
@@ -188,7 +188,6 @@ export default {
 	mixins: [ScrollAndFetchHandler],
 	data() {
 		return {
-			editingSongId: "",
 			searchQuery: "",
 			songs: []
 		};
@@ -246,13 +245,7 @@ export default {
 	},
 	methods: {
 		edit(song) {
-			// const newSong = {};
-			// Object.keys(song).forEach(n => {
-			// 	newSong[n] = song[n];
-			// });
-
-			// this.editSong({ index, song: newSong, type: "queueSongs" });
-			this.editingSongId = song._id;
+			this.editSong(song);
 			this.openModal({ sector: "admin", modal: "editSong" });
 		},
 		unhide(song) {
@@ -312,8 +305,7 @@ export default {
 
 			this.socket.dispatch("apis.joinAdminRoom", "hiddenSongs", () => {});
 		},
-		// ...mapActions("admin/songs", ["editSong"]),
-		...mapActions("modals/editSong", ["stopVideo"]),
+		...mapActions("modals/editSong", ["editSong", "stopVideo"]),
 		...mapActions("modalVisibility", ["openModal"])
 	}
 };

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

@@ -71,11 +71,7 @@
 
 		<edit-playlist v-if="modals.admin.editPlaylist" sector="admin" />
 		<report v-if="modals.station.report" />
-		<edit-song
-			v-if="modals.admin.editSong"
-			:song-id="editingSongId"
-			song-type="songs"
-		/>
+		<edit-song v-if="modals.admin.editSong" song-type="songs" />
 	</div>
 </template>
 
@@ -100,8 +96,7 @@ export default {
 	data() {
 		return {
 			utils,
-			playlists: [],
-			editingSongId: ""
+			playlists: []
 		};
 	},
 	computed: {

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

@@ -109,7 +109,7 @@
 				</tbody>
 			</table>
 		</div>
-		<edit-song v-if="modals.editSong" :song-id="editingSongId" />
+		<edit-song v-if="modals.editSong" />
 		<floating-box
 			id="keyboardShortcutsHelper"
 			ref="keyboardShortcutsHelper"
@@ -196,7 +196,6 @@ export default {
 	mixins: [ScrollAndFetchHandler],
 	data() {
 		return {
-			editingSongId: "",
 			searchQuery: "",
 			songs: []
 		};
@@ -254,13 +253,7 @@ export default {
 	},
 	methods: {
 		edit(song) {
-			// const newSong = {};
-			// Object.keys(song).forEach(n => {
-			// 	newSong[n] = song[n];
-			// });
-
-			// this.editSong({ index, song: newSong, type: "queueSongs" });
-			this.editingSongId = song._id;
+			this.editSong(song);
 			this.openModal({ sector: "admin", modal: "editSong" });
 		},
 		verify(song) {
@@ -336,8 +329,7 @@ export default {
 				() => {}
 			);
 		},
-		// ...mapActions("admin/songs", ["editSong"]),
-		...mapActions("modals/editSong", ["stopVideo"]),
+		...mapActions("modals/editSong", ["editSong", "stopVideo"]),
 		...mapActions("modalVisibility", ["openModal"])
 	}
 };

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

@@ -132,11 +132,7 @@
 				</tbody>
 			</table>
 		</div>
-		<edit-song
-			v-if="modals.editSong"
-			:song-id="editingSongId"
-			song-type="songs"
-		/>
+		<edit-song v-if="modals.editSong" song-type="songs" />
 		<floating-box
 			id="keyboardShortcutsHelper"
 			ref="keyboardShortcutsHelper"
@@ -221,7 +217,6 @@ export default {
 	mixins: [ScrollAndFetchHandler],
 	data() {
 		return {
-			editingSongId: "",
 			searchQuery: "",
 			artistFilterQuery: "",
 			artistFilterSelected: [],
@@ -352,8 +347,7 @@ export default {
 	},
 	methods: {
 		edit(song) {
-			// this.editSong({ song, type: "songs" });
-			this.editingSongId = song._id;
+			this.editSong(song);
 			this.openModal({ sector: "admin", modal: "editSong" });
 		},
 		remove(id) {
@@ -432,12 +426,11 @@ export default {
 		},
 		...mapActions("admin/songs", [
 			// "stopVideo",
-			// "editSong",
 			"addSong",
 			"removeSong",
 			"updateSong"
 		]),
-		...mapActions("modals/editSong", ["stopVideo"]),
+		...mapActions("modals/editSong", ["editSong", "stopVideo"]),
 		...mapActions("modalVisibility", ["openModal", "closeModal"])
 	}
 };

frontend/src/pages/Profile/index.vue

@@ -2,11 +2,7 @@
 	<div v-if="isUser">
 		<edit-playlist v-if="modals.station.editPlaylist" />
 		<report v-if="modals.station.report" />
-		<edit-song
-			v-if="modals.admin.editSong"
-			:song-id="editingSongId"
-			song-type="songs"
-		/>
+		<edit-song v-if="modals.admin.editSong" song-type="songs" />
 
 		<metadata :title="`Profile | ${user.username}`" />
 		<main-header />
@@ -124,8 +120,7 @@ export default {
 			user: {},
 			userId: "",
 			isUser: false,
-			tab: "recent-activity",
-			editingSongId: ""
+			tab: "recent-activity"
 		};
 	},
 	computed: {

frontend/src/pages/Station/components/CurrentlyPlaying.vue

@@ -124,7 +124,7 @@
 					class="button is-primary"
 					id="editsong-icon"
 					v-if="$parent.isAdminOnly()"
-					@click="$parent.editSong(song)"
+					@click="edit(song)"
 				>
 					<i class="material-icons icon-with-button">edit</i>
 				</button>
@@ -160,10 +160,15 @@ export default {
 		})
 	},
 	methods: {
+		edit(song) {
+			this.editSong(song);
+			this.openModal({ sector: "admin", modal: "editSong" });
+		},
 		report(song) {
 			this.reportSong(song);
 			this.openModal({ sector: "station", modal: "report" });
 		},
+		...mapActions("modals/editSong", ["editSong"]),
 		...mapActions("modals/report", ["reportSong"]),
 		...mapActions("modalVisibility", ["openModal"]),
 		formatDistance,

frontend/src/pages/Station/components/Sidebar/Queue/QueueItem.vue

@@ -92,7 +92,7 @@
 				<i
 					v-if="$parent.isAdminOnly()"
 					class="material-icons edit-icon"
-					@click="$parent.$parent.$parent.editSong(song)"
+						@click="edit(song)"
 				>
 					edit
 				</i>
@@ -140,6 +140,11 @@ export default {
 			this.reportSong(song);
 			this.openModal({ sector: "station", modal: "report" });
 		},
+		edit(song) {
+			this.editSong(song);
+			this.openModal({ sector: "admin", modal: "editSong" });
+		},
+		...mapActions("modals/editSong", ["editSong"]),
 		...mapActions("modals/report", ["reportSong"]),
 		...mapActions("modalVisibility", ["openModal"]),
 		formatDistance,

frontend/src/pages/Station/index.vue

@@ -441,7 +441,6 @@
 
 		<edit-song
 			v-if="modals.admin.editSong"
-			:song-id="editingSongId"
 			song-type="songs"
 			sector="station"
 		/>
@@ -558,7 +557,6 @@ export default {
 			playbackRate: 1,
 			volumeSliderValue: 0,
 			showPlaylistDropdown: false,
-			editingSongId: "",
 			theme: "var(--primary-color)"
 		};
 	},
@@ -1724,10 +1722,6 @@ export default {
 				}
 			);
 		},
-		editSong(song) {
-			this.editingSongId = song._id;
-			this.openModal({ sector: "admin", modal: "editSong" });
-		},
 		...mapActions("modalVisibility", ["openModal"]),
 		...mapActions("station", [
 			"joinStation",