From 512d82934662d41e8799994f667e00db443ae3d8 Mon Sep 17 00:00:00 2001
From: Harm Manders <harmmanders@gmail.com>
Date: Fri, 19 May 2023 20:35:51 +0200
Subject: [PATCH 1/8] import npc with custom spells

---
 src/components/ImportContent.vue        | 131 +++++++++++++++++++++---
 src/services/spells.js                  |  27 +++++
 src/store/modules/userContent/spells.js |  32 ++++++
 3 files changed, 176 insertions(+), 14 deletions(-)

diff --git a/src/components/ImportContent.vue b/src/components/ImportContent.vue
index d2519625..df9fdb92 100644
--- a/src/components/ImportContent.vue
+++ b/src/components/ImportContent.vue
@@ -53,30 +53,30 @@
 		</template>
 		<hk-loader v-else-if="!parsed" prefix="Validating" :title="type_label" />
 		<div v-else-if="!importing">
-			<template v-for="type in Object.keys(imports)">
-				<div v-if="imports[type].length" class="mb-4" :key="type">
+			<template v-for="import_type in Object.keys(imports)">
+				<div v-if="imports[import_type].length" class="mb-4" :key="import_type">
 					<p>
 						Found
-						<span :class="type === 'unique' ? 'green' : 'orange'">
-							{{ imports[type].length }} {{ type === "unique" ? "new" : "duplicate" }}
+						<span :class="import_type === 'unique' ? 'green' : 'orange'">
+							{{ imports[import_type].length }} {{ import_type === "unique" ? "new" : "duplicate" }}
 						</span>
 						{{ type_label }}
 					</p>
 					<q-table
-						class="sticky-header-table mb-2"
+						class="sticky-header-table mb-2 no-table-margin"
 						:virtual-scroll-sticky-size-start="48"
 						:dark="$store.getters.theme !== 'light'"
 						flat
 						dense
 						square
-						:data="imports[type]"
+						:data="imports[import_type]"
 						:columns="columns"
 						row-key="index"
 						virtual-scroll
 						:pagination.sync="pagination"
 						:rows-per-page-options="[0]"
 						selection="multiple"
-						:selected.sync="selected[type]"
+						:selected.sync="selected[import_type]"
 						hide-bottom
 					>
 						<template v-slot:body-cell-invalid="props">
@@ -102,13 +102,70 @@
 						</template>
 					</q-table>
 					<q-toggle
-						v-if="type === 'duplicate'"
+						v-if="import_type === 'duplicate'"
 						v-model="overwrite"
 						label="Overwrite duplicates"
 						unchecked-icon="none"
 					/>
 				</div>
 			</template>
+			<template v-if="Object.values(custom_spells).length">
+				<p>
+					Found
+					<span class="yellow"> {{ Object.values(custom_spells).length }}</span>
+					Custom Spells
+					<q-toggle
+						v-model="import_custom_spells"
+						label="Import custom spells"
+						unchecked-icon="none"
+					/>
+				</p>
+				<template v-if="import_custom_spells">
+					<q-table
+						class="sticky-header-table mb-2 no-table-margin"
+						:virtual-scroll-sticky-size-start="48"
+						:dark="$store.getters.theme !== 'light'"
+						flat
+						dense
+						square
+						virtual-scroll
+						:pagination.sync="pagination"
+						:rows-per-page-options="[0]"
+						:data="Object.values(custom_spells)"
+						:columns="columns"
+						row-key="index"
+						hide-bottom
+					>
+						<template v-slot:body-cell-invalid="props">
+							<td class="text-right">
+								<hk-popover v-if="props.row.errors" header="Validation errors">
+									<q-icon name="error" class="red" />
+									<div slot="content">
+										<ol class="px-3">
+											<li
+												v-for="(error, i) in props.row.errors"
+												:key="`${props.row.index}-error-${i}`"
+												class="red"
+											>
+												<strong v-if="error.instancePath" class="neutral-1">
+													{{ error.instancePath }}
+												</strong>
+												{{ error.message.capitalize() }}
+											</li>
+										</ol>
+									</div>
+								</hk-popover>
+							</td>
+						</template>
+					</q-table>
+					<div v-if="Object.keys(this.custom_spells).length > this.availableSpellSlots">
+						Insufficient spell slots. You're trying to import
+						<strong class="red">{{ Object.keys(this.custom_spells).length }}</strong> spells,<br />
+						but have only <strong class="red">{{ availableSpellSlots }}</strong> slots available.
+						You can still import the selected NPCs if you deselect
+					</div>
+				</template>
+			</template>
 			<div v-if="importTotal > availableSlots">
 				Insufficient slots. You're trying to import
 				<strong class="red">{{ importTotal }}</strong> {{ type_label }},<br />
