Added elaborate template switching.

components/stashes/heart.vue

@@ -17,7 +17,7 @@
 
 			<template #popper>
 				<StashMenu
-					:user="user"
+					:stashes="stashes"
 					:item-stashes="itemStashes"
 					@stash="(stash) => stashItem(stash)"
 					@unstash="(stash) => unstashItem(stash)"
@@ -53,10 +53,10 @@
 
 			<template v-else>
 				<Icon
-					v-if="itemStashes.some((itemStash) => itemStash.id === user.primaryStash.id)"
+					v-if="itemStashes.some((itemStash) => itemStash.id === primaryStash.id)"
 					icon="heart7"
 					class="heart favorited noselect"
-					@click.native.stop="unstashItem(user.primaryStash)"
+					@click.native.stop="unstashItem(primaryStash)"
 					@contextmenu.prevent="toggleShowStashes(true)"
 				/>
 
@@ -64,14 +64,14 @@
 					v-else
 					icon="heart8"
 					class="heart noselect"
-					@click.native.stop="stashItem(user.primaryStash)"
+					@click.native.stop="stashItem(primaryStash)"
 					@contextmenu.prevent="toggleShowStashes(true)"
 				/>
 			</template>
 
 			<template #popper>
 				<StashMenu
-					:user="user"
+					:stashes="stashes"
 					:item-stashes="itemStashes"
 					@stash="(stash) => stashItem(stash)"
 					@unstash="(stash) => unstashItem(stash)"
@@ -117,8 +117,10 @@ const emit = defineEmits(['stashed', 'unstashed']);
 
 const pageContext = inject('pageContext');
 const pageStash = pageContext.pageProps.stash;
+const user = pageContext.user;
 
-const user = ref(pageContext.user);
+const stashes = ref(pageContext.assets?.stashes);
+const primaryStash = pageContext.assets?.primaryStash;
 const itemStashes = ref(props.item.stashes);
 const hasSecondaryStash = computed(() => itemStashes.value.some((itemStash) => !itemStash.isPrimary));
 
@@ -195,9 +197,7 @@ function toggleShowStashes(state) {
 }
 
 async function reloadStashes(newStash) {
-	const profile = await get(`/users/${user.value.id}`);
-
-	user.value = profile;
+	stashes.value = await get(`/users/${user.id}/stashes`);
 
 	await stashItem(newStash);
 }

components/stashes/menu.vue

@@ -1,7 +1,7 @@
 <template>
 	<ul class="stash-menu nolist noselect">
 		<li
-			v-for="userStash in user.stashes"
+			v-for="userStash in stashes"
 			:key="`stash-${userStash.id}`"
 			class="menu-item"
 		>
@@ -30,9 +30,9 @@
 import Checkbox from '#/components/form/checkbox.vue';
 
 defineProps({
-	user: {
-		type: Object,
-		default: null,
+	stashes: {
+		type: Array,
+		default: () => [],
 	},
 	itemStashes: {
 		type: Array,

components/stashes/tile.vue

@@ -15,7 +15,7 @@
 			</a>
 
 			<Icon
-				v-if="!stash.public"
+				v-if="!stash.isPublic"
 				v-tooltip="'This stash is private'"
 				icon="eye-blocked"
 				class="private noselect"
@@ -31,7 +31,7 @@
 				<template #popper>
 					<ul class="stash-menu nolist">
 						<li
-							v-if="stash.public"
+							v-if="stash.isPublic"
 							class="menu-item"
 							@click="setPublic(false)"
 						>
@@ -158,7 +158,7 @@ async function setPublic(isPublic) {
 
 	done.value = false;
 
-	await patch(`/stashes/${props.stash.id}`, { public: isPublic }, {
+	await patch(`/stashes/${props.stash.id}`, { isPublic }, {
 		undoFeedback: !isPublic && `Stash '${props.stash.name}' set to private`,
 		successFeedback: isPublic && `Stash '${props.stash.name}' set to public`,
 		errorFeedback: 'Failed to update stash',