Merge branch 'develop'

Author: katharinawuensche

Diff for: .devcontainer/devcontainer.json

@@ -1,6 +1,6 @@
 {
 	"name": "Nuxt",
-	"image": "ghcr.io/acdh-oeaw/devcontainer-frontend:20",
+	"image": "ghcr.io/acdh-oeaw/devcontainer-frontend:22",
 	"customizations": {
 		"vscode": {
 			"extensions": [

Diff for: .github/workflows/validate.yml

@@ -43,7 +43,7 @@ jobs:
     strategy:
       fail-fast: true
       matrix:
-        node-version: [20.x]
+        node-version: [22.x]
         os: [ubuntu-latest]
 
     steps:

Diff for: Dockerfile

@@ -4,7 +4,7 @@
 # @see https://sharp.pixelplumbing.com/install#linux-memory-allocator
 
 # build
-FROM node:20-alpine AS build
+FROM node:22-alpine AS build
 
 RUN corepack enable
 
@@ -39,7 +39,7 @@ ENV NODE_ENV=production
 RUN pnpm run build
 
 # serve
-FROM node:20-alpine AS serve
+FROM node:22-alpine AS serve
 
 RUN mkdir /app && chown -R node:node /app
 WORKDIR /app

Diff for: components/app-header.vue

@@ -38,7 +38,7 @@ const defaultLinks = computed<
 	}
 	return {
 		home: {
-			href: project.map.startPage ? { path: "/", mode: "map" } : { path: "/" },
+			href: project.map.startPage ? { path: "/", query: { mode: "map" } } : { path: "/" },
 			label: t("AppHeader.links.home"),
 		},
 		team: { href: { path: "/team" }, label: t("AppHeader.links.team") },

Diff for: components/custom-primary-details-event.vue

@@ -0,0 +1,156 @@
+<script setup lang="ts">
+import { ChevronLeftIcon, ChevronRightIcon } from "lucide-vue-next";
+
+const t = useTranslations();
+
+const { getUnprefixedId } = useIdPrefix();
+
+const props = defineProps<{ entity: EntityFeature }>();
+const route = useRoute();
+
+const multipleMovements = useGetLinkedEntitiesRecursive(
+	computed(() => {
+		return { entityId: Number.parseInt(getUnprefixedId(props.entity["@id"])) };
+	}),
+);
+
+const movementDetails = computed(() => {
+	if (multipleMovements.data.value) {
+		return multipleMovements.data.value;
+	} else return null;
+});
+
+const linkedMovements = computed(() => {
+	if (movementDetails.value === null) {
+		return null;
+	}
+
+	const features = Object.values(movementDetails.value).flatMap((entity) => {
+		if (entity && typeof entity === "object" && Array.isArray(entity.features)) {
+			return entity.features as Array<EntityFeature>;
+		}
+		return [];
+	});
+
+	// Now map through the features to get the IDs
+	return features.map((movement) => {
+		return {
+			id: getUnprefixedId(movement["@id"]),
+			"@id": movement["@id"],
+			title: movement.properties.title,
+			systemClass: movement.systemClass,
+		};
+	});
+});
+
+const currentFeatureIndex = computed(() => {
+	if (linkedMovements.value == null) {
+		return -1;
+	}
+	return linkedMovements.value.findIndex((feature) => {
+		return feature["@id"] === props.entity["@id"];
+	});
+});
+
+const previousFeature = computed(() => {
+	if (currentFeatureIndex.value <= 0 || linkedMovements.value == null) {
+		return null;
+	}
+	return linkedMovements.value[currentFeatureIndex.value - 1];
+});
+
+const nextFeature = computed(() => {
+	if (
+		linkedMovements.value == null ||
+		currentFeatureIndex.value === linkedMovements.value.length - 1
+	) {
+		return null;
+	}
+	return linkedMovements.value[currentFeatureIndex.value + 1];
+});
+
+const collapsibleRelations: Array<{
+	relationType: RelationType;
+	systemClass?: string;
+	title: string;
+}> = [
+	{
+		relationType: {
+			crmCode: "P46",
+		},
+		systemClass: "artifact",
+		title: t("Relations.Artifacts"),
+	},
+	{
+		relationType: {
+			crmCode: "P46",
+		},
+		systemClass: "human_remains",
+		title: t("Relations.HumanRemains"),
+	},
+];
+
+const emit = defineEmits({
+	handledRelations(payload: Array<RelationType>) {
+		return payload;
+	},
+});
+
+const handledRelations: Array<RelationType> = [
+	{
+		crmCode: "P46",
+	},
+];
+
+onMounted(() => {
+	emit("handledRelations", handledRelations);
+});
+
+function getPath() {
+	if (route.path.includes("visualization")) {
+		return "visualization";
+	}
+	return "";
+}
+
+const currentMode = computed(() => {
+	return route.query.mode;
+});
+</script>
+
+<template>
+	<div class="flex justify-between">
+		<NavLink
+			v-if="previousFeature"
+			:href="{
+				path: `/${getPath()}`,
+				query: { mode: currentMode, selection: getUnprefixedId(previousFeature['@id']) },
+			}"
+			class="flex items-center underline decoration-dotted transition hover:no-underline focus-visible:no-underline"
+		>
+			<ChevronLeftIcon class="size-4" />
+			<span>{{ previousFeature.title }}</span>
+			<span class="sr-only">{{ t("EntitySidebar.PreviousFeature") }}</span>
+		</NavLink>
+		<NavLink
+			v-if="nextFeature"
+			:href="{
+				path: `/${getPath()}`,
+				query: { mode: currentMode, selection: getUnprefixedId(nextFeature['@id']) },
+			}"
+			class="flex items-center underline decoration-dotted transition hover:no-underline focus-visible:no-underline"
+		>
+			<span>{{ nextFeature.title }}</span>
+			<span class="sr-only">{{ t("EntitySidebar.NextFeature") }}</span>
+			<ChevronRightIcon class="size-4" />
+		</NavLink>
+	</div>
+	<GroupedRelationCollapsible
+		v-for="rel in collapsibleRelations"
+		:key="rel.relationType.crmCode + rel.relationType.inverse"
+		:title="rel.title"
+		:relations="entity.relations"
+		:system-class="rel.systemClass"
+		:relation-type="rel.relationType"
+	/>
+</template>