From 40a0e7931da30d5401535bdfd66cad809f45a510 Mon Sep 17 00:00:00 2001
From: pietervdvn <pietervdvn@posteo.net>
Date: Thu, 28 Oct 2021 00:53:09 +0200
Subject: [PATCH] Remove empty elements

---
 UI/BaseUIElement.ts              |  1 +
 UI/Popup/EditableTagRendering.ts | 12 ++++++++++--
 UI/Popup/FeatureInfoBox.ts       | 25 ++++++++++++-------------
 3 files changed, 23 insertions(+), 15 deletions(-)

diff --git a/UI/BaseUIElement.ts b/UI/BaseUIElement.ts
index a18b25972..80cb7b26e 100644
--- a/UI/BaseUIElement.ts
+++ b/UI/BaseUIElement.ts
@@ -45,6 +45,7 @@ export default abstract class BaseUIElement {
      * Adds all the relevant classes, space separated
      */
     public SetClass(clss: string) {
+        if(clss == undefined){return }
         const all = clss.split(" ").map(clsName => clsName.trim());
         let recordedChange = false;
         for (let c of all) {
diff --git a/UI/Popup/EditableTagRendering.ts b/UI/Popup/EditableTagRendering.ts
index 55cd7504d..be9634b2f 100644
--- a/UI/Popup/EditableTagRendering.ts
+++ b/UI/Popup/EditableTagRendering.ts
@@ -16,7 +16,10 @@ export default class EditableTagRendering extends Toggle {
     constructor(tags: UIEventSource<any>,
                 configuration: TagRenderingConfig,
                 units: Unit [],
-                editMode = new UIEventSource<boolean>(false)
+                options:{
+                editMode? : UIEventSource<boolean> ,
+                innerElementClasses?: string
+                }
     ) {
 
         // The tagrendering is hidden if:
@@ -27,7 +30,12 @@ export default class EditableTagRendering extends Toggle {
             (configuration?.condition?.matchesProperties(tags) ?? true))
         
         super(
-            new Lazy(() => EditableTagRendering.CreateRendering(tags, configuration, units, editMode)),
+            new Lazy(() => {
+                const editMode = options.editMode ?? new UIEventSource<boolean>(false)
+                const rendering = EditableTagRendering.CreateRendering(tags, configuration, units, editMode);
+                rendering.SetClass(options.innerElementClasses)
+                return rendering
+            }),
             undefined,
             renderingIsShown
         )
diff --git a/UI/Popup/FeatureInfoBox.ts b/UI/Popup/FeatureInfoBox.ts
index cfffd0ffe..58a07cc3a 100644
--- a/UI/Popup/FeatureInfoBox.ts
+++ b/UI/Popup/FeatureInfoBox.ts
@@ -68,7 +68,8 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
             const groupName = allGroupNames[i];
 
             const trs = layerConfig.tagRenderings.filter(tr => tr.group === groupName)
-            const renderingsForGroup: BaseUIElement[] = []
+            const renderingsForGroup: (EditableTagRendering | BaseUIElement)[] = []
+            const innerClasses = "block w-full break-word text-default m-1 p-1 border-b border-gray-200 mb-2 pb-2";
             for (const tr of trs) {
                 if (tr.question === null || tr.id === "questions") {
                     // This is a question box!
@@ -76,21 +77,19 @@ export default class FeatureInfoBox extends ScrollableFullScreen {
                     questionBoxes.delete(tr.group)
                     renderingsForGroup.push(questionBox)
                 } else {
-                    const etr = new EditableTagRendering(tags, tr, layerConfig.units).SetClass("editable-tag-rendering")
-                        
+                    let classes = innerClasses
+                    if(renderingsForGroup.length === 0 && i > 0){
+                        // This is the first element of a group!
+                        // It should act as header and be sticky
+                        classes= "sticky top-0"
+                    }
+                    
+                    const etr = new EditableTagRendering(tags, tr, layerConfig.units,{
+                        innerElementClasses: innerClasses
+                    })
                     renderingsForGroup.push(etr)
                 }
             }
-            let j = 0
-            if (i !== 0) {
-                renderingsForGroup[0]?.SetStyle("position: sticky; top: -5px")
-                j = 1
-            }
-            for (/* j = 0 or 1 */; j < renderingsForGroup.length; j++) {
-                renderingsForGroup[j].SetClass("block w-full break-word text-default m-1 p-1 border-b border-gray-200 mb-2 pb-2")
-            }
-            
-            
             
             allRenderings.push(...renderingsForGroup)
         }