From 3e9ac38b13f8dde53bdbf403235e70ee1b810868 Mon Sep 17 00:00:00 2001
From: JesmoDev <26099018+JesmoDev@users.noreply.github.com>
Date: Thu, 2 May 2024 13:04:29 +0200
Subject: [PATCH] link

---
 .../webhook-collection.server.data-source.ts  |  2 +-
 ...ebhook-table-name-column-layout.element.ts | 22 +++++++++++++------
 ...hook-table-remove-column-layout.element.ts |  3 +++
 .../webhook-table-collection-view.element.ts  | 19 ++++++++++++----
 4 files changed, 34 insertions(+), 12 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/repository/webhook-collection.server.data-source.ts b/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/repository/webhook-collection.server.data-source.ts
index 227d76a3a6..5b23fb3d88 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/repository/webhook-collection.server.data-source.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/repository/webhook-collection.server.data-source.ts
@@ -39,7 +39,7 @@ export class UmbWebhookCollectionServerDataSource implements UmbWebhookCollectio
 		const items = data.items.map((item) => {
 			const model: UmbWebhookDetailModel = {
 				entityType: UMB_WEBHOOK_ENTITY_TYPE,
-				unique: item.url,
+				unique: item.id,
 				url: item.url,
 				enabled: item.enabled,
 				headers: item.headers,
diff --git a/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/column-layouts/name/webhook-table-name-column-layout.element.ts b/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/column-layouts/name/webhook-table-name-column-layout.element.ts
index f90515ddac..fbcc0579bd 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/column-layouts/name/webhook-table-name-column-layout.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/column-layouts/name/webhook-table-name-column-layout.element.ts
@@ -1,21 +1,29 @@
 import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
-import { html, LitElement, nothing, customElement, property } from '@umbraco-cms/backoffice/external/lit';
+import { html, LitElement, nothing, customElement, property, css } from '@umbraco-cms/backoffice/external/lit';
 
-@customElement('umb-w-table-name-column-layout')
-export class UmbLanguageTableNameColumnLayoutElement extends LitElement {
+@customElement('umb-webhook-table-name-column-layout')
+export class UmbWebhookTableNameColumnLayoutElement extends LitElement {
 	@property({ attribute: false })
-	value!: { unique: string; name: string };
+	value?: { unique: string; name: string };
 
 	render() {
 		if (!this.value) return nothing;
-		return html`<a href=${'section/settings/workspace/language/edit/' + this.value.unique}>${this.value.name}</a>`;
+
+		return html`<a href=${'section/settings/workspace/webhook/edit/' + this.value.unique}>${this.value.name}</a>`;
 	}
 
-	static styles = [UmbTextStyles];
+	static styles = [
+		UmbTextStyles,
+		css`
+			:host {
+				white-space: nowrap;
+			}
+		`,
+	];
 }
 
 declare global {
 	interface HTMLElementTagNameMap {
-		'umb-language-table-name-column-layout': UmbLanguageTableNameColumnLayoutElement;
+		'umb-webhook-table-name-column-layout': UmbWebhookTableNameColumnLayoutElement;
 	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/column-layouts/remove/webhook-table-remove-column-layout.element.ts b/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/column-layouts/remove/webhook-table-remove-column-layout.element.ts
index 242c23a738..7e9095a5ca 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/column-layouts/remove/webhook-table-remove-column-layout.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/column-layouts/remove/webhook-table-remove-column-layout.element.ts
@@ -4,6 +4,9 @@ import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
 
 @customElement('umb-webhook-table-remove-column-layout')
 export class UmbWebhookTableRemoveColumnLayoutElement extends UmbLitElement {
+	@property()
+	value = '';
+
 	render() {
 		return html` <uui-button label="remove"></uui-button> `;
 	}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/webhook-table-collection-view.element.ts b/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/webhook-table-collection-view.element.ts
index ac110330a3..a3eb723f5d 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/webhook-table-collection-view.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/webhook/collection/views/table/webhook-table-collection-view.element.ts
@@ -19,6 +19,11 @@ export class UmbWebhookTableCollectionViewElement extends UmbLitElement {
 
 	@state()
 	private _tableColumns: Array<UmbTableColumn> = [
+		{
+			name: 'Name',
+			alias: 'name',
+			elementName: 'umb-webhook-table-name-column-layout',
+		},
 		{
 			name: 'Enabled',
 			alias: 'enabled',
@@ -63,18 +68,24 @@ export class UmbWebhookTableCollectionViewElement extends UmbLitElement {
 	}
 
 	#createTableItems(webhooks: Array<UmbWebhookDetailModel>) {
-		this._tableItems = webhooks.map((webhook) => {
+		console.log(webhooks);
+		this._tableItems = webhooks.map((webhook, index) => {
 			return {
 				id: webhook.unique,
 				icon: 'icon-webhook',
 				data: [
 					{
-						columnAlias: 'enabled',
-						value: webhook.enabled,
+						columnAlias: 'name',
+						value: { name: `Webhook ${index + 1}`, unique: webhook.unique },
 					},
 					{
 						columnAlias: 'url',
 						value: webhook.url,
+						path: webhook.url,
+					},
+					{
+						columnAlias: 'enabled',
+						value: webhook.enabled,
 					},
 					{
 						columnAlias: 'events',
@@ -86,7 +97,7 @@ export class UmbWebhookTableCollectionViewElement extends UmbLitElement {
 					},
 					{
 						columnAlias: 'remove',
-						value: '',
+						value: webhook.unique,
 					},
 				],
 			};