Upgraded dependencies, bumped to Node 24.

pages/actors/@actorId/+Page.vue

@@ -1,3 +1,28 @@
+<script setup>
+import { inject, useId } from 'vue';
+
+import Bio from '#/components/actors/bio.vue';
+
+import Gender from '#/components/actors/gender.vue';
+import Domains from '#/components/domains/domains.vue';
+import Movies from '#/components/movies/movies.vue';
+import Scenes from '#/components/scenes/scenes.vue';
+import Heart from '#/components/stashes/heart.vue';
+import getPath from '#/src/get-path.js';
+
+const pageContext = inject('pageContext');
+const { pageProps, routeParams } = pageContext;
+const { actor } = pageProps;
+
+const domain = routeParams.domain;
+
+const badCredits = ['Pierre Woodman']; // consistently horrible photos
+const photos = actor.photos.filter((photo) => photo.entropy > 5.5 && !badCredits.includes(photo.credit));
+const aliasTooltipId = useId();
+
+console.log(actor);
+</script>
+
 <template>
 	<div class="actor">
 		<div class="actor-header">
@@ -5,6 +30,17 @@
 				<span v-if="actor.entity">{{ actor.name }} ({{ actor.entity.name }})</span>
 				<span v-else>{{ actor.name }}</span>
 
+				<a
+					v-if="actor.alias"
+					v-tooltip="{ content: `Alias for ${actor.alias.name} (#${actor.alias.id})`, ariaId: aliasTooltipId }"
+					:href="`/actor/${actor.alias.id}/${actor.alias.slug}`"
+				>
+					<Icon
+						icon="at-sign"
+						class="header-alias"
+					/>
+				</a>
+
 				<Gender
 					:gender="actor.gender"
 					class="header-gender"
@@ -61,28 +97,6 @@
 	</div>
 </template>
 
-<script setup>
-import { inject } from 'vue';
-
-import getPath from '#/src/get-path.js';
-
-import Bio from '#/components/actors/bio.vue';
-import Gender from '#/components/actors/gender.vue';
-import Scenes from '#/components/scenes/scenes.vue';
-import Movies from '#/components/movies/movies.vue';
-import Heart from '#/components/stashes/heart.vue';
-import Domains from '#/components/domains/domains.vue';
-
-const pageContext = inject('pageContext');
-const { pageProps, routeParams } = pageContext;
-const { actor } = pageProps;
-
-const domain = routeParams.domain;
-
-const badCredits = ['Pierre Woodman']; // consistently horrible photos
-const photos = actor.photos.filter((photo) => photo.entropy > 5.5 && !badCredits.includes(photo.credit));
-</script>
-
 <style scoped>
 .actor {
 	display: flex;
@@ -111,6 +125,14 @@ const photos = actor.photos.filter((photo) => photo.entropy > 5.5 && !badCredits
     flex-shrink: 0;
 }
 
+.header-alias.icon {
+	height: 1.75rem;
+	display: flex;
+	align-items: center;
+    padding: 0 1rem;
+	fill: var(--primary);
+}
+
 .header-social {
     overflow: hidden;
     white-space: nowrap;