Larry change requests

src/commands/serverCommand.ts

@@ -137,7 +137,9 @@ export async function addInsightsConnection(
     await updateInsights(insights);
     const newInsights = getInsights();
     if (newInsights != undefined) {
+      ext.latestLblsChanged.length = 0;
       if (labels && labels.length > 0) {
+        ext.latestLblsChanged.push(...labels);
         await handleLabelsConnMap(labels, insightsData.alias);
       }
       ext.serverProvider.refreshInsights(newInsights);
@@ -224,7 +226,9 @@ export async function editInsightsConnection(
 
         const newInsights = getInsights();
         if (newInsights != undefined) {
+          ext.latestLblsChanged.length = 0;
           if (labels && labels.length > 0) {
+            ext.latestLblsChanged.push(...labels);
             await handleLabelsConnMap(labels, insightsData.alias);
           } else {
             removeConnFromLabels(insightsData.alias);
@@ -386,7 +390,9 @@ export async function addKdbConnection(
     await updateServers(servers);
     const newServers = getServers();
     if (newServers != undefined) {
+      ext.latestLblsChanged.length = 0;
       if (labels && labels.length > 0) {
+        ext.latestLblsChanged.push(...labels);
         await handleLabelsConnMap(labels, kdbData.serverAlias);
       }
       Telemetry.sendEvent("Connection.Created.QProcess");
@@ -489,7 +495,9 @@ export async function editKdbConnection(
         }
         const newServers = getServers();
         if (newServers != undefined) {
+          ext.latestLblsChanged.length = 0;
           if (labels && labels.length > 0) {
+            ext.latestLblsChanged.push(...labels);
             await handleLabelsConnMap(labels, kdbData.serverAlias);
           } else {
             removeConnFromLabels(kdbData.serverAlias);

src/extensionVariables.ts

@@ -87,6 +87,7 @@ export namespace ext {
   export const kdbConnectionAliasList: string[] = [];
   export const connLabelList: Labels[] = [];
   export const labelConnMapList: ConnectionLabel[] = [];
+  export const latestLblsChanged: string[] = [];
   export const maxRetryCount = 5;
 
   export let secretSettings: AuthSettings;

src/panels/newConnection.ts

@@ -72,6 +72,16 @@ export class NewConnectionPannel {
     }
   }
 
+  public static refreshLabels() {
+    if (NewConnectionPannel.currentPanel) {
+      NewConnectionPannel.currentPanel._panel.webview.postMessage({
+        command: "refreshLabels",
+        data: ext.connLabelList,
+        colors: ext.labelColors,
+      });
+    }
+  }
+
   private constructor(panel: vscode.WebviewPanel, extensionUri: vscode.Uri) {
     this._extensionUri = extensionUri;
     this._panel = panel;

src/services/kdbTreeProvider.ts

@@ -44,6 +44,7 @@ import { InsightsConnection } from "../classes/insightsConnection";
 import {
   getWorkspaceLabels,
   getWorkspaceLabelsConnMap,
+  isLabelContentChanged,
   isLabelEmpty,
   retrieveConnLabelsNames,
 } from "../utils/connLabel";
@@ -820,12 +821,8 @@ export class LabelNode extends TreeItem {
   readonly children: TreeItem[] = [];
 
   constructor(public readonly source: Labels) {
-    super(
-      source.name,
-      isLabelEmpty(source.name)
-        ? TreeItemCollapsibleState.None
-        : TreeItemCollapsibleState.Collapsed,
-    );
+    super(source.name);
+    this.collapsibleState = this.getCollapsibleState(source.name);
     this.contextValue = "label";
   }
 
@@ -849,4 +846,14 @@ export class LabelNode extends TreeItem {
       `label-${this.source.color.name.toLowerCase()}.svg`,
     ),
   };
+
+  getCollapsibleState(labelName: string): TreeItemCollapsibleState {
+    if (isLabelEmpty(labelName)) {
+      return TreeItemCollapsibleState.None;
+    }
+    if (isLabelContentChanged(labelName)) {
+      return TreeItemCollapsibleState.Expanded;
+    }
+    return TreeItemCollapsibleState.Collapsed;
+  }
 }

src/utils/connLabel.ts

@@ -16,6 +16,7 @@ import { workspace } from "vscode";
 import { ext } from "../extensionVariables";
 import { kdbOutputLog } from "./core";
 import { InsightsNode, KdbNode } from "../services/kdbTreeProvider";
+import { NewConnectionPannel } from "../panels/newConnection";
 
 export function getWorkspaceLabels() {
   const existingConnLbls = workspace
@@ -144,6 +145,7 @@ export function renameLabel(name: string, newName: string) {
         .getConfiguration()
         .update("kdb.connectionLabels", ext.connLabelList, true),
     );
+  NewConnectionPannel.refreshLabels();
 }
 
 export function setLabelColor(name: string, color: string) {
@@ -158,6 +160,7 @@ export function setLabelColor(name: string, color: string) {
   workspace
     .getConfiguration()
     .update("kdb.connectionLabels", ext.connLabelList, true);
+  NewConnectionPannel.refreshLabels();
 }
 
 export function deleteLabel(name: string) {
@@ -169,6 +172,8 @@ export function deleteLabel(name: string) {
   workspace
     .getConfiguration()
     .update("kdb.connectionLabels", ext.connLabelList, true);
+
+  NewConnectionPannel.refreshLabels();
 }
 
 export function isLabelEmpty(name: string) {
@@ -178,3 +183,11 @@ export function isLabelEmpty(name: string) {
   }
   return true;
 }
+
+export function isLabelContentChanged(name: string) {
+  const found = ext.latestLblsChanged.find((item) => item === name);
+  if (found) {
+    return true;
+  }
+  return false;
+}

src/webview/components/kdbNewConnectionView.ts

@@ -330,7 +330,7 @@ export class KdbNewConnectionView extends LitElement {
 
   renderLblDropdownOptions() {
     return html`
-      <vscode-option .value="${undefined}"> No Label Selected </vscode-option>
+      <vscode-option> No Label Selected </vscode-option>
       ${repeat(
         this.lblNamesList,
         (lbl) => lbl.name,
@@ -362,6 +362,7 @@ export class KdbNewConnectionView extends LitElement {
               value="${this.newLblName}"
               @change="${(event: Event) => {
                 this.newLblName = (event.target as HTMLInputElement).value;
+                this.requestUpdate();
               }}"
               id="label-name"
               >Label name</vscode-text-field
@@ -376,6 +377,7 @@ export class KdbNewConnectionView extends LitElement {
               value="${this.newLblColorName}"
               @change="${(event: Event) => {
                 this.newLblColorName = (event.target as HTMLInputElement).value;
+                this.requestUpdate();
               }}"
               class="dropdown"
               style="width: 18.5em;">
@@ -392,7 +394,9 @@ export class KdbNewConnectionView extends LitElement {
             <vscode-button
               aria-label="Create Label"
               appearance="primary"
-              @click="${this.createLabel}">
+              @click="${this.createLabel}"
+              ?disabled="${this.newLblName === "" ||
+              this.newLblColorName === ""}">
               Create
             </vscode-button>
           </div>
@@ -423,10 +427,11 @@ export class KdbNewConnectionView extends LitElement {
             <vscode-dropdown
               id="selectLabel"
               class="dropdown larger"
-              value="${this.labels.length > 0 ? this.labels[0] : ""}"
+              value="${this.labels[0]}"
+              current-value="${this.labels[0]}"
               @change="${(event: Event) => {
-                this.labels.length = 0;
-                this.labels.push((event.target as HTMLInputElement).value);
+                this.labels[0] = (event.target as HTMLInputElement).value;
+                this.requestUpdate();
               }}">
               ${this.renderLblDropdownOptions()}
             </vscode-dropdown>
@@ -505,6 +510,7 @@ export class KdbNewConnectionView extends LitElement {
                     <div class="col gap-0">${this.renderPortNumber(true)}</div>
                   </div>
                   ${this.renderConnectionLabelsSection()}
+                  ${this.renderCreateConnectionBtn()}
                 </div>
               </vscode-panel-view>
               <vscode-panel-view id="view-2" class="panel">
@@ -576,6 +582,7 @@ export class KdbNewConnectionView extends LitElement {
                     </div>
                   </div>
                   ${this.renderConnectionLabelsSection()}
+                  ${this.renderCreateConnectionBtn()}
                 </div>
               </vscode-panel-view>
               <vscode-panel-view id="view-3" class="panel">
@@ -610,22 +617,25 @@ export class KdbNewConnectionView extends LitElement {
                     </div>
                   </div>
                   ${this.renderConnectionLabelsSection()}
+                  ${this.renderCreateConnectionBtn()}
                 </div>
               </vscode-panel-view>
             </vscode-panels>
           </div>
         </div>
-        <div class="col">
-          <div class="row">
-            <vscode-button @click="${() => this.save()}"
-              >Create Connection</vscode-button
-            >
-          </div>
-        </div>
+        <div class="col"></div>
       </div>
     `;
   }
 
+  renderCreateConnectionBtn() {
+    return html`<div class="row">
+      <vscode-button @click="${() => this.save()}"
+        >Create Connection</vscode-button
+      >
+    </div>`;
+  }
+
   renderEditConnectionForm() {
     if (!this.connectionData) {
       return html`<div>No connection found to be edited</div>`;
@@ -653,11 +663,9 @@ export class KdbNewConnectionView extends LitElement {
           </div>
           <div class="row">${this.renderEditConnFields()}</div>
           <div class="row">${this.renderConnectionLabelsSection()}</div>
-        </div>
-        <div class="col">
           <div class="row">
             <vscode-button @click="${() => this.editConnection()}"
-              >Edit Connection</vscode-button
+              >Update Connection</vscode-button
             >
           </div>
         </div>
@@ -885,6 +893,7 @@ export class KdbNewConnectionView extends LitElement {
       },
     });
     setTimeout(() => {
+      this.labels[0] = this.newLblName;
       this.closeModal();
     }, 500);
   }

test/suite/panels.test.ts

@@ -555,5 +555,14 @@ describe("WebPanels", () => {
         "Panel HTML should include expected web component",
       );
     });
+
+    it("should refreshLabels", () => {
+      NewConnectionPannel.render(uriTest);
+      NewConnectionPannel.refreshLabels();
+      assert.ok(
+        NewConnectionPannel.currentPanel,
+        "NewConnectionPannel.currentPanel should be truthy",
+      );
+    });
   });
 });

test/suite/utils.test.ts

@@ -1813,4 +1813,25 @@ describe("Utils", () => {
       assert.strictEqual(result, true);
     });
   });
+
+  describe("isLabelContentChanged", () => {
+    beforeEach(() => {
+      ext.latestLblsChanged.length = 0;
+    });
+
+    afterEach(() => {
+      ext.latestLblsChanged.length = 0;
+    });
+
+    it("should return true if label content is changed", () => {
+      ext.latestLblsChanged.push("label1");
+      const result = LabelsUtils.isLabelContentChanged("label1");
+      assert.strictEqual(result, true);
+    });
+
+    it("should return false if label content is not changed", () => {
+      const result = LabelsUtils.isLabelContentChanged("label1");
+      assert.strictEqual(result, false);
+    });
+  });
 });

test/suite/webview.test.ts

@@ -585,6 +585,17 @@ describe("KdbNewConnectionView", () => {
     });
   });
 
+  describe("renderCreateConnectionBtn", () => {
+    it("should render create connection button", () => {
+      const result = view.renderCreateConnectionBtn();
+
+      assert.strictEqual(
+        JSON.stringify(result).includes("Create Connection"),
+        true,
+      );
+    });
+  });
+
   describe("renderEditConnectionForm", () => {
     it('should return "No connection found to be edited" when connectionData is null', () => {
       view.connectionData = null;