Support complex variables in the extension UI (#1675)

## Changes

This is just to fix broken Variables Explorer view. We still don't
support overriding complex vars, for that we need to store the override
file inside a .databricks folder and stop using BUNDLE_VAR env vars

## Tests

e2e

Author: ilia-db

packages/databricks-vscode/src/test/e2e/bundle_variables.e2e.ts

@@ -32,6 +32,13 @@ describe("Bundle Variables", async function () {
                 varWithDefault: {
                     default: "default",
                 },
+                complexVar: {
+                    type: "complex",
+                    default: {
+                        key1: "value1",
+                        key2: 123,
+                    },
+                },
             },
             targets: {
                 dev_test: {
@@ -112,6 +119,10 @@ describe("Bundle Variables", async function () {
             value: "dev",
             defaultValue: "default",
         });
+        await assertVariableValue(section, "complexVar", {
+            value: `{"key1":"value1","key2":123}`,
+            defaultValue: `{"key1":"value1","key2":123}`,
+        });
     });
 
     it("should override default variable", async function () {

packages/databricks-vscode/src/ui/bundle-variables/VariableTreeNode.ts

@@ -10,13 +10,37 @@ export class VariableTreeNode implements BundleVariableTreeNode {
         public readonly parent?: BundleVariableTreeNode
     ) {}
 
+    get targetValue() {
+        const value =
+            this.value.vscodeOverrideValue ?? this.value.valueInTarget ?? "";
+        if (this.value.type === "complex") {
+            return this.complexValueToString(value);
+        } else {
+            return String(value);
+        }
+    }
+
+    get defaultValue() {
+        const value = this.value.default ?? this.value.valueInTarget;
+        if (this.value.type === "complex") {
+            return this.complexValueToString(value);
+        } else {
+            return String(value);
+        }
+    }
+
+    complexValueToString(value: any) {
+        try {
+            return JSON.stringify(value);
+        } catch (error) {
+            return "complex vairable";
+        }
+    }
+
     getTreeItem(): BundleVariableTreeItem {
         return {
             label: this.key,
-            description:
-                this.value.vscodeOverrideValue ??
-                this.value.valueInTarget ??
-                "",
+            description: this.targetValue,
             collapsibleState: this.value.valueInTarget
                 ? TreeItemCollapsibleState.Collapsed
                 : TreeItemCollapsibleState.None,
@@ -28,7 +52,7 @@ export class VariableTreeNode implements BundleVariableTreeNode {
             return [
                 new TreeItemTreeNode({
                     label: "Default",
-                    description: this.value.default ?? this.value.valueInTarget,
+                    description: this.defaultValue,
                 }),
             ];
         }