diff --git a/src/activities/webhooks/Elsa.Activities.Webhooks/ActivityTypes/WebhookActivityTypeProvider.cs b/src/activities/webhooks/Elsa.Activities.Webhooks/ActivityTypes/WebhookActivityTypeProvider.cs
index c6748a573..f05099afd 100644
--- a/src/activities/webhooks/Elsa.Activities.Webhooks/ActivityTypes/WebhookActivityTypeProvider.cs
+++ b/src/activities/webhooks/Elsa.Activities.Webhooks/ActivityTypes/WebhookActivityTypeProvider.cs
@@ -17,7 +17,8 @@ namespace Elsa.Activities.Webhooks.ActivityTypes
     public class WebhookActivityTypeProvider : IActivityTypeProvider
     {
         public const string WebhookMarkerAttribute = "WebhookMarker";
-        private const string WebhookActivityCategory = "Webhooks";
+        private const string WebhooksActivityType = "Webhook";
+        private const string WebhooksActivityCategory = "Webhooks";
 
         private readonly IWebhookDefinitionStore _webhookDefinitionStore;
         private readonly IActivityActivator _activityActivator;
@@ -47,14 +48,11 @@ namespace Elsa.Activities.Webhooks.ActivityTypes
 
         private ActivityType CreateWebhookActivityType(WebhookDefinition webhook)
         {
-            var typeName = webhook.Name;
-            var displayName = webhook.Name;
-
             var descriptor = new ActivityDescriptor
             {
-                Type = typeName,
-                DisplayName = displayName,
-                Category = WebhookActivityCategory,
+                Type = WebhooksActivityType, //$"{webhook.Name} {WebhooksActivityType}",
+                DisplayName = $"{WebhooksActivityType}: {webhook.Name}",
+                Category = WebhooksActivityCategory,
                 Outcomes = new[] { OutcomeNames.Done },
                 Traits = ActivityTraits.Trigger,
                 InputProperties = new[]
diff --git a/src/designer/elsa-workflows-studio/src/components/dashboard/pages/elsa-studio-webhook-definitions-edit/readme.md b/src/designer/elsa-workflows-studio/src/components/dashboard/pages/elsa-studio-webhook-definitions-edit/readme.md
index 2c76b6028..fa2cccc76 100644
--- a/src/designer/elsa-workflows-studio/src/components/dashboard/pages/elsa-studio-webhook-definitions-edit/readme.md
+++ b/src/designer/elsa-workflows-studio/src/components/dashboard/pages/elsa-studio-webhook-definitions-edit/readme.md
@@ -7,13 +7,28 @@
 
 ## Properties
 
-| Property        | Attribute         | Description | Type           | Default     |
-| --------------- | ----------------- | ----------- | -------------- | ----------- |
-| `match`         | --                |             | `MatchResults` | `undefined` |
-| `monacoLibPath` | `monaco-lib-path` |             | `string`       | `undefined` |
-| `serverUrl`     | `server-url`      |             | `string`       | `undefined` |
+| Property    | Attribute    | Description | Type            | Default     |
+| ----------- | ------------ | ----------- | --------------- | ----------- |
+| `history`   | --           |             | `RouterHistory` | `undefined` |
+| `match`     | --           |             | `MatchResults`  | `undefined` |
+| `serverUrl` | `server-url` |             | `string`        | `undefined` |
 
 
+## Dependencies
+
+### Depends on
+
+- [elsa-webhook-definition-editor-screen](../../../screens/webhook-definition-editor/elsa-webhook-definition-editor-screen)
+
+### Graph
+```mermaid
+graph TD;
+  elsa-studio-webhook-definitions-edit --> elsa-webhook-definition-editor-screen
+  elsa-webhook-definition-editor-screen --> elsa-webhook-definition-editor-notifications
+  elsa-webhook-definition-editor-notifications --> elsa-toast-notification
+  style elsa-studio-webhook-definitions-edit fill:#f9f,stroke:#333,stroke-width:4px
+```
+
 ----------------------------------------------
 
 *Built with [StencilJS](https://stenciljs.com/)*
diff --git a/src/designer/elsa-workflows-studio/src/components/designers/tree/elsa-designer-tree/elsa-designer-tree.tsx b/src/designer/elsa-workflows-studio/src/components/designers/tree/elsa-designer-tree/elsa-designer-tree.tsx
index 875c64b56..8782020e2 100644
--- a/src/designer/elsa-workflows-studio/src/components/designers/tree/elsa-designer-tree/elsa-designer-tree.tsx
+++ b/src/designer/elsa-workflows-studio/src/components/designers/tree/elsa-designer-tree/elsa-designer-tree.tsx
@@ -544,7 +544,7 @@ export class ElsaWorkflowDesigner {
 
   renderActivityBody(displayContext: ActivityDesignDisplayContext) {
     return (
-      `<div class="elsa-border-t elsa-border-t-solid hidden">
+      `<div class="elsa-border-t elsa-border-t-solid">
           <div class="elsa-p-6 elsa-text-gray-400 elsa-text-sm">
             <div class="elsa-mb-2">${!!displayContext.bodyDisplay ? displayContext.bodyDisplay : ''}</div>
             <div>
diff --git a/src/designer/elsa-workflows-studio/src/components/editors/properties/elsa-single-line-property/elsa-single-line-property.tsx b/src/designer/elsa-workflows-studio/src/components/editors/properties/elsa-single-line-property/elsa-single-line-property.tsx
index b7421f99e..f56935f35 100644
--- a/src/designer/elsa-workflows-studio/src/components/editors/properties/elsa-single-line-property/elsa-single-line-property.tsx
+++ b/src/designer/elsa-workflows-studio/src/components/editors/properties/elsa-single-line-property/elsa-single-line-property.tsx
@@ -26,7 +26,7 @@ export class ElsaSingleLineProperty {
     this.currentValue = e.detail;
   }
 
-  render() {    
+  render() {        
     const propertyDescriptor = this.propertyDescriptor;
     const propertyModel = this.propertyModel;
     const propertyName = propertyDescriptor.name;
@@ -40,16 +40,22 @@ export class ElsaSingleLineProperty {
       value = defaultValue ? defaultValue.toString() : undefined;
     }
 
+    if (readonly)
+    {      
+      const defaultSyntax = this.propertyDescriptor.defaultSyntax || SyntaxNames.Literal;
+      this.propertyModel.expressions[defaultSyntax] = value;
+    }
+
     return (
       <elsa-property-editor propertyDescriptor={propertyDescriptor}
                             propertyModel={propertyModel}
                             onDefaultSyntaxValueChanged={e => this.onDefaultSyntaxValueChanged(e)}
                             editor-height="2.75em"
                             single-line={true}>
-        {readonly ? 
-          <input type="text" id={fieldId} name={fieldName} value={value} disabled class="elsa-block elsa-w-full elsa-min-w-0 elsa-rounded-md sm:elsa-text-sm elsa-border-gray-300"/>
-          :
+        {!readonly ?
           <input type="text" id={fieldId} name={fieldName} value={value} onChange={e => this.onChange(e)} class="focus:elsa-ring-blue-500 focus:elsa-border-blue-500 elsa-block elsa-w-full elsa-min-w-0 elsa-rounded-md sm:elsa-text-sm elsa-border-gray-300"/>
+          :
+          <input type="text" id={fieldId} name={fieldName} value={value} disabled class="elsa-block elsa-w-full elsa-min-w-0 elsa-rounded-md sm:elsa-text-sm elsa-border-gray-300"/>
         }
       </elsa-property-editor>
     );
diff --git a/src/designer/elsa-workflows-studio/src/components/screens/webhook-definition-editor/elsa-webhook-definition-editor-notifications/readme.md b/src/designer/elsa-workflows-studio/src/components/screens/webhook-definition-editor/elsa-webhook-definition-editor-notifications/readme.md
index e336158e4..b7acd4a5e 100644
--- a/src/designer/elsa-workflows-studio/src/components/screens/webhook-definition-editor/elsa-webhook-definition-editor-notifications/readme.md
+++ b/src/designer/elsa-workflows-studio/src/components/screens/webhook-definition-editor/elsa-webhook-definition-editor-notifications/readme.md
@@ -7,6 +7,10 @@
 
 ## Dependencies
 
+### Used by
+
+ - [elsa-webhook-definition-editor-screen](../elsa-webhook-definition-editor-screen)
+
 ### Depends on
 
 - [elsa-toast-notification](../../../shared/elsa-toast-notification)
@@ -15,6 +19,7 @@
 ```mermaid
 graph TD;
   elsa-webhook-definition-editor-notifications --> elsa-toast-notification
+  elsa-webhook-definition-editor-screen --> elsa-webhook-definition-editor-notifications
   style elsa-webhook-definition-editor-notifications fill:#f9f,stroke:#333,stroke-width:4px
 ```
 
diff --git a/src/designer/elsa-workflows-studio/src/components/screens/webhook-definition-editor/elsa-webhook-definition-editor-screen/readme.md b/src/designer/elsa-workflows-studio/src/components/screens/webhook-definition-editor/elsa-webhook-definition-editor-screen/readme.md
index 4485bfb7c..6ee89f279 100644
--- a/src/designer/elsa-workflows-studio/src/components/screens/webhook-definition-editor/elsa-webhook-definition-editor-screen/readme.md
+++ b/src/designer/elsa-workflows-studio/src/components/screens/webhook-definition-editor/elsa-webhook-definition-editor-screen/readme.md
@@ -7,11 +7,56 @@
 
 ## Properties
 
-| Property            | Attribute | Description | Type                | Default     |
-| ------------------- | --------- | ----------- | ------------------- | ----------- |
-| `webhookDefinition` | --        |             | `WebhookDefinition` | `undefined` |
+| Property            | Attribute               | Description | Type                | Default     |
+| ------------------- | ----------------------- | ----------- | ------------------- | ----------- |
+| `history`           | --                      |             | `RouterHistory`     | `undefined` |
+| `serverUrl`         | `server-url`            |             | `string`            | `undefined` |
+| `webhookDefinition` | --                      |             | `WebhookDefinition` | `undefined` |
+| `webhookId`         | `webhook-definition-id` |             | `string`            | `undefined` |
 
 
+## Methods
+
+### `getServerUrl() => Promise<string>`
+
+
+
+#### Returns
+
+Type: `Promise<string>`
+
+
+
+### `getWebhookId() => Promise<string>`
+
+
+
+#### Returns
+
+Type: `Promise<string>`
+
+
+
+
+## Dependencies
+
+### Used by
+
+ - [elsa-studio-webhook-definitions-edit](../../../dashboard/pages/elsa-studio-webhook-definitions-edit)
+
+### Depends on
+
+- [elsa-webhook-definition-editor-notifications](../elsa-webhook-definition-editor-notifications)
+
+### Graph
+```mermaid
+graph TD;
+  elsa-webhook-definition-editor-screen --> elsa-webhook-definition-editor-notifications
+  elsa-webhook-definition-editor-notifications --> elsa-toast-notification
+  elsa-studio-webhook-definitions-edit --> elsa-webhook-definition-editor-screen
+  style elsa-webhook-definition-editor-screen fill:#f9f,stroke:#333,stroke-width:4px
+```
+
 ----------------------------------------------
 
 *Built with [StencilJS](https://stenciljs.com/)*
diff --git a/src/designer/elsa-workflows-studio/src/components/screens/workflow-definition-editor/elsa-activity-editor-modal/elsa-activity-editor-modal.tsx b/src/designer/elsa-workflows-studio/src/components/screens/workflow-definition-editor/elsa-activity-editor-modal/elsa-activity-editor-modal.tsx
index 2d4fdd6db..975ae5678 100644
--- a/src/designer/elsa-workflows-studio/src/components/screens/workflow-definition-editor/elsa-activity-editor-modal/elsa-activity-editor-modal.tsx
+++ b/src/designer/elsa-workflows-studio/src/components/screens/workflow-definition-editor/elsa-activity-editor-modal/elsa-activity-editor-modal.tsx
@@ -100,8 +100,9 @@ export class ElsaActivityEditorModal {
     const activityModel: ActivityModel = renderProps.activityModel;
     const inactiveClass = 'elsa-border-transparent elsa-text-gray-500 hover:elsa-text-gray-700 hover:elsa-border-gray-300';
     const selectedClass = 'elsa-border-blue-500 elsa-text-blue-600';
-
+debugger    
     return (
+
       <Host class="elsa-block">
         <elsa-modal-dialog ref={el => this.dialog = el} >
           <div slot="content" class="elsa-py-8 elsa-pb-0">
diff --git a/src/designer/elsa-workflows-studio/src/plugins/http-endpoint-plugin.tsx b/src/designer/elsa-workflows-studio/src/plugins/http-endpoint-plugin.tsx
index 4ba7bd28f..cbb27c24c 100644
--- a/src/designer/elsa-workflows-studio/src/plugins/http-endpoint-plugin.tsx
+++ b/src/designer/elsa-workflows-studio/src/plugins/http-endpoint-plugin.tsx
@@ -10,10 +10,10 @@ export class HttpEndpointPlugin implements ElsaPlugin {
 
   onActivityDisplaying(context: ActivityDesignDisplayContext) {
     const activityModel = context.activityModel;
-
+    
     if (activityModel.type !== 'HttpEndpoint')
       return;
-
+      
     const props = activityModel.properties || [];
     const path = props.find(x => x.name == 'Path') || { name: 'Path', expressions: { 'Literal': '', syntax: SyntaxNames.Literal } };
     const syntax = path.syntax || SyntaxNames.Literal;
diff --git a/src/designer/elsa-workflows-studio/src/plugins/webhook-plugin.tsx b/src/designer/elsa-workflows-studio/src/plugins/webhook-plugin.tsx
new file mode 100644
index 000000000..852adefc8
--- /dev/null
+++ b/src/designer/elsa-workflows-studio/src/plugins/webhook-plugin.tsx
@@ -0,0 +1,22 @@
+import {ElsaPlugin} from "../services/elsa-plugin";
+import {eventBus} from '../services/event-bus';
+import {ActivityDesignDisplayContext, EventTypes, SyntaxNames} from "../models";
+import {h} from "@stencil/core";
+
+export class WebhookPlugin implements ElsaPlugin {
+  constructor() {
+    eventBus.on(EventTypes.ActivityDesignDisplaying, this.onActivityDisplaying);
+  }
+
+  onActivityDisplaying(context: ActivityDesignDisplayContext) {
+    const activityModel = context.activityModel;
+    
+    if (activityModel.type !== 'Webhook')
+      return;
+
+    const props = activityModel.properties || [];
+    const path = props.find(x => x.name == 'Path') || { name: 'Path', expressions: { 'Literal': '', syntax: SyntaxNames.Literal } };
+    const syntax = path.syntax || SyntaxNames.Literal;
+    context.bodyDisplay = `<p>${path.expressions[syntax]}</p>`;
+  }
+}
diff --git a/src/designer/elsa-workflows-studio/src/services/plugin-manager.ts b/src/designer/elsa-workflows-studio/src/services/plugin-manager.ts
index 695ded451..98acd2866 100644
--- a/src/designer/elsa-workflows-studio/src/services/plugin-manager.ts
+++ b/src/designer/elsa-workflows-studio/src/services/plugin-manager.ts
@@ -17,6 +17,7 @@ import {SendSignalPlugin} from "../plugins/send-signal-plugin";
 import {UserTaskPlugin} from "../plugins/user-task-plugin";
 import {StatePlugin} from "../plugins/state-plugin";
 import {SendHttpRequestPlugin} from "../plugins/send-http-request-plugin";
+import {WebhookPlugin} from "../plugins/webhook-plugin";
 
 export class PluginManager {
 
@@ -41,7 +42,8 @@ export class PluginManager {
       new StatePlugin(),
       new RunJavascriptPlugin(),
       new UserTaskPlugin(),
-      new SendEmailPlugin()
+      new SendEmailPlugin(),
+      new WebhookPlugin()
     ];
   }