From 731a2792c5ab53f7ece62bf69c81f595c59663dc Mon Sep 17 00:00:00 2001
From: DebaucheryLibrarian <moonloop.adult@protonmail.com>
Date: Fri, 19 Mar 2021 03:27:48 +0100
Subject: [PATCH] Added favorite stash heart to scene tiles.

---
 assets/components/actors/actor.vue        |  6 ++-
 assets/components/entities/entity.vue     | 12 +++--
 assets/components/home/home.vue           | 12 +++--
 assets/components/releases/release.vue    |  9 +---
 assets/components/releases/releases.vue   |  3 ++
 assets/components/releases/scene-tile.vue | 65 +++++++++++++++++++++--
 assets/components/tags/tag.vue            | 10 ++--
 assets/js/entities/actions.js             |  4 ++
 assets/js/fragments.js                    | 17 ++++++
 assets/js/releases/actions.js             |  4 ++
 assets/js/stashes/actions.js              |  6 ++-
 assets/js/tags/actions.js                 |  4 ++
 assets/js/users/actions.js                |  6 ++-
 src/web/plugins/plugins.js                |  4 +-
 src/web/plugins/releases.js               | 12 +++--
 15 files changed, 146 insertions(+), 28 deletions(-)

diff --git a/assets/components/actors/actor.vue b/assets/components/actors/actor.vue
index 45186f98..cab43689 100644
--- a/assets/components/actors/actor.vue
+++ b/assets/components/actors/actor.vue
@@ -365,7 +365,11 @@
 					:available-actors="actor.actors"
 				/>
 
-				<Releases :releases="releases" />
+				<Releases
+					:releases="releases"
+					@stash="fetchActor(false)"
+					@unstash="fetchActor(false)"
+				/>
 
 				<Pagination
 					:items-total="totalCount"
diff --git a/assets/components/entities/entity.vue b/assets/components/entities/entity.vue
index c5e3efa4..edb719a5 100644
--- a/assets/components/entities/entity.vue
+++ b/assets/components/entities/entity.vue
@@ -99,7 +99,11 @@
 			/>
 
 			<div class="releases">
-				<Releases :releases="entity.releases" />
+				<Releases
+					:releases="entity.releases"
+					@stash="fetchEntity(false)"
+					@unstash="fetchEntity(false)"
+				/>
 
 				<Pagination
 					:items-total="totalCount"
@@ -120,7 +124,7 @@ import Releases from '../releases/releases.vue';
 import Children from './children.vue';
 import Scroll from '../scroll/scroll.vue';
 
