Improve value rendering

electrikmilk · Nov 16, 2023 · b75c95b · b75c95b
1 parent 839810f
commit b75c95b
Show file tree

Hide file tree

Showing 2 changed files with 57 additions and 28 deletions.
diff --git a/src/style.css b/src/style.css
@@ -234,9 +234,7 @@
 }
 
 .sp-container .sp-variable-icon i {
-    font-size: 18px;
-    width: 18px;
-    height: 18px;
+    font-size: 0.9rem;
 }
 
 .sp-container .sp-scrollable-action-content {

diff --git a/src/value.ts b/src/value.ts
@@ -4,6 +4,11 @@ interface AttachmentValue {
     attachmentsByRange: object
 }
 
+interface Aggrandizements {
+    Type: string
+    PropertyName: string
+}
+
 export function renderValue(value?: any, placeholder?: string): HTMLElement {
     const container = document.createElement('div');
     if (value || typeof value === 'boolean' || value === 0) {
@@ -35,33 +40,10 @@ export function renderValue(value?: any, placeholder?: string): HTMLElement {
                 container.appendChild(label);
                 break
             case 'object':
-                if (Array.isArray(value)) {
-                    container.innerText = '[Array]';
-                } else if (value && value.Value && value.Value.attachmentsByRange) {
-                    let str = String(value.Value.string);
-                    for (let v in value.Value.attachmentsByRange) {
-                        let variable = value.Value.attachmentsByRange[v];
-                        if (variable.Type === 'Variable') {
-                            const inlineVar = renderInlineVariable(variable.VariableName);
-                            str = str.replace('\uFFFC', inlineVar.outerHTML);
-                        } else {
-                            const inlineVar = renderInlineVariable(variable.VariableName, 'globe');
-                            str = str.replace('\uFFFC', inlineVar.outerHTML);
-                        }
-                    }
-                    container.innerHTML = str;
-                } else if (value && value.Value && value.Value.OutputName) {
-                    const inlineVar = renderInlineVariable(value.Value.OutputName);
-                    container.appendChild(inlineVar);
-                } else if (value && value.Variable) {
-                    const inlineVar = renderInlineVariable(value.Variable.Value.VariableName);
-                    container.appendChild(inlineVar);
-                } else {
-                    container.innerText = '[Object]';
-                }
+                renderObjectValue(container, value);
                 break;
             default:
-                container.innerText = '[Object]';
+                container.innerText = '[Unsupported Value]';
         }
     } else if (placeholder) {
         container.className = 'sp-placeholder-value';
@@ -70,6 +52,55 @@ export function renderValue(value?: any, placeholder?: string): HTMLElement {
     return container;
 }
 
+function renderObjectValue(container: HTMLElement, value?: any) {
+    if (Array.isArray(value)) {
+        container.innerText = '[Array]';
+    } else if (value && value.Value && value.Value.attachmentsByRange) {
+        let str = String(value.Value.string);
+        for (let v in value.Value.attachmentsByRange) {
+            let variable = value.Value.attachmentsByRange[v];
+            if (variable.Type === 'Variable') {
+                const inlineVar = renderInlineVariable(variable.VariableName);
+                str = str.replace('\uFFFC', inlineVar.outerHTML);
+            } else {
+                let globalName = variable.VariableName;
+                let globalIcon = 'globe';
+                if (variable.Aggrandizements) {
+                    globalName = variable.Aggrandizements[0].PropertyName;
+                }
+                switch (variable.Type) {
+                    case 'DeviceDetails':
+                        globalIcon = 'desktopcomputer';
+                }
+                const inlineVar = renderInlineVariable(globalName, globalIcon);
+                str = str.replace('\uFFFC', inlineVar.outerHTML);
+            }
+        }
+        container.innerHTML = str;
+    } else if (value && value.Value) {
+        if (value.Value.OutputName) {
+            const inlineVar = renderInlineVariable(value.Value.OutputName);
+            container.appendChild(inlineVar);
+        } else {
+            let char;
+            if (value.Value.Type !== 'Variable') {
+                char = 'globe';
+            }
+            switch (value.Value.Type) {
+                case 'DeviceDetails':
+                    char = 'desktopcomputer';
+            }
+            const inlineVar = renderInlineVariable(value.Value.VariableName, char);
+            container.appendChild(inlineVar);
+        }
+    } else if (value && value.Variable) {
+        const inlineVar = renderInlineVariable(value.Variable.Value.VariableName);
+        container.appendChild(inlineVar);
+    } else {
+        container.innerText = '[Unsupported Object]';
+    }
+}
+
 function renderInlineVariable(v: string, char?: string) {
     const variable = document.createElement('div');
     variable.className = 'sp-variable-value';