@@ -256,6 +313,9 @@ export default {
 			overwrite: true,
 			parsing: false,
 			parsed: false,
+			map_old_to_custom: {},
+			custom_spells: {},
+			import_custom_spells: true,
 			failed_imports: [],
 			importing: undefined,
 			imported: 0,
@@ -310,6 +370,11 @@ export default {
 				? Infinity
 				: this.tier.benefits[this.type] - this.content_count;
 		},
+		availableSpellSlots() {
+			return this.tier.benefits["spells"] === "infinite"
+				? Infinity
+				: this.tier.benefits["spells"] - this.spell_count;
+		},
 		importTotal() {
 			return !this.overwrite
 				? this.selected.unique.length + this.selected.duplicate.length
@@ -321,7 +386,14 @@ export default {
 	},
 	methods: {
 		...mapActions("npcs", ["add_npc", "edit_npc", "get_npcs", "get_npc"]),
-		...mapActions("spells", ["add_spell", "edit_spell", "get_spells", "get_spell"]),
+		...mapActions("spells", [
+			"add_spell",
+			"edit_spell",
+			"get_spells",
+			"get_spell",
+			"get_spell_id_by_name",
+			"reserve_spell_id",
+		]),
 		async getItem(id) {
 			return this.type === "npcs"
 				? this.get_npc({ uid: this.uid, id })
@@ -370,7 +442,7 @@ export default {
 				let checkable_item = item;
 				// Parse versatile to options for NPCs
 				if (this.type === "npcs") {
-					checkable_item = this.removeCustomSpells(item);
+					checkable_item = await this.parseCustomSpells(item);
 					checkable_item = this.versatileToOptions(item);
 				}
 
@@ -410,6 +482,21 @@ export default {
 			this.parsed = true;
 		},
 		async importData() {
+			// First check if there are custom spells from imported NPCs that need to be added.
+			if (
+				this.import_custom_spells &&
+				this.custom_spells &&
+				Object.keys(this.custom_spells).length <= this.availableSpellSlots
+			) {
+				for (const [key, spell] of Object.entries(this.custom_spells)) {
+					try {
+						await this.edit_spell({ id: key, spell: spell });
+					} catch (error) {
+						this.failed_imports.push(spell);
+					}
+				}
+			}
+
 			if (this.importTotal <= this.availableSlots) {
 				this.importing = this.selected.unique.length + this.selected.duplicate.length;
 				for (const item of this.selected.unique) {
@@ -532,19 +619,32 @@ export default {
 			}
 			return npc;
 		},
-		removeCustomSpells(npc) {
-			delete npc.custom_spells;
+		async parseCustomSpells(npc) {
+			for (const [old_key, spell] of Object.entries(npc.custom_spells)) {
+				// Check if there already is a spell with name
+				let spell_id = await this.get_spell_id_by_name({ name: spell.name });
+				if (!spell_id) {
+					// Generate a id for the spell so when we can link the spell in NPC to a future spell
+					const new_spell_id = await this.reserve_spell_id();
+					spell_id = new_spell_id;
+					this.$set(this.custom_spells, spell_id, spell);
+				}
+
+				this.map_old_to_custom[old_key] = spell_id;
+			}
+
 			for (const spell_list_type of ["caster_spells", "innate_spells"]) {
 				if (npc[spell_list_type]) {
 					const spell_list = Object.assign({}, npc[spell_list_type]);
 					for (const [spell_key, spell] of Object.entries(spell_list)) {
-						if (spell.custom) {
+						if (spell.custom && spell_key in this.map_old_to_custom) {
+							npc[spell_list_type][this.map_old_to_custom[spell_key]] = { ...spell };
 							delete npc[spell_list_type][spell_key];
 						}
 					}
 				}
 			}
-
+			delete npc.custom_spells;
 			return npc;
 		},
 	},
@@ -555,4 +655,7 @@ export default {
 .q-expansion-item {
 	background-color: $neutral-9;
 }
+.no-table-margin::v-deep table {
+	margin-bottom: 0;
+}
 </style>
diff --git a/src/services/spells.js b/src/services/spells.js
index 24f8b390..dad9442c 100644
--- a/src/services/spells.js
+++ b/src/services/spells.js
@@ -60,6 +60,20 @@ export class SpellServices {
 		}
 	}
 
+	async getSearchSpellByName(uid, name) {
+		try {
+			const spell = await SEARCH_SPELLS_REF.child(uid)
+				.child("results")
+				.orderByChild("name")
+				.equalTo(name)
+				.get();
+
+			return spell.val();
+		} catch (error) {
+			throw error;
+		}
+	}
+
 	/**
 	 * Adds an spell to the 'custom_spells' ref and the 'search_custom_spells' ref.
 	 * Also updates the count metadata in 'search_custom_spells'
@@ -128,6 +142,19 @@ export class SpellServices {
 		}
 	}
 
+	/**
+	 * Reserve an ID for a spell that might be stored in the future
+	 * Useful when you don't know yet if you want to store a spell, but want to be able to link to it
+	 * from different db entries
+	 *
+	 * E.g. New NPC has Custom Spells that need to be stored, but you store both NPC and Spell at same time.
+	 *
+	 * @param {String} uid ID of active user
+	 */
+	async reserveSpellId(uid) {
+		return (await SPELLS_REF.child(uid).push()).key;
+	}
+
 	/**
 	 * Update spell_count in the search table of search_spells
 	 *
diff --git a/src/store/modules/userContent/spells.js b/src/store/modules/userContent/spells.js
index 76dbc9d3..d5fa5ae9 100644
--- a/src/store/modules/userContent/spells.js
+++ b/src/store/modules/userContent/spells.js
@@ -106,6 +106,23 @@ const spell_actions = {
 		return spell;
 	},
 
+	async get_spell_id_by_name({ rootGetters, dispatch }, { name }) {
+		console.log("store", name);
+		const uid = rootGetters.user ? rootGetters.user.uid : undefined;
+		if (uid) {
+			const services = await dispatch("get_spell_services");
+			try {
+				const spells = await services.getSearchSpellByName(uid, name);
+				if (spells === null) {
+					return null;
+				}
+				return Object.keys(spells)[0];
+			} catch (error) {
+				throw error;
+			}
+		}
+	},
+
 	/**
 	 * Adds a newly created SPELL for a user
 	 * A user can only add SPELLS for themselves so we use the uid from the store
@@ -189,6 +206,21 @@ const spell_actions = {
 		}
 	},
 
+	/**
+	 * Reserve Spell id for future usage
+	 */
+	async reserve_spell_id({ rootGetters, dispatch }) {
+		const uid = rootGetters.user ? rootGetters.user.uid : undefined;
+		if (uid) {
+			const services = await dispatch("get_spell_services");
+			try {
+				return await services.reserveSpellId(uid);
+			} catch (error) {
+				throw error;
+			}
+		}
+	},
+
 	clear_spell_store({ commit, rootGetters }) {
 		const uid = rootGetters.user ? rootGetters.user.uid : undefined;
 		if (uid) {

From 0bcc5da07ad103727efdf9be75aa0ffa608c8e76 Mon Sep 17 00:00:00 2001
From: Harm Manders <harmmanders@gmail.com>
Date: Fri, 19 May 2023 20:53:36 +0200
Subject: [PATCH 2/8] Clean spells before import

---
 src/components/ImportContent.vue        | 7 ++++++-
 src/store/modules/userContent/spells.js | 1 -
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/ImportContent.vue b/src/components/ImportContent.vue
index df9fdb92..e0c61eb2 100644
--- a/src/components/ImportContent.vue
+++ b/src/components/ImportContent.vue
@@ -443,7 +443,7 @@ export default {
 				// Parse versatile to options for NPCs
 				if (this.type === "npcs") {
 					checkable_item = await this.parseCustomSpells(item);
-					checkable_item = this.versatileToOptions(item);
+					checkable_item = this.versatileToOptions(checkable_item);
 				}
 
 				const valid = ajv.validate(this.schema, checkable_item);
@@ -488,8 +488,13 @@ export default {
 				this.custom_spells &&
 				Object.keys(this.custom_spells).length <= this.availableSpellSlots
 			) {
+				console.log("spells to add", this.custom_spells);
 				for (const [key, spell] of Object.entries(this.custom_spells)) {
 					try {
+						// TODO: use parse function to filter out spells
+						delete spell.key;
+						delete spell.updated;
+						delete spell.created;
 						await this.edit_spell({ id: key, spell: spell });
 					} catch (error) {
 						this.failed_imports.push(spell);
diff --git a/src/store/modules/userContent/spells.js b/src/store/modules/userContent/spells.js
index d5fa5ae9..767a5e19 100644
--- a/src/store/modules/userContent/spells.js
+++ b/src/store/modules/userContent/spells.js
@@ -107,7 +107,6 @@ const spell_actions = {
 	},
 
 	async get_spell_id_by_name({ rootGetters, dispatch }, { name }) {
-		console.log("store", name);
 		const uid = rootGetters.user ? rootGetters.user.uid : undefined;
 		if (uid) {
 			const services = await dispatch("get_spell_services");

From b75e73d0b2f7af52c56655d0ad12bf965f6a9d74 Mon Sep 17 00:00:00 2001
From: Harm Manders <harmmanders@gmail.com>
Date: Fri, 2 Jun 2023 12:07:55 +0200
Subject: [PATCH 3/8] added a patreon link

---
 src/components/ImportContent.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/ImportContent.vue b/src/components/ImportContent.vue
index e0c61eb2..eecda985 100644
--- a/src/components/ImportContent.vue
+++ b/src/components/ImportContent.vue
@@ -162,8 +162,11 @@
 						Insufficient spell slots. You're trying to import
 						<strong class="red">{{ Object.keys(this.custom_spells).length }}</strong> spells,<br />
 						but have only <strong class="red">{{ availableSpellSlots }}</strong> slots available.
-						You can still import the selected NPCs if you deselect
 					</div>
+					<router-link class="btn btn-sm bg-patreon-red my-2" to="/patreon">
+						<i aria-hidden="true" class="fab fa-patreon white mr-1" />
+						Get more slots
+					</router-link>
 				</template>
 			</template>
 			<div v-if="importTotal > availableSlots">

From 2bba062703f7ed12f435d765b153ef0dd1bcac4f Mon Sep 17 00:00:00 2001
From: Harm Manders <harmmanders@gmail.com>
Date: Fri, 2 Jun 2023 12:27:26 +0200
Subject: [PATCH 4/8] wrap support button in available spell slots option

---
 src/components/ImportContent.vue | 21 ++++++++++++---------
 1 file changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/components/ImportContent.vue b/src/components/ImportContent.vue
index eecda985..75d44aeb 100644
--- a/src/components/ImportContent.vue
+++ b/src/components/ImportContent.vue
@@ -158,15 +158,18 @@
 							</td>
 						</template>
 					</q-table>
-					<div v-if="Object.keys(this.custom_spells).length > this.availableSpellSlots">
-						Insufficient spell slots. You're trying to import
-						<strong class="red">{{ Object.keys(this.custom_spells).length }}</strong> spells,<br />
-						but have only <strong class="red">{{ availableSpellSlots }}</strong> slots available.
-					</div>
-					<router-link class="btn btn-sm bg-patreon-red my-2" to="/patreon">
-						<i aria-hidden="true" class="fab fa-patreon white mr-1" />
-						Get more slots
-					</router-link>
+					<template v-if="Object.keys(this.custom_spells).length > this.availableSpellSlots">
+						<div>
+							Insufficient spell slots. You're trying to import
+							<strong class="red">{{ Object.keys(this.custom_spells).length }}</strong>
+							spells,<br />
+							but have only <strong class="red">{{ availableSpellSlots }}</strong> slots available.
+						</div>
+						<router-link class="btn btn-sm bg-patreon-red my-2" to="/patreon">
+							<i aria-hidden="true" class="fab fa-patreon white mr-1" />
+							Get more slots
+						</router-link>
+					</template>
 				</template>
 			</template>
 			<div v-if="importTotal > availableSlots">

From 388577c6008ccc61a8cac461a300255172738c20 Mon Sep 17 00:00:00 2001
From: Key <keyroos@gmail.com>
Date: Fri, 2 Jun 2023 13:01:05 +0200
Subject: [PATCH 5/8] Clear spell store on sign out

---
 src/store/modules/user.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/store/modules/user.js b/src/store/modules/user.js
index 4e69c853..cae907eb 100644
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@@ -390,7 +390,7 @@ const user_actions = {
 		await dispatch("npcs/clear_npc_store", {}, { root: true });
 		await dispatch("reminders/clear_reminder_store", {}, { root: true });
 		await dispatch("items/clear_item_store", {}, { root: true });
-		await dispatch("items/clear_spell_store", {}, { root: true });
+		await dispatch("spells/clear_spell_store", {}, { root: true });
 		await commit("CLEAR_USER", undefined);
 
 		// Sign out from firebase

From 5c1abbaaadedfe0412fd505a1f895e50dae19afd Mon Sep 17 00:00:00 2001
From: Key <keyroos@gmail.com>
Date: Fri, 2 Jun 2023 13:45:10 +0200
Subject: [PATCH 6/8] update_spell_count function added to spell store

---
 src/store/modules/userContent/spells.js | 25 +++++++++++++++++++------
 1 file changed, 19 insertions(+), 6 deletions(-)

diff --git a/src/store/modules/userContent/spells.js b/src/store/modules/userContent/spells.js
index 767a5e19..a30a3fa0 100644
--- a/src/store/modules/userContent/spells.js
+++ b/src/store/modules/userContent/spells.js
@@ -146,9 +146,7 @@ const spell_actions = {
 				commit("SET_SPELL", { id, search_spell });
 				commit("SET_CACHED_SPELL", { uid, id, spell });
 
-				const new_count = await services.updateSpellCount(uid, 1);
-				commit("SET_SPELL_COUNT", new_count);
-				dispatch("checkEncumbrance", "", { root: true });
+				await dispatch("update_spell_count", 1);
 				return id;
 			} catch (error) {
 				throw error;
@@ -195,9 +193,7 @@ const spell_actions = {
 				commit("REMOVE_SPELL", id);
 				commit("REMOVE_CACHED_SPELL", { uid, id });
 
-				const new_count = await services.updateSpellCount(uid, -1);
-				commit("SET_SPELL_COUNT", new_count);
-				dispatch("checkEncumbrance", "", { root: true });
+				await dispatch("update_spell_count", -1);
 				return;
 			} catch (error) {
 				throw error;
@@ -205,6 +201,23 @@ const spell_actions = {
 		}
 	},
 
+	/**
+	 * Update spell count
+	 */
+	async update_spell_count({ rootGetters, dispatch, commit }, value) {
+		const uid = rootGetters.user ? rootGetters.user.uid : undefined;
+		if (uid) {
+			const services = await dispatch("get_spell_services");
+			try {
+				const new_count = await services.updateSpellCount(uid, value);
+				commit("SET_SPELL_COUNT", new_count);
+				dispatch("checkEncumbrance", "", { root: true });
+			} catch(error) {
+				throw(error);
+			}
+		}
+	},
+
 	/**
 	 * Reserve Spell id for future usage
 	 */

From 30029b6e2f20cd4759d58a671f352969c677aeff Mon Sep 17 00:00:00 2001
From: Harm Manders <harmmanders@gmail.com>
Date: Fri, 2 Jun 2023 14:52:20 +0200
Subject: [PATCH 7/8] spell validation and import multiple npcs with spells

---
 src/components/ImportContent.vue        | 56 ++++++++++++++-----------
 src/services/spells.js                  | 15 +++++--
 src/store/modules/userContent/spells.js |  8 ++--
 src/views/UserContent/Npcs/Npcs.vue     |  2 +-
 4 files changed, 48 insertions(+), 33 deletions(-)

diff --git a/src/components/ImportContent.vue b/src/components/ImportContent.vue
index 75d44aeb..86feb5b5 100644
--- a/src/components/ImportContent.vue
+++ b/src/components/ImportContent.vue
@@ -494,14 +494,10 @@ export default {
 				this.custom_spells &&
 				Object.keys(this.custom_spells).length <= this.availableSpellSlots
 			) {
-				console.log("spells to add", this.custom_spells);
 				for (const [key, spell] of Object.entries(this.custom_spells)) {
 					try {
 						// TODO: use parse function to filter out spells
-						delete spell.key;
-						delete spell.updated;
-						delete spell.created;
-						await this.edit_spell({ id: key, spell: spell });
+						await this.add_spell({ spell: spell, predefined_key: key });
 					} catch (error) {
 						this.failed_imports.push(spell);
 					}
@@ -631,31 +627,43 @@ export default {
 			return npc;
 		},
 		async parseCustomSpells(npc) {
-			for (const [old_key, spell] of Object.entries(npc.custom_spells)) {
-				// Check if there already is a spell with name
-				let spell_id = await this.get_spell_id_by_name({ name: spell.name });
-				if (!spell_id) {
-					// Generate a id for the spell so when we can link the spell in NPC to a future spell
-					const new_spell_id = await this.reserve_spell_id();
-					spell_id = new_spell_id;
-					this.$set(this.custom_spells, spell_id, spell);
-				}
+			if (npc.custom_spells) {
+				for (const [old_key, spell] of Object.entries(npc.custom_spells)) {
+					// Check if there already is a spell with name
+					delete spell.key;
+					delete spell.updated;
+					delete spell.created;
+					const valid = ajv.validate(spellSchema, spell);
+					if (!valid) {
+						spell.errors = ajv.errors;
+					}
+					// Check if spell is already known to importer
+					if (!Object.keys(this.map_old_to_custom).includes(old_key)) {
+						let spell_id = await this.get_spell_id_by_name({ name: spell.name });
+						if (!spell_id) {
+							// Generate a id for the spell so when we can link the spell in NPC to a future spell
+							const new_spell_id = await this.reserve_spell_id();
+							spell_id = new_spell_id;
+							this.$set(this.custom_spells, spell_id, spell);
+						}
 
-				this.map_old_to_custom[old_key] = spell_id;
-			}
+						this.map_old_to_custom[old_key] = spell_id;
+					}
+				}
 
-			for (const spell_list_type of ["caster_spells", "innate_spells"]) {
-				if (npc[spell_list_type]) {
-					const spell_list = Object.assign({}, npc[spell_list_type]);
-					for (const [spell_key, spell] of Object.entries(spell_list)) {
-						if (spell.custom && spell_key in this.map_old_to_custom) {
-							npc[spell_list_type][this.map_old_to_custom[spell_key]] = { ...spell };
-							delete npc[spell_list_type][spell_key];
+				for (const spell_list_type of ["caster_spells", "innate_spells"]) {
+					if (npc[spell_list_type]) {
+						const spell_list = Object.assign({}, npc[spell_list_type]);
+						for (const [spell_key, spell] of Object.entries(spell_list)) {
+							if (spell.custom && spell_key in this.map_old_to_custom) {
+								npc[spell_list_type][this.map_old_to_custom[spell_key]] = { ...spell };
+								delete npc[spell_list_type][spell_key];
+							}
 						}
 					}
 				}
+				delete npc.custom_spells;
 			}
-			delete npc.custom_spells;
 			return npc;
 		},
 	},
diff --git a/src/services/spells.js b/src/services/spells.js
index dad9442c..2119a3ac 100644
--- a/src/services/spells.js
+++ b/src/services/spells.js
@@ -84,18 +84,25 @@ export class SpellServices {
 	 * @param {Object} search_spell Compressed spell
 	 * @returns Key of the newly added spell
 	 */
-	async addSpell(uid, spell, search_spell) {
+	async addSpell(uid, spell, search_spell, predefined_key = undefined) {
 		try {
 			spell.name = spell.name.toLowerCase();
-			const newSpell = await SPELLS_REF.child(uid).push(spell);
 
 			spell.created = firebase.database.ServerValue.TIMESTAMP;
 			spell.updated = firebase.database.ServerValue.TIMESTAMP;
 
+			let spell_key = predefined_key;
+			if (predefined_key) {
+				await SPELLS_REF.child(uid).child(predefined_key).set(spell);
+			} else {
+				newSpell = await SPELLS_REF.child(uid).push(spell);
+				spell_key = newSpell.key;
+			}
+
 			// Update search_spells
-			SEARCH_SPELLS_REF.child(`${uid}/results/${newSpell.key}`).set(search_spell);
+			SEARCH_SPELLS_REF.child(`${uid}/results/${spell_key}`).set(search_spell);
 
-			return newSpell.key;
+			return spell_key;
 		} catch (error) {
 			throw error;
 		}
diff --git a/src/store/modules/userContent/spells.js b/src/store/modules/userContent/spells.js
index a30a3fa0..e4eb5653 100644
--- a/src/store/modules/userContent/spells.js
+++ b/src/store/modules/userContent/spells.js
@@ -129,7 +129,7 @@ const spell_actions = {
 	 * @param {object} spell
 	 * @returns {string} the id of the newly added spell
 	 */
-	async add_spell({ rootGetters, commit, dispatch }, spell) {
+	async add_spell({ rootGetters, commit, dispatch }, { spell, predefined_key }) {
 		const uid = rootGetters.user ? rootGetters.user.uid : undefined;
 		const available_slots = rootGetters.tier.benefits.spells;
 
@@ -142,7 +142,7 @@ const spell_actions = {
 			}
 			try {
 				const search_spell = convert_spell(spell);
-				const id = await services.addSpell(uid, spell, search_spell);
+				const id = await services.addSpell(uid, spell, search_spell, predefined_key);
 				commit("SET_SPELL", { id, search_spell });
 				commit("SET_CACHED_SPELL", { uid, id, spell });
 
@@ -212,8 +212,8 @@ const spell_actions = {
 				const new_count = await services.updateSpellCount(uid, value);
 				commit("SET_SPELL_COUNT", new_count);
 				dispatch("checkEncumbrance", "", { root: true });
-			} catch(error) {
-				throw(error);
+			} catch (error) {
+				throw error;
 			}
 		}
 	},
diff --git a/src/views/UserContent/Npcs/Npcs.vue b/src/views/UserContent/Npcs/Npcs.vue
index fadbdc8c..81a955d0 100644
--- a/src/views/UserContent/Npcs/Npcs.vue
+++ b/src/views/UserContent/Npcs/Npcs.vue
@@ -249,7 +249,7 @@ export default {
 			const all_npcs = await this.get_full_npcs();
 			for (const key in all_npcs) {
 				all_npcs[key].harmless_key = key;
-				this.addCustomSpellToExport(all_npcs[key]);
+				await this.addCustomSpellToExport(all_npcs[key]);
 			}
 
 			const json_export = Object.values(all_npcs);

From 26164c9907b2b3ad8a294fe8cdb2126274409471 Mon Sep 17 00:00:00 2001
From: Harm Manders <harmmanders@gmail.com>
Date: Fri, 2 Jun 2023 15:14:11 +0200
Subject: [PATCH 8/8] add spell fixed

---
 src/components/ImportContent.vue           | 2 +-
 src/services/spells.js                     | 2 +-
 src/store/modules/userContent/spells.js    | 1 +
 src/views/UserContent/Spells/EditSpell.vue | 2 +-
 4 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/ImportContent.vue b/src/components/ImportContent.vue
index 86feb5b5..f52dd0bb 100644
--- a/src/components/ImportContent.vue
+++ b/src/components/ImportContent.vue
@@ -406,7 +406,7 @@ export default {
 				: this.get_spell({ uid: this.uid, id });
 		},
 		async addItem(item) {
-			this.type === "npcs" ? await this.add_npc(item) : await this.add_spell(item);
+			this.type === "npcs" ? await this.add_npc(item) : await this.add_spell({ spell: item });
 		},
 		async editItem(id, item) {
 			this.type === "npcs"
diff --git a/src/services/spells.js b/src/services/spells.js
index 2119a3ac..9802c94d 100644
--- a/src/services/spells.js
+++ b/src/services/spells.js
@@ -95,7 +95,7 @@ export class SpellServices {
 			if (predefined_key) {
 				await SPELLS_REF.child(uid).child(predefined_key).set(spell);
 			} else {
-				newSpell = await SPELLS_REF.child(uid).push(spell);
+				const newSpell = await SPELLS_REF.child(uid).push(spell);
 				spell_key = newSpell.key;
 			}
 
diff --git a/src/store/modules/userContent/spells.js b/src/store/modules/userContent/spells.js
index e4eb5653..0a43be4b 100644
--- a/src/store/modules/userContent/spells.js
+++ b/src/store/modules/userContent/spells.js
@@ -141,6 +141,7 @@ const spell_actions = {
 				return "Not enough slots";
 			}
 			try {
+				console.log(spell);
 				const search_spell = convert_spell(spell);
 				const id = await services.addSpell(uid, spell, search_spell, predefined_key);
 				commit("SET_SPELL", { id, search_spell });
diff --git a/src/views/UserContent/Spells/EditSpell.vue b/src/views/UserContent/Spells/EditSpell.vue
index d42d8e43..353adf7e 100644
--- a/src/views/UserContent/Spells/EditSpell.vue
+++ b/src/views/UserContent/Spells/EditSpell.vue
@@ -163,7 +163,7 @@ export default {
 		},
 		addSpell() {
 			console.log(this.spell);
-			this.add_spell(this.spell)
+			this.add_spell({ spell: this.spell })
 				.then((key) => {
 					// Set the spellId, so we know there is an existing spell
 					// even though we are on the AddSpell route, this we won't create multiple when hitting save again