Added unidentified actors and actor count filters.

components/scenes/scenes.vue

@@ -12,6 +12,7 @@ import Campaign from '#/components/campaigns/campaign.vue';
 import ActorsFilter from '#/components/filters/actors.vue';
 import ChannelsFilter from '#/components/filters/channels.vue';
 import Filters from '#/components/filters/filters.vue';
+import GroupsFilter from '#/components/filters/groups.vue';
 
 import TagsFilter from '#/components/filters/tags.vue';
 import YearsFilter from '#/components/filters/years.vue';
@@ -23,6 +24,7 @@ import { get } from '#/src/api.js';
 import entityPrefixes from '#/src/entities-prefixes.js';
 import navigate from '#/src/navigate.js';
 import { getActorIdentifier, parseActorIdentifier } from '#/src/query.js';
+import { formatRange, parseRange } from '#/utils/parse-range.js';
 
 const props = defineProps({
 	showFilters: {
@@ -64,6 +66,7 @@ const aggActors = ref(pageProps.aggActors || []);
 const aggTags = ref(pageProps.aggTags || []);
 const aggActorTags = ref(pageProps.aggActorTags || []);
 const aggChannels = ref(pageProps.aggChannels || []);
+const aggActorCounts = ref(pageProps.aggActorCounts || null);
 
 const currentPage = ref(Number(routeParams.page));
 const scope = ref(routeParams.scope || props.defaultScope);
@@ -88,6 +91,10 @@ const filters = ref({
 	onlyActorTags: Object.hasOwn(urlParsed.search, 'at'),
 	entity: queryEntity,
 	actors: queryActors,
+	group: parseRange(urlParsed.search.group),
+	females: parseRange(urlParsed.search.females),
+	males: parseRange(urlParsed.search.males),
+	trans: parseRange(urlParsed.search.trans),
 });
 
 const sceneCampaign = campaigns?.scenes;
@@ -132,6 +139,10 @@ async function search(options = {}) {
 
 	const query = {
 		q: filters.value.search || undefined,
+		group: formatRange(filters.value.group),
+		females: formatRange(filters.value.females),
+		males: formatRange(filters.value.males),
+		trans: formatRange(filters.value.trans),
 	};
 
 	const entity = filters.value.entity || pageEntity;
@@ -168,6 +179,7 @@ async function search(options = {}) {
 	aggTags.value = res.aggTags;
 	aggActorTags.value = res.aggActorTags;
 	aggChannels.value = res.aggChannels;
+	aggActorCounts.value = res.aggActorCounts;
 
 	total.value = res.total;
 	loading.value = false;
@@ -248,6 +260,12 @@ function setView(newView) {
 					:actors="aggActors"
 					@update="updateFilter"
 				/>
+
+				<GroupsFilter
+					:filters="filters"
+					:counts="aggActorCounts"
+					@update="updateFilter"
+				/>
 			</Filters>
 		</transition>
 

components/scenes/tile.vue

@@ -92,16 +92,23 @@ const favorited = ref(props.scene.stashes.some((sceneStash) => sceneStash.id ===
 
 				<ul
 					class="row actors nolist"
-					:title="scene.actors.map((actor) => actor.name).join(', ')"
+					:title="scene.actors.map((actor) => actor.name || 'Unknown').join(', ')"
 				>
 					<li
 						v-for="actor in scene.actors"
 						:key="`actor-${scene.id}-${actor.id}`"
 						class="actor"
+						:class="{ unknown: actor.isUnknown }"
 					>
+						<span
+							v-if="actor.isUnknown"
+							class="actor-name"
+						>{{ ['Unknown', actor.gender].filter(Boolean).join(' ') }}</span>
+
 						<Link
+							v-else
 							:href="`/actor/${actor.id}/${actor.slug}`"
-							class="nolink"
+							class="actor-name nolink"
 						>{{ actor.name }}</Link>
 					</li>
 				</ul>
@@ -237,7 +244,7 @@ const favorited = ref(props.scene.stashes.some((sceneStash) => sceneStash.id ===
 	color: var(--shadow);
 }
 
-.actor:hover,
+.actor:not(.unknown):hover,
 .tag:hover {
 	color: var(--primary);
 }
@@ -255,6 +262,13 @@ const favorited = ref(props.scene.stashes.some((sceneStash) => sceneStash.id ===
 	}
 }
 
+.actor.unknown {
+	.actor-name,
+	&:not(:last-child)::after {
+		color: var(--glass);
+	}
+}
+
 .tags {
 	height: 1.25rem;
 	overflow: hidden;