diff --git a/lib/src/Components/Profile/Subcomponents/RelationsView.tsx b/lib/src/Components/Profile/Subcomponents/RelationsView.tsx
new file mode 100644
index 00000000..7602ca9f
--- /dev/null
+++ b/lib/src/Components/Profile/Subcomponents/RelationsView.tsx
@@ -0,0 +1,37 @@
+import { useItems } from '#components/Map/hooks/useItems'
+
+import type { Item } from '#types/Item'
+
+interface Props {
+ item: Item
+ relation: string
+}
+
+export const RelationsView = ({ item, relation }: Props) => {
+ const items = useItems()
+
+ if (!item.relations) throw new Error('Item does not have relations defined.')
+
+ const relationsOfRightType = item.relations.filter((r) => r.type === relation)
+
+ const relatedItems = items.filter((i) => relationsOfRightType.some((r) => r.id === i.id))
+
+ const hasRelatedItems = relatedItems.length > 0
+
+ return (
+
+
{relation}
+ {hasRelatedItems ? (
+
+ ) : (
+
No related items found.
+ )}
+
+ )
+}
diff --git a/lib/src/Components/Profile/Templates/FlexView.tsx b/lib/src/Components/Profile/Templates/FlexView.tsx
index 4a32f53f..e3024c45 100644
--- a/lib/src/Components/Profile/Templates/FlexView.tsx
+++ b/lib/src/Components/Profile/Templates/FlexView.tsx
@@ -7,6 +7,7 @@ import { GroupSubHeaderView } from '#components/Profile/Subcomponents/GroupSubHe
import { InviteLinkView } from '#components/Profile/Subcomponents/InviteLinkView'
import { ProfileStartEndView } from '#components/Profile/Subcomponents/ProfileStartEndView'
import { ProfileTextView } from '#components/Profile/Subcomponents/ProfileTextView'
+import { RelationsView } from '#components/Profile/Subcomponents/RelationsView'
import type { Item } from '#types/Item'
import type { Key } from 'react'
@@ -19,6 +20,7 @@ const componentMap = {
gallery: GalleryView,
crowdfundings: CrowdfundingView,
inviteLinks: InviteLinkView,
+ relations: RelationsView,
// weitere Komponenten hier
}