Undo temporary changes made (#13349)

extensions/arc/src/ui/dashboards/postgres/postgresComputeAndStoragePage.ts

@@ -118,10 +118,13 @@ export class PostgresComputeAndStoragePage extends DashboardPage {
 		computeInfoAndLinks.addItem(infoComputeStorage_p6, { CSSStyles: { 'margin-right': '5px' } });
 		content.addItem(computeInfoAndLinks, { CSSStyles: { 'min-height': '30px' } });
 
-
+		content.addItem(this.modelView.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
+			value: loc.workerNodes,
+			CSSStyles: { ...cssStyles.title, 'margin-top': '25px' }
+		}).component());
 
 		this.workerContainer = this.modelView.modelBuilder.divContainer().component();
-		this.handleServiceUpdated();
+		this.workerContainer.addItems(this.createUserInputSection(), { CSSStyles: { 'min-height': '30px' } });
 		content.addItem(this.workerContainer, { CSSStyles: { 'min-height': '30px' } });
 
 		this.initialized = true;
@@ -140,12 +143,6 @@ export class PostgresComputeAndStoragePage extends DashboardPage {
 		this.disposables.push(
 			this.saveButton.onDidClick(async () => {
 				this.saveButton!.enabled = false;
-				this.discardButton!.enabled = false;
-				this.workerBox!.value = '';
-				this.coresRequestBox!.value = '';
-				this.coresLimitBox!.value = '';
-				this.memoryRequestBox!.value = '';
-				this.memoryLimitBox!.value = '';
 				try {
 					await vscode.window.withProgress(
 						{
@@ -162,6 +159,8 @@ export class PostgresComputeAndStoragePage extends DashboardPage {
 
 					vscode.window.showInformationMessage(loc.instanceUpdated(this._postgresModel.info.name));
 
+					this.discardButton!.enabled = false;
+
 				} catch (error) {
 					vscode.window.showErrorMessage(loc.instanceUpdateFailed(this._postgresModel.info.name, error));
 				}
@@ -198,7 +197,8 @@ export class PostgresComputeAndStoragePage extends DashboardPage {
 		this.workerBox = this.modelView.modelBuilder.inputBox().withProperties<azdata.InputBoxProperties>({
 			readOnly: false,
 			validationErrorMessage: loc.workerValidationErrorMessage,
-			inputType: 'number'
+			inputType: 'number',
+			placeHolder: loc.loading
 		}).component();
 
 		this.disposables.push(
@@ -215,7 +215,8 @@ export class PostgresComputeAndStoragePage extends DashboardPage {
 			readOnly: false,
 			min: 1,
 			validationErrorMessage: loc.coresValidationErrorMessage,
-			inputType: 'number'
+			inputType: 'number',
+			placeHolder: loc.loading
 		}).component();
 
 		this.disposables.push(
@@ -232,7 +233,8 @@ export class PostgresComputeAndStoragePage extends DashboardPage {
 			readOnly: false,
 			min: 1,
 			validationErrorMessage: loc.coresValidationErrorMessage,
-			inputType: 'number'
+			inputType: 'number',
+			placeHolder: loc.loading
 		}).component();
 
 		this.disposables.push(
@@ -249,7 +251,8 @@ export class PostgresComputeAndStoragePage extends DashboardPage {
 			readOnly: false,
 			min: 0.25,
 			validationErrorMessage: loc.memoryLimitValidationErrorMessage,
-			inputType: 'number'
+			inputType: 'number',
+			placeHolder: loc.loading
 		}).component();
 
 		this.disposables.push(
@@ -266,7 +269,8 @@ export class PostgresComputeAndStoragePage extends DashboardPage {
 			readOnly: false,
 			min: 0.25,
 			validationErrorMessage: loc.memoryRequestValidationErrorMessage,
-			inputType: 'number'
+			inputType: 'number',
+			placeHolder: loc.loading
 		}).component();
 
 		this.disposables.push(
@@ -281,6 +285,24 @@ export class PostgresComputeAndStoragePage extends DashboardPage {
 
 	}
 
+	private createUserInputSection(): azdata.Component[] {
+		if (this._postgresModel.configLastUpdated) {
+			this.editWorkerNodeCount();
+			this.editCores();
+			this.editMemory();
+		}
+
+		return [
+			this.createWorkerNodesSectionContainer(),
+			this.createCoresMemorySection(),
+			this.createConfigurationSectionContainer(loc.coresRequest, this.coresRequestBox!),
+			this.createConfigurationSectionContainer(loc.coresLimit, this.coresLimitBox!),
+			this.createConfigurationSectionContainer(loc.memoryRequest, this.memoryRequestBox!),
+			this.createConfigurationSectionContainer(loc.memoryLimit, this.memoryLimitBox!)
+
+		];
+	}
+
 	private createWorkerNodesSectionContainer(): azdata.FlexContainer {
 		const inputFlex = { flex: '0 1 150px' };
 		const keyFlex = { flex: `0 1 250px` };
@@ -460,30 +482,8 @@ export class PostgresComputeAndStoragePage extends DashboardPage {
 	}
 
 	private handleServiceUpdated() {
-		if (this._postgresModel.configLastUpdated) {
+		this.editWorkerNodeCount();
-			this.editWorkerNodeCount();
+		this.editCores();
-			this.editCores();
+		this.editMemory();
-			this.editMemory();
-
-			// Workaround https://github.com/microsoft/azuredatastudio/issues/13134
-			// by only adding these once the model has data. After the bug is fixed,
-			// use loading indicators instead of keeping the page blank.
-			if (this.workerContainer?.items.length === 0) {
-				this.workerContainer.addItem(this.modelView.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
-					value: loc.workerNodes,
-					CSSStyles: { ...cssStyles.title, 'margin-top': '25px' }
-				}).component());
-
-				this.workerContainer.addItems([
-					this.createWorkerNodesSectionContainer(),
-					this.createCoresMemorySection(),
-					this.createConfigurationSectionContainer(loc.coresRequest, this.coresRequestBox!),
-					this.createConfigurationSectionContainer(loc.coresLimit, this.coresLimitBox!),
-					this.createConfigurationSectionContainer(loc.memoryRequest, this.memoryRequestBox!),
-					this.createConfigurationSectionContainer(loc.memoryLimit, this.memoryLimitBox!)
-
-				]);
-			}
-		}
 	}
 }