fix(EditSong): SaveButton mixin now allows for any custom messages as default

Signed-off-by: Jonathan Graham <theflametrooper@gmail.com>

frontend/src/components/SaveButton.vue

@@ -15,7 +15,7 @@
 <script>
 export default {
 	props: {
-		type: { type: String, default: "save" } // enum: ["save", "save-and-close"]
+		defaultMessage: { type: String, default: "Save Changes" }
 	},
 	emits: ["clicked"],
 	data() {
@@ -33,9 +33,9 @@ export default {
 				case "disabled":
 					return "Saving...";
 				default:
-					return this.type === "save-and-close"
-						? "Save and Close"
-						: "Save changes";
+					return this.defaultMessage
+						? this.defaultMessage
+						: "Save Changes";
 			}
 		},
 		style() {
@@ -44,6 +44,8 @@ export default {
 					return "is-success";
 				case "save-failure":
 					return `is-danger`;
+				case "disabled":
+					return "is-default";
 				default:
 					return "is-primary";
 			}

frontend/src/components/modals/EditNews.vue

@@ -36,7 +36,7 @@
 
 				<save-button
 					ref="saveAndCloseButton"
-					type="save-and-close"
+					default-message="Save and close"
 					@clicked="newsId ? update(true) : create(true)"
 				/>
 				<div class="right" v-if="createdAt > 0">

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

@@ -351,15 +351,14 @@
 					/>
 					<save-button
 						ref="saveAndCloseButton"
-						type="save-and-close"
+						default-message="Save and close"
 						@clicked="save(song, false, true)"
 					/>
-					<button
-						class="button is-primary"
+					<save-button
+						ref="saveVerifyAndCloseButton"
+						default-message="Save, verify and close"
 						@click="save(song, true, true)"
-					>
-						Save, verify and close
-					</button>
+					/>
 
 					<button
 						class="button is-danger"
@@ -1004,7 +1003,9 @@ export default {
 			const song = JSON.parse(JSON.stringify(songToCopy));
 
 			let saveButtonRef = this.$refs.saveButton;
-			if (close) saveButtonRef = this.$refs.saveAndCloseButton;
+			if (close && !verify) saveButtonRef = this.$refs.saveAndCloseButton;
+			else if (close && verify)
+				saveButtonRef = this.$refs.saveVerifyAndCloseButton;
 
 			if (!this.youtubeError && this.youtubeVideoDuration === "0.000") {
 				saveButtonRef.handleFailedSave();

frontend/src/store/modules/admin.js

@@ -1,11 +1,8 @@
 /* eslint no-param-reassign: 0 */
 /* eslint-disable import/no-cycle */
 
-// import Vue from "vue";
 import admin from "@/api/admin/index";
 
-const Vue = {};
-
 const state = {};
 const getters = {};
 const actions = {};
@@ -38,7 +35,7 @@ const modules = {
 			updateSong(state, updatedSong) {
 				state.songs.forEach((song, index) => {
 					if (song._id === updatedSong._id)
-						Vue.set(state.songs, index, updatedSong);
+						this.set(state.songs, index, updatedSong);
 				});
 			}
 		}
@@ -69,7 +66,7 @@ const modules = {
 			updateSong(state, updatedSong) {
 				state.songs.forEach((song, index) => {
 					if (song._id === updatedSong._id)
-						Vue.set(state.songs, index, updatedSong);
+						this.set(state.songs, index, updatedSong);
 				});
 			}
 		}
@@ -100,7 +97,7 @@ const modules = {
 			updateSong(state, updatedSong) {
 				state.songs.forEach((song, index) => {
 					if (song._id === updatedSong._id)
-						Vue.set(state.songs, index, updatedSong);
+						this.set(state.songs, index, updatedSong);
 				});
 			}
 		}
@@ -187,7 +184,7 @@ const modules = {
 			updateNews(state, updatedNews) {
 				state.news.forEach((news, index) => {
 					if (news._id === updatedNews._id)
-						Vue.set(state.news, index, updatedNews);
+						this.set(state.news, index, updatedNews);
 				});
 			}
 		}