From 5da9ea14774890e486832c31e1e3ea2c2285398a Mon Sep 17 00:00:00 2001
From: Milan Unger <nilan.unger@siemens-healthineers.com>
Date: Tue, 31 Oct 2023 16:49:30 +0100
Subject: [PATCH] Refactor UfeContext to dynamically render context elements
 with extra attributes.

---
 .../components/ufe-context/ufe-context.tsx    | 24 ++++++++++++++++---
 1 file changed, 21 insertions(+), 3 deletions(-)

diff --git a/web-ui/src/components/ufe-context/ufe-context.tsx b/web-ui/src/components/ufe-context/ufe-context.tsx
index f1d7d97..e324ee8 100644
--- a/web-ui/src/components/ufe-context/ufe-context.tsx
+++ b/web-ui/src/components/ufe-context/ufe-context.tsx
@@ -33,16 +33,34 @@ export class UfeContext {
     const contextElements = this.ufeRegistry.contextElements( this.context, this.selector );
     this.ufeRegistry.preloadDependenciesAsync(contextElements);
     
+    
     return (
       
       <Host>
         <slot name="beforeALl"></slot>
-        {contextElements.map( el => { 
-          const element = this.ufeRegistry.loadAndRenderElement(el, Object.assign({}, this.extraAttributes, this.data));
+          {contextElements.map( el => { 
+            const attr = Object.assign(
+              {},
+              this.extraAttributes,
+              el.attributes.reduce(
+                  (acc, a) => {
+                      acc[a.name] = a.value;
+                      return acc
+                  }, {} as {
+                      [name: string]: any
+                  })
+          );
+          
           return (
             <context-item>
               <slot name="before-each"></slot>
-              { element }
+              <el.element {...attr} ref={ (_ => {
+                if (_) {
+                  for (let key in this.data) {
+                    _[key] = this.data[key];
+                  }
+                }
+              })}></el.element>
               <slot name="after-each"></slot>
             </context-item>
           )