Added toggle to select actor tags or all tags in filters.

components/filters/tags.vue

@@ -12,14 +12,30 @@
 				<Icon icon="search" />
 			</label>
 
+			<div
+				v-show="showActorTags"
+				v-tooltip="'Tags relevant to the selected actors'"
+				class="filter-sort order noselect"
+				@click="showActorTags = false"
+			>
+				<Icon icon="user-tags" />
+			</div>
+
+			<div
+				v-show="!showActorTags"
+				v-tooltip="'All tags'"
+				class="filter-sort order noselect"
+				@click="showActorTags = true"
+			>
+				<Icon icon="price-tags" />
+			</div>
+
 			<div
 				v-show="order === 'priority'"
 				class="filter-sort order noselect"
 				@click="order = 'count'"
 			>
-				<Icon
-					icon="star"
-				/>
+				<Icon icon="star" />
 			</div>
 
 			<div
@@ -115,16 +131,21 @@ const props = defineProps({
 		type: Array,
 		default: () => [],
 	},
+	actorTags: {
+		type: Array,
+		default: () => [],
+	},
 });
 
 const emit = defineEmits(['update']);
 
+const { pageProps } = inject('pageContext');
+const { tag: pageTag, actor: pageActor } = pageProps;
+
 const search = ref('');
 const searchRegexp = computed(() => new RegExp(search.value, 'i'));
 const order = ref('priority');
-
-const { pageProps } = inject('pageContext');
-const { tag: pageTag } = pageProps;
+const showActorTags = ref(true);
 
 const priorityTags = [
 	'anal',
@@ -148,8 +169,12 @@ const priorityTags = [
 ];
 
 const groupedTags = computed(() => {
-	const selected = props.tags.filter((tag) => props.filters.tags.includes(tag.slug));
-	const filtered = props.tags.filter((tag) => !props.filters.tags.includes(tag.slug)
+	const tags = showActorTags.value && props.actorTags && (props.filters.actors.length > 0 || pageActor)
+		? props.actorTags
+		: props.tags;
+
+	const selected = tags.filter((tag) => props.filters.tags.includes(tag.slug));
+	const filtered = tags.filter((tag) => !props.filters.tags.includes(tag.slug)
 		&& tag.id !== pageTag?.id
 		&& searchRegexp.value.test(tag.name));