-async function fetchEntity() {
+async function fetchEntity(scroll = true) {
 	const { entity, totalCount } = await this.$store.dispatch('fetchEntityBySlugAndType', {
 		entitySlug: this.$route.params.entitySlug,
 		entityType: this.$route.name,
@@ -134,7 +138,9 @@ async function fetchEntity() {
 
 	this.pageTitle = entity.name;
 
-	this.$refs.filter.$el.scrollIntoView();
+	if (scroll) {
+		this.$refs.filter.$el.scrollIntoView();
+	}
 }
 
 async function mounted() {
diff --git a/assets/components/home/home.vue b/assets/components/home/home.vue
index 57e216c6..7d886627 100644
--- a/assets/components/home/home.vue
+++ b/assets/components/home/home.vue
@@ -10,7 +10,11 @@
 				:content="$refs.content"
 			/>
 
-			<Releases :releases="releases" />
+			<Releases
+				:releases="releases"
+				@stash="fetchReleases(false)"
+				@unstash="fetchReleases(false)"
+			/>
 
 			<Pagination
 				v-if="totalCount > 0"
@@ -29,7 +33,7 @@ import FilterBar from '../filters/filter-bar.vue';
 import Releases from '../releases/releases.vue';
 import Pagination from '../pagination/pagination.vue';
 
-async function fetchReleases() {
+async function fetchReleases(scroll = true) {
 	const { releases, totalCount } = await this.$store.dispatch('fetchReleases', {
 		limit: this.limit,
 		range: this.$route.params.range,
@@ -39,7 +43,9 @@ async function fetchReleases() {
 	this.totalCount = totalCount;
 	this.releases = releases;
 
-	this.$refs.filter?.$el.scrollIntoView();
+	if (scroll) {
+		this.$refs.filter?.$el.scrollIntoView();
+	}
 }
 
 async function mounted() {
diff --git a/assets/components/releases/release.vue b/assets/components/releases/release.vue
index 220ace6c..28ad1fc0 100644
--- a/assets/components/releases/release.vue
+++ b/assets/components/releases/release.vue
@@ -52,14 +52,14 @@
 				</h2>
 
 				<Icon
-					v-show="me && isStashed"
+					v-show="me && release.isStashed"
 					icon="heart7"
 					class="stash stashed noselect"
 					@click="unstashScene"
 				/>
 
 				<Icon
-					v-show="me && !isStashed"
+					v-show="me && !release.isStashed"
 					icon="heart8"
 					class="stash unstashed noselect"
 					@click="stashScene"
@@ -275,10 +275,6 @@ function me() {
 	return this.$store.state.auth.user;
 }
 
-function isStashed() {
-	return this.release.stashes?.length > 0;
-}
-
 function bannerBackground() {
 	return (this.release.poster && this.getBgPath(this.release.poster, 'thumbnail'))
 		|| (this.release.covers.length > 0 && this.getBgPath(this.release.covers[0], 'thumbnail'));
@@ -313,7 +309,6 @@ export default {
 	computed: {
 		pageTitle,
 		bannerBackground,
-		isStashed,
 		me,
 		showAlbum,
 	},
diff --git a/assets/components/releases/releases.vue b/assets/components/releases/releases.vue
index 77d62a81..261524ac 100644
--- a/assets/components/releases/releases.vue
+++ b/assets/components/releases/releases.vue
@@ -18,6 +18,8 @@
 					:release="release"
 					:referer="referer"
 					:index="index"
+					@stash="$emit('stash')"
+					@unstash="$emit('unstash')"
 				/>
 			</li>
 		</ul>
@@ -63,6 +65,7 @@ export default {
 			default: null,
 		},
 	},
+	emits: ['stash', 'unstash'],
 	computed: {
 		range,
 		sfw,
diff --git a/assets/components/releases/scene-tile.vue b/assets/components/releases/scene-tile.vue
index 2be75d54..3d17d5e7 100644
--- a/assets/components/releases/scene-tile.vue
+++ b/assets/components/releases/scene-tile.vue
@@ -40,6 +40,20 @@
 						:title="release.title"
 						class="thumbnail unavailable"
 					><Icon icon="blocked" />No thumbnail available</div>
+
+					<Icon
+						v-show="release.isStashed"
+						icon="heart7"
+						class="stash stashed"
+						@click.prevent.native="unstashScene"
+					/>
+
+					<Icon
+						v-show="release.isStashed === false"
+						icon="heart8"
+						class="stash unstashed"
+						@click.prevent.native="stashScene"
+					/>
 				</a>
 			</span>
 
@@ -133,6 +147,24 @@
 <script>
 import Details from './tile-details.vue';
 
+async function stashScene() {
+	this.$store.dispatch('stashScene', {
+		sceneId: this.release.id,
+		stashId: this.$store.getters.favorites.id,
+	});
+
+	this.$emit('stash');
+}
+
+async function unstashScene() {
+	this.$store.dispatch('unstashScene', {
+		sceneId: this.release.id,
+		stashId: this.$store.getters.favorites.id,
+	});
+
+	this.$emit('unstash');
+}
+
 export default {
 	components: {
 		Details,
@@ -143,6 +175,11 @@ export default {
 			default: null,
 		},
 	},
+	emits: ['stash', 'unstash'],
+	methods: {
+		stashScene,
+		unstashScene,
+	},
 };
 </script>
 
@@ -167,13 +204,17 @@ export default {
 		width: 1rem;
 		height: 1rem;
 		box-sizing: border-box;
-		padding: .1rem;
+		padding: .375rem .25rem;
 		border-radius: 0 0 .5rem 0;
-		color: var(--text-light);
-		background: var(--primary);
-		font-size: .8rem;
+		color: var(--primary);
+		font-size: 1rem;
 		font-weight: bold;
 		line-height: 1;
+		text-shadow: 0 0 2px var(--darken-weak);
+	}
+
+	&:hover .unstashed {
+		fill: var(--lighten);
 	}
 }
 
@@ -216,6 +257,22 @@ export default {
 	}
 }
 
+.stash {
+	width: 1.25rem;
+	height: 1.25rem;
+	position: absolute;
+	top: 0;
+	right: 0;
+	padding: .25rem .25rem .5rem .5rem;
+	filter: drop-shadow(0 0 2px var(--darken-weak));
+	fill: var(--lighten-weak);
+
+	&:hover.unstashed,
+	&.stashed {
+		fill: var(--primary);
+	}
+}
+
 .row {
     display: flex;
     justify-content: space-between;
diff --git a/assets/components/tags/tag.vue b/assets/components/tags/tag.vue
index 22323a04..c2e52c7c 100644
--- a/assets/components/tags/tag.vue
+++ b/assets/components/tags/tag.vue
@@ -49,7 +49,11 @@
 				:fetch-releases="fetchReleases"
 			/>
 
-			<Releases :releases="releases" />
+			<Releases
+				:releases="releases"
+				@stash="fetchReleases(false)"
+				@unstash="fetchReleases(false)"
+			/>
 
 			<Pagination
 				:items-total="totalCount"
@@ -76,7 +80,7 @@ import Scroll from '../scroll/scroll.vue';
 
 const converter = new Converter();
 
-async function fetchReleases() {
+async function fetchReleases(scroll = true) {
 	const { tag, releases, totalCount } = await this.$store.dispatch('fetchTagBySlug', {
 		tagSlug: this.$route.params.tagSlug,
 		pageNumber: Number(this.$route.params.pageNumber),
@@ -91,7 +95,7 @@ async function fetchReleases() {
 	this.hasMedia = this.tag.poster || this.tag.photos.length > 0;
 	this.description = this.tag.description && converter.makeHtml(escapeHtml(this.tag.description));
 
-	if (this.$refs.filter) {
+	if (scroll && this.$refs.filter) {
 		this.$refs.filter.$el.scrollIntoView();
 	}
 }
diff --git a/assets/js/entities/actions.js b/assets/js/entities/actions.js
index 3b28d362..c9705bb3 100644
--- a/assets/js/entities/actions.js
+++ b/assets/js/entities/actions.js
@@ -26,6 +26,8 @@ function initEntitiesActions(store, router) {
                 $beforeTime: Datetime = "2100-01-01",
                 $orderBy: [ReleasesOrderBy!]
                 $exclude: [String!]
+				$hasAuth: Boolean!
+				$userId: Int
             ) {
 				entity: entityBySlugAndType(slug: $entitySlug, type: $entityType) {
                     id
@@ -160,6 +162,8 @@ function initEntitiesActions(store, router) {
 			afterTime: store.getters.after,
 			beforeTime: store.getters.before,
 			exclude: store.state.ui.tagFilter,
+			hasAuth: !!store.state.auth.user,
+			userId: store.state.auth.user?.id,
 		});
 
 		if (!entity) {
diff --git a/assets/js/fragments.js b/assets/js/fragments.js
index 3b35b7f1..0b5024ca 100644
--- a/assets/js/fragments.js
+++ b/assets/js/fragments.js
@@ -228,6 +228,22 @@ const releaseFields = `
         url
     }
     isNew
+	isStashed
+	stashes: stashesScenesBySceneId(
+		filter: {
+			stash: {
+				userId: {
+					equalTo: $userId
+				}
+			}
+		}
+	) @include(if: $hasAuth) {
+		stash {
+			id
+			name
+			slug
+		}
+	}
 `;
 
 const releasesFragment = `
@@ -352,6 +368,7 @@ const releaseFragment = `
 			}
 		}
 	}
+	isStashed
 	stashes: stashesScenesBySceneId(
 		filter: {
 			stash: {
diff --git a/assets/js/releases/actions.js b/assets/js/releases/actions.js
index 48a9332c..ea85e3c3 100644
--- a/assets/js/releases/actions.js
+++ b/assets/js/releases/actions.js
@@ -9,6 +9,8 @@ function initReleasesActions(store, router) {
 
 		const { connection: { releases, totalCount } } = await graphql(`
             query Releases(
+				$hasAuth: Boolean!
+				$userId: Int
                 $limit:Int = 1000,
                 $offset:Int = 0,
                 $after:Datetime = "1900-01-01 00:00:00",
@@ -19,6 +21,8 @@ function initReleasesActions(store, router) {
                 ${releasesFragment}
             }
         `, {
+			hasAuth: !!store.state.auth.user,
+			userId: store.state.auth.user?.id,
 			limit,
 			offset: Math.max(0, (pageNumber - 1)) * limit,
 			after,
diff --git a/assets/js/stashes/actions.js b/assets/js/stashes/actions.js
index 7f28dd38..438148f3 100644
--- a/assets/js/stashes/actions.js
+++ b/assets/js/stashes/actions.js
@@ -2,11 +2,13 @@ import { graphql, post, del } from '../api';
 import { releaseFields } from '../fragments';
 import { curateStash } from '../curate';
 
-function initStashesActions(_store, _router) {
+function initStashesActions(store, _router) {
 	async function fetchStash(context, stashId) {
 		const { stash } = await graphql(`
 			query Stash(
 				$stashId: Int!
+				$hasAuth: Boolean!
+				$userId: Int
 			) {
 				stash(id: $stashId) {
 					id
@@ -52,6 +54,8 @@ function initStashesActions(_store, _router) {
 			}
 		`, {
 			stashId: Number(stashId),
+			hasAuth: !!store.state.auth.user,
+			userId: store.state.auth.user?.id,
 		});
 
 		return curateStash(stash);
diff --git a/assets/js/tags/actions.js b/assets/js/tags/actions.js
index 98c8ffeb..d159efa0 100644
--- a/assets/js/tags/actions.js
+++ b/assets/js/tags/actions.js
@@ -23,6 +23,8 @@ function initTagsActions(store, _router) {
                 $before:Datetime = "2100-01-01",
                 $orderBy: [ReleasesOrderBy!],
                 $exclude: [String!]
+				$hasAuth: Boolean!
+				$userId: Int
             ) {
                 tagBySlug(slug:$tagSlug) {
                     id
@@ -136,6 +138,8 @@ function initTagsActions(store, _router) {
 			orderBy,
 			offset: Math.max(0, (pageNumber - 1)) * limit,
 			exclude: store.state.ui.tagFilter.filter(tagFilter => tagFilter !== tagSlug),
+			hasAuth: !!store.state.auth.user,
+			userId: store.state.auth.user?.id,
 		});
 
 		return {
diff --git a/assets/js/users/actions.js b/assets/js/users/actions.js
index 1fd5ec64..4b1f715c 100644
--- a/assets/js/users/actions.js
+++ b/assets/js/users/actions.js
@@ -2,10 +2,12 @@ import { graphql } from '../api';
 import { releaseFields } from '../fragments';
 import { curateUser } from '../curate';
 
-function initUsersActions(_store, _router) {
+function initUsersActions(store, _router) {
 	async function fetchUser(context, username) {
 		const { user } = await graphql(`
 			query User(
+				$hasAuth: Boolean!
+				$userId: Int
 				$username: String!
 			) {
 				user: userByUsername(username: $username) {
@@ -52,6 +54,8 @@ function initUsersActions(_store, _router) {
 				}
 			}
 		`, {
+			hasAuth: !!store.state.auth.user,
+			userId: store.state.auth.user?.id,
 			username,
 		});
 
diff --git a/src/web/plugins/plugins.js b/src/web/plugins/plugins.js
index 3920ccf3..36e97fba 100644
--- a/src/web/plugins/plugins.js
+++ b/src/web/plugins/plugins.js
@@ -2,12 +2,12 @@
 
 const ActorPlugins = require('./actors');
 const SitePlugins = require('./sites');
-// const ReleasePlugins = require('./releases');
+const ReleasePlugins = require('./releases');
 const MediaPlugins = require('./media');
 
 module.exports = {
 	ActorPlugins,
 	SitePlugins,
-	ReleasePlugins: [],
+	ReleasePlugins,
 	MediaPlugins,
 };
diff --git a/src/web/plugins/releases.js b/src/web/plugins/releases.js
index 9ff05f63..ef5f77c1 100644
--- a/src/web/plugins/releases.js
+++ b/src/web/plugins/releases.js
@@ -4,12 +4,18 @@ const { makeExtendSchemaPlugin, gql } = require('graphile-utils');
 
 const schemaExtender = makeExtendSchemaPlugin(_build => ({
 	typeDefs: gql`
-      extend type Release {}
+	  extend type Release {
+		isStashed: Boolean @requires(columns: ["stashesScenesBySceneId"])
+	  }
     `,
 	resolvers: {
 		Release: {
-			async foo(_parent, _args, _context, _info) {
-				// template
+			isStashed(parent) {
+				if (!parent['@stashes']) {
+					return null;
+				}
+
+				return parent['@stashes'].length > 0;
 			},
 		},
 	},