Users/fnbalaji/dedicated gateway second cut (#812)

* src/SelfServe/Example/SelfServeExample.rp.ts.
Portal changes for DedicatedGateway

1. Change Sqlx endpoints to SqlDedicatedGateway endpoint

2. Remove D32s from the SKU list

3. Add telemetry

4. Remove SKU details field per discussion

5. Support dynamic instance scaling.

* format files to ensure format check and lint tests pass

* Lint fixes

* Lint fixes

* Added metrics blade link

* updated conditions for warning banner

* fixed lint error

* Incorporate metrics link and CR feedback

* Lint fixes

* CR feedback and fix links

* CR feedback and fix links

* Link fix

* More fixes to the Dedicated Gateway layout

* Format check

* Fix casing

Co-authored-by: Srinath Narayanan <srnara@microsoft.com>

src/SelfServe/SqlX/SqlX.tsx

@@ -1,9 +1,10 @@
-import { IsDisplayable, OnChange, RefreshOptions, Values } from "../Decorators";
+import { IsDisplayable, OnChange, PropertyInfo, RefreshOptions, Values } from "../Decorators";
 import { selfServeTrace } from "../SelfServeTelemetryProcessor";
 import {
   ChoiceItem,
   Description,
   DescriptionType,
+  Info,
   InputType,
   NumberUiType,
   OnSaveResult,
@@ -46,15 +47,6 @@ const metricsStringValue: Description = {
   },
 };
 
-const resizingDecisionValue: Description = {
-  textTKey: "ResizingDecisionText",
-  type: DescriptionType.Text,
-  link: {
-    href: "https://aka.ms/cosmos-db-dedicated-gateway-size",
-    textTKey: "ResizingDecisionLink",
-  },
-};
-
 const CosmosD4s = "Cosmos.D4s";
 const CosmosD8s = "Cosmos.D8s";
 const CosmosD16s = "Cosmos.D16s";
@@ -104,7 +96,6 @@ const onEnableDedicatedGatewayChange = (
     currentValues.set("warningBanner", baselineValues.get("warningBanner"));
     currentValues.set("connectionString", baselineValues.get("connectionString"));
     currentValues.set("metricsString", baselineValues.get("metricsString"));
-    currentValues.set("resizingDecisionString", baselineValues.get("resizingDecisionString"));
     return currentValues;
   }
 
@@ -157,11 +148,6 @@ const onEnableDedicatedGatewayChange = (
     hidden: !newValue || !dedicatedGatewayOriginallyEnabled,
   });
 
-  currentValues.set("resizingDecisionString", {
-    value: resizingDecisionValue,
-    hidden: !newValue || !dedicatedGatewayOriginallyEnabled,
-  });
-
   return currentValues;
 };
 
@@ -183,6 +169,14 @@ const getInstancesMax = async (): Promise<number> => {
   return 5;
 };
 
+const NumberOfInstancesDropdownInfo: Info = {
+  messageTKey: "ResizingDecisionText",
+  link: {
+    href: "https://aka.ms/cosmos-db-dedicated-gateway-size",
+    textTKey: "ResizingDecisionLink",
+  },
+};
+
 @IsDisplayable()
 @RefreshOptions({ retryIntervalInMs: 20000 })
 export default class SqlX extends SelfServeBaseClass {
@@ -279,10 +273,6 @@ export default class SqlX extends SelfServeBaseClass {
       value: undefined,
       hidden: true,
     });
-    defaults.set("resizingDecisionString", {
-      value: undefined,
-      hidden: true,
-    });
 
     const response = await getCurrentProvisioningState();
     if (response.status && response.status !== "Deleting") {
@@ -299,13 +289,7 @@ export default class SqlX extends SelfServeBaseClass {
         value: metricsStringValue,
         hidden: false,
       });
-
-      defaults.set("resizingDecisionString", {
-        value: resizingDecisionValue,
-        hidden: false,
-      });
     }
-
     defaults.set("warningBanner", undefined);
     return defaults;
   };
@@ -344,6 +328,7 @@ export default class SqlX extends SelfServeBaseClass {
   sku: ChoiceItem;
 
   @OnChange(onNumberOfInstancesChange)
+  @PropertyInfo(NumberOfInstancesDropdownInfo)
   @Values({
     labelTKey: "NumberOfInstances",
     min: getInstancesMin,
@@ -353,16 +338,6 @@ export default class SqlX extends SelfServeBaseClass {
   })
   instances: number;
 
-  @Values({
-    description: metricsStringValue,
-  })
-  metricsString: string;
-
-  @Values({
-    description: resizingDecisionValue,
-  })
-  resizingDecisionString: string;
-
   @Values({
     labelTKey: "Cost",
     isDynamicDescription: true,
@@ -374,4 +349,10 @@ export default class SqlX extends SelfServeBaseClass {
     isDynamicDescription: true,
   })
   connectionString: string;
+
+  @Values({
+    labelTKey: "MonitorUsage",
+    description: metricsStringValue,
+  })
+  metricsString: string;
 }