diff --git a/src/Umbraco.Web.UI.Client/src/packages/relations/relation-types/workspace/views/relation/workspace-view-relation-type-relation.element.ts b/src/Umbraco.Web.UI.Client/src/packages/relations/relation-types/workspace/views/relation/workspace-view-relation-type-relation.element.ts
index 58ecf96072..5c57f3cf40 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/relations/relation-types/workspace/views/relation/workspace-view-relation-type-relation.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/relations/relation-types/workspace/views/relation/workspace-view-relation-type-relation.element.ts
@@ -1,6 +1,7 @@
+import { UMB_RELATION_TYPE_WORKSPACE_CONTEXT } from '../../relation-type-workspace.context.js';
 import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
 import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
-import { UmbTableColumn, UmbTableConfig } from '@umbraco-cms/backoffice/components';
+import { UmbTableColumn, UmbTableConfig, UmbTableItem } from '@umbraco-cms/backoffice/components';
 import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
 import { RelationResponseModel } from '@umbraco-cms/backoffice/backend-api';
 import { UmbWorkspaceViewElement } from '@umbraco-cms/backoffice/extension-registry';
@@ -9,7 +10,27 @@ import { UmbWorkspaceViewElement } from '@umbraco-cms/backoffice/extension-regis
 export class UmbWorkspaceViewRelationTypeRelationElement extends UmbLitElement implements UmbWorkspaceViewElement {
 	//TODO Use real data
 	@state()
-	_relations: Array<RelationResponseModel> = MockData;
+	_relations: Array<RelationResponseModel> = [];
+
+	#workspaceContext?: typeof UMB_RELATION_TYPE_WORKSPACE_CONTEXT.TYPE;
+
+	constructor() {
+		super();
+
+		this.consumeContext(UMB_RELATION_TYPE_WORKSPACE_CONTEXT, (instance) => {
+			this.#workspaceContext = instance;
+			this.#getRelations();
+		});
+	}
+
+	async #getRelations() {
+		if (!this.#workspaceContext) {
+			return;
+		}
+
+		const response = await this.#workspaceContext.getRelations();
+		this._relations = response.data?.items ?? [];
+	}
 
 	private _tableConfig: UmbTableConfig = {
 		allowSelection: false,
@@ -35,10 +56,10 @@ export class UmbWorkspaceViewRelationTypeRelationElement extends UmbLitElement i
 		},
 	];
 
-	private get _tableItems() {
+	private get _tableItems(): UmbTableItem[] {
 		return this._relations.map((relation) => {
 			return {
-				key: relation.parentId + '-' + relation.childId,
+				id: relation.parentId + '-' + relation.childId, // Add the missing id property
 				data: [
 					{
 						columnAlias: 'parent',
@@ -78,73 +99,6 @@ export class UmbWorkspaceViewRelationTypeRelationElement extends UmbLitElement i
 	];
 }
 
-const MockData: Array<RelationResponseModel> = [
-	{
-		parentId: '1',
-		parentName: 'Parent 1',
-		childId: '2',
-		childName: 'Child 1',
-		createDate: '2021-01-01',
-		comment: 'Comment 1',
-	},
-	{
-		parentId: '1',
-		parentName: 'Parent 1',
-		childId: '3',
-		childName: 'Child 2',
-		createDate: '2021-01-01',
-		comment: 'Comment 2',
-	},
-	{
-		parentId: '1',
-		parentName: 'Parent 1',
-		childId: '4',
-		childName: 'Child 3',
-		createDate: '2021-01-01',
-		comment: 'Comment 3',
-	},
-	{
-		parentId: '1',
-		parentName: 'Parent 1',
-		childId: '5',
-		childName: 'Child 4',
-		createDate: '2021-01-01',
-		comment: 'Comment 4',
-	},
-	{
-		parentId: '1',
-		parentName: 'Parent 1',
-		childId: '6',
-		childName: 'Child 5',
-		createDate: '2021-01-01',
-		comment: 'Comment 5',
-	},
-	{
-		parentId: '1',
-		parentName: 'Parent 1',
-		childId: '7',
-		childName: 'Child 6',
-		createDate: '2021-01-01',
-		comment: 'Comment 6',
-	},
-	{
-		parentId: '1',
-		parentName: 'Parent 1',
-		childId: '8',
-		childName: 'Child 7',
-		createDate: '2021-01-01',
-		comment: 'Comment 7',
-	},
-	{
-		parentId: '1',
-		parentName: 'Parent 1',
-		childId: '9',
-		childName: 'Child 8',
-		createDate: '2021-01-01',
-		comment: 'Comment 8',
-	},
-];
-
 export default UmbWorkspaceViewRelationTypeRelationElement;
 
 declare global {