Add custom attributes field to activity descriptor

src/clients/Elsa.Client/Models/ActivityDescriptor.cs

@@ -1,3 +1,4 @@
+using System;
 using System.Runtime.Serialization;
 
 namespace Elsa.Client.Models
@@ -10,7 +11,7 @@ namespace Elsa.Client.Models
         [DataMember(Order = 3)] public string? Description { get; set; }
         [DataMember(Order = 4)] public string Category { get; set; } = default!;
         [DataMember(Order = 5)] public ActivityTraits Traits { get; set; }
-        [DataMember(Order = 6)] public string[] Outcomes { get; set; } = new string[0];
-        [DataMember(Order = 7)] public ActivityPropertyDescriptor[] Properties { get; set; } = new ActivityPropertyDescriptor[0];
+        [DataMember(Order = 6)] public string[] Outcomes { get; set; } = Array.Empty<string>();
+        [DataMember(Order = 7)] public ActivityPropertyDescriptor[] Properties { get; set; } = Array.Empty<ActivityPropertyDescriptor>();
     }
 }

src/core/Elsa.Abstractions/Metadata/ActivityDescriptor.cs

@@ -1,4 +1,5 @@
 using System;
+using System.Collections.Generic;
 
 namespace Elsa.Metadata
 {
@@ -31,5 +32,6 @@ namespace Elsa.Metadata
         
         public ActivityInputDescriptor[] InputProperties { get; set; }
         public ActivityOutputDescriptor[] OutputProperties { get; set; }
+        public IDictionary<string, object?> CustomAttributes { get; set; } = new Dictionary<string, object?>();
     }
 }

src/designer/elsa-workflows-studio/src/components/designers/tree/elsa-designer-tree/elsa-designer-tree.tsx

@@ -116,7 +116,7 @@ export class ElsaWorkflowDesigner {
     this.ignoreCopyPasteActivities = true;
     this.activityContextMenuTestState = state;
     this.activityContextMenuButtonTestClicked.emit(state);
-  }  
+  }
 
   @Watch('model')
   handleModelChanged(newValue: WorkflowModel) {
@@ -149,7 +149,7 @@ export class ElsaWorkflowDesigner {
   @Watch('activityContextTestMenu')
   handleActivityContextMenuTestChanged(newValue: ActivityContextMenuState) {
     this.activityContextMenuTestState = newValue;
-  }  
+  }
 
   @Listen('keydown', {target: 'window'})
   async handleKeyDown(event: KeyboardEvent) {
@@ -329,7 +329,8 @@ export class ElsaWorkflowDesigner {
       traits: ActivityTraits.Action,
       description: `(Not Found) ${activityModel.description}`,
       category: 'Not Found',
-      browsable: false
+      browsable: false,
+      customAttributes: {}
     };
   }
 
@@ -705,7 +706,7 @@ export class ElsaWorkflowDesigner {
               d3.select(node.elem).select('svg').classed('elsa-text-green-400', true).classed('elsa-text-gray-400', false).classed('hover:elsa-text-blue-500', false);
               return;
             }
-            
+
             if (this.mode !== WorkflowDesignerMode.Test) await this.showActivityPicker();
           })
           .on("mouseover", e => {
@@ -893,7 +894,7 @@ export class ElsaWorkflowDesigner {
       </div>`;
   }
 
-  renderActivityBody(displayContext: ActivityDesignDisplayContext) {    
+  renderActivityBody(displayContext: ActivityDesignDisplayContext) {
     return (
       `<div class="elsa-border-t elsa-border-t-solid">
           <div class="elsa-p-6 elsa-text-gray-400 elsa-text-sm">
@@ -914,7 +915,7 @@ export class ElsaWorkflowDesigner {
   render() {
     return (
       <Host class="workflow-canvas elsa-flex-1 elsa-flex" ref={el => (this.el = el)}>
-        {this.mode == WorkflowDesignerMode.Test ? 
+        {this.mode == WorkflowDesignerMode.Test ?
           <div>
             <div id="left" style={{border:`4px solid orange`, position:`fixed`, zIndex:`10`, height: `calc(100vh - 64px)`, width:`4px`, top:`64`, bottom:`0`, left:`0`}}></div>
             <div id="right" style={{border:`4px solid orange`, position:`fixed`, zIndex:`10`, height: `calc(100vh - 64px)`, width:`4px`, top:`64`, bottom:`0`, right:`0`}}></div>
@@ -923,7 +924,7 @@ export class ElsaWorkflowDesigner {
           </div>
           :
           undefined
-        }        
+        }
         <svg ref={(el: SVGSVGElement) => (this.svg = el)} id="svg" style={{
           height: 'calc(100vh - 64px)',
           width: '100%',

src/designer/elsa-workflows-studio/src/components/screens/workflow-definition-editor/elsa-activity-editor-modal/elsa-activity-editor-modal.tsx

@@ -89,7 +89,8 @@ export class ElsaActivityEditorModal {
       browsable: false,
       inputProperties: [],
       outputProperties: [],
-      description: ''
+      description: '',
+      customAttributes: {}
     };
     const propertyCategories = activityDescriptor.inputProperties.filter(x => x.category).map(x => x.category).distinct();
     const defaultProperties = activityDescriptor.inputProperties.filter(x => !x.category || x.category.length == 0);

src/designer/elsa-workflows-studio/src/models/domain.ts

@@ -265,6 +265,7 @@ export interface ActivityDescriptor {
   browsable: boolean;
   inputProperties: Array<ActivityPropertyDescriptor>;
   outputProperties: Array<ActivityPropertyDescriptor>;
+  customAttributes: any;
 }
 
 export interface ActivityPropertyDescriptor {
@@ -351,4 +352,4 @@ export const getVersionOptionsString = (versionOptions?: VersionOptions) => {
           : versionOptions.isLatestOrPublished
             ? 'LatestOrPublished'
             : versionOptions.version.toString();
-};
+};