[accessibility-3556570]: [Programmatic Access- Azure Cosmos DB- Data Explorer]: Ensures elements with an ARIA role that require child roles contain them.

configs/emulator.json

@@ -1,22 +0,0 @@
-{
-  "EmulatorMasterKey": "C2y6yDjf5/R+ob0N8A7Cgv30VRDJIWEHLM+4QDU5DE2nQ9nDuVTqobD4b8mGGyPMbIZnqyMsEcaGQy67XIw/Jw==",
-  "Account": {
-    "name": "",
-    "id": "",
-    "location": "",
-    "type": "",
-    "kind": "DocumentDB",
-    "properties": {
-      "documentEndpoint": "",
-      "tableEndpoint": "",
-      "gremlinEndpoint": "",
-      "cassandraEndpoint": "",
-      "capabilities": [
-        {
-          "name": "EnableNoSQLVectorSearch",
-          "description": "Enable Vector Search on NoSQL account"
-        }
-      ]
-    }
-  }
-}

src/Common/Constants.ts

@@ -446,6 +446,10 @@ export enum PoolIdType {
   QueryCopilot = "query-copilot",
 }
 
+export const EmulatorMasterKey =
+  //[SuppressMessage("Microsoft.Security", "CS002:SecretInNextLine", Justification="Well known public masterKey for emulator")]
+  "C2y6yDjf5/R+ob0N8A7Cgv30VRDJIWEHLM+4QDU5DE2nQ9nDuVTqobD4b8mGGyPMbIZnqyMsEcaGQy67XIw/Jw==";
+
 export class Notebook {
   public static readonly defaultBasePath = "./notebooks";
   public static readonly heartbeatDelayMs = 60000;

src/Common/CosmosClient.ts

@@ -1,7 +1,6 @@
 import * as Cosmos from "@azure/cosmos";
 import { getAuthorizationTokenUsingResourceTokens } from "Common/getAuthorizationTokenUsingResourceTokens";
 import { AuthorizationToken } from "Contracts/FabricMessageTypes";
-import { EmulatorMasterKey } from "Platform/Emulator/emulatorAccount";
 import { checkDatabaseResourceTokensValidity } from "Platform/Fabric/FabricUtil";
 import { LocalStorageUtility, StorageKey } from "Shared/StorageUtility";
 import { useNewPortalBackendEndpoint } from "Utils/EndpointUtils";
@@ -12,7 +11,7 @@ import { Platform, configContext } from "../ConfigContext";
 import { updateUserContext, userContext } from "../UserContext";
 import { logConsoleError } from "../Utils/NotificationConsoleUtils";
 import * as PriorityBasedExecutionUtils from "../Utils/PriorityBasedExecutionUtils";
-import { HttpHeaders } from "./Constants";
+import { EmulatorMasterKey, HttpHeaders } from "./Constants";
 import { getErrorMessage } from "./ErrorHandlingUtils";
 
 const _global = typeof self === "undefined" ? window : self;

src/Contracts/MessageTypes.ts

@@ -41,6 +41,7 @@ export enum MessageTypes {
   OpenPostgreSQLPasswordReset,
   OpenPostgresNetworkingBlade,
   OpenCosmosDBNetworkingBlade,
+  DisplayNPSSurvey,
   OpenVCoreMongoNetworkingBlade,
   OpenVCoreMongoConnectionStringsBlade,
   GetAuthorizationToken, // unused. Can be removed if the portal uses the same list of enums.

src/Explorer/Explorer.tsx

@@ -35,7 +35,7 @@ import { PhoenixClient } from "../Phoenix/PhoenixClient";
 import * as ExplorerSettings from "../Shared/ExplorerSettings";
 import { Action, ActionModifiers } from "../Shared/Telemetry/TelemetryConstants";
 import * as TelemetryProcessor from "../Shared/Telemetry/TelemetryProcessor";
-import { updateUserContext, userContext } from "../UserContext";
+import { isAccountNewerThanThresholdInMs, updateUserContext, userContext } from "../UserContext";
 import { getCollectionName, getUploadName } from "../Utils/APITypeUtils";
 import { stringToBlob } from "../Utils/BlobUtils";
 import { isCapabilityEnabled } from "../Utils/CapabilityUtils";
@@ -278,6 +278,37 @@ export default class Explorer {
     }
   }
 
+  public openNPSSurveyDialog(): void {
+    if (!Platform.Portal || !["Postgres", "SQL", "Mongo"].includes(userContext.apiType)) {
+      return;
+    }
+
+    const ONE_DAY_IN_MS = 86400000;
+    const SEVEN_DAYS_IN_MS = 604800000;
+
+    // Try Cosmos DB subscription - survey shown to 100% of users at day 1 in Data Explorer.
+    if (userContext.isTryCosmosDBSubscription) {
+      if (isAccountNewerThanThresholdInMs(userContext.databaseAccount?.systemData?.createdAt || "", ONE_DAY_IN_MS)) {
+        Logger.logInfo(
+          `Sending message to Portal to check if NPS Survey can be displayed in Try Cosmos DB ${userContext.apiType}`,
+          "Explorer/openNPSSurveyDialog",
+        );
+        sendMessage({ type: MessageTypes.DisplayNPSSurvey });
+      }
+    } else {
+      // Show survey when an existing account is older than 7 days
+      if (
+        !isAccountNewerThanThresholdInMs(userContext.databaseAccount?.systemData?.createdAt || "", SEVEN_DAYS_IN_MS)
+      ) {
+        Logger.logInfo(
+          `Sending message to Portal to check if NPS Survey can be displayed for existing ${userContext.apiType} account older than 7 days`,
+          "Explorer/openNPSSurveyDialog",
+        );
+        sendMessage({ type: MessageTypes.DisplayNPSSurvey });
+      }
+    }
+  }
+
   public async openCESCVAFeedbackBlade(): Promise<void> {
     sendMessage({ type: MessageTypes.OpenCESCVAFeedbackBlade });
     Logger.logInfo(

src/Explorer/Panes/SettingsPane/SettingsPane.tsx

@@ -174,26 +174,15 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({
   const styles = useStyles();
 
   const explorerVersion = configContext.gitSha;
-  const isEmulator = configContext.platform === Platform.Emulator;
   const shouldShowQueryPageOptions = userContext.apiType === "SQL";
-  const showRetrySettings =
-    (userContext.apiType === "SQL" || userContext.apiType === "Tables" || userContext.apiType === "Gremlin") &&
-    !isEmulator;
-  const shouldShowGraphAutoVizOption = userContext.apiType === "Gremlin" && !isEmulator;
-  const shouldShowCrossPartitionOption = userContext.apiType !== "Gremlin" && !isEmulator;
-  const shouldShowParallelismOption = userContext.apiType !== "Gremlin" && !isEmulator;
-  const showEnableEntraIdRbac =
-    userContext.apiType === "SQL" &&
-    userContext.authType === AuthType.AAD &&
-    configContext.platform !== Platform.Fabric &&
-    !isEmulator;
-  const shouldShowPriorityLevelOption = PriorityBasedExecutionUtils.isFeatureEnabled() && !isEmulator;
+  const shouldShowGraphAutoVizOption = userContext.apiType === "Gremlin";
+  const shouldShowCrossPartitionOption = userContext.apiType !== "Gremlin";
+  const shouldShowParallelismOption = userContext.apiType !== "Gremlin";
+  const shouldShowPriorityLevelOption = PriorityBasedExecutionUtils.isFeatureEnabled();
   const shouldShowCopilotSampleDBOption =
     userContext.apiType === "SQL" &&
     useQueryCopilot.getState().copilotEnabled &&
-    useDatabases.getState().sampleDataResourceTokenCollection &&
-    !isEmulator;
-
+    useDatabases.getState().sampleDataResourceTokenCollection;
   const handlerOnSubmit = async () => {
     setIsExecuting(true);
 
@@ -552,37 +541,39 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({
               </AccordionPanel>
             </AccordionItem>
           )}
-          {showEnableEntraIdRbac && (
-            <AccordionItem value="2">
-              <AccordionHeader>
-                <div className={styles.header}>Enable Entra ID RBAC</div>
-              </AccordionHeader>
-              <AccordionPanel>
-                <div className={styles.settingsSectionContainer}>
-                  <div className={styles.settingsSectionDescription}>
-                    Choose Automatic to enable Entra ID RBAC automatically. True/False to force enable/disable Entra ID
-                    RBAC.
-                    <a
-                      href="https://learn.microsoft.com/en-us/azure/cosmos-db/how-to-setup-rbac#use-data-explorer"
-                      target="_blank"
-                      rel="noopener noreferrer"
-                    >
-                      {" "}
-                      Learn more{" "}
-                    </a>
+          {userContext.apiType === "SQL" &&
+            userContext.authType === AuthType.AAD &&
+            configContext.platform !== Platform.Fabric && (
+              <AccordionItem value="2">
+                <AccordionHeader>
+                  <div className={styles.header}>Enable Entra ID RBAC</div>
+                </AccordionHeader>
+                <AccordionPanel>
+                  <div className={styles.settingsSectionContainer}>
+                    <div className={styles.settingsSectionDescription}>
+                      Choose Automatic to enable Entra ID RBAC automatically. True/False to force enable/disable Entra
+                      ID RBAC.
+                      <a
+                        href="https://learn.microsoft.com/en-us/azure/cosmos-db/how-to-setup-rbac#use-data-explorer"
+                        target="_blank"
+                        rel="noopener noreferrer"
+                      >
+                        {" "}
+                        Learn more{" "}
+                      </a>
+                    </div>
+                    <ChoiceGroup
+                      ariaLabelledBy="enableDataPlaneRBACOptions"
+                      options={dataPlaneRBACOptionsList}
+                      styles={choiceButtonStyles}
+                      selectedKey={enableDataPlaneRBACOption}
+                      onChange={handleOnDataPlaneRBACOptionChange}
+                    />
                   </div>
-                  <ChoiceGroup
-                    ariaLabelledBy="enableDataPlaneRBACOptions"
-                    options={dataPlaneRBACOptionsList}
-                    styles={choiceButtonStyles}
-                    selectedKey={enableDataPlaneRBACOption}
-                    onChange={handleOnDataPlaneRBACOptionChange}
-                  />
-                </div>
-              </AccordionPanel>
-            </AccordionItem>
-          )}
-          {userContext.apiType === "SQL" && !isEmulator && (
+                </AccordionPanel>
+              </AccordionItem>
+            )}
+          {userContext.apiType === "SQL" && (
             <>
               <AccordionItem value="3">
                 <AccordionHeader>
@@ -680,7 +671,7 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({
               </AccordionItem>
             </>
           )}
-          {showRetrySettings && (
+          {(userContext.apiType === "SQL" || userContext.apiType === "Tables" || userContext.apiType === "Gremlin") && (
             <AccordionItem value="6">
               <AccordionHeader>
                 <div className={styles.header}>Retry Settings</div>
@@ -753,30 +744,29 @@ export const SettingsPane: FunctionComponent<{ explorer: Explorer }> = ({
               </AccordionPanel>
             </AccordionItem>
           )}
-          {!isEmulator && (
-            <AccordionItem value="7">
-              <AccordionHeader>
-                <div className={styles.header}>Enable container pagination</div>
-              </AccordionHeader>
-              <AccordionPanel>
-                <div className={styles.settingsSectionContainer}>
-                  <div className={styles.settingsSectionDescription}>
-                    Load 50 containers at a time. Currently, containers are not pulled in alphanumeric order.
-                  </div>
-                  <Checkbox
-                    styles={{
-                      label: { padding: 0 },
-                    }}
-                    className="padding"
-                    ariaLabel="Enable container pagination"
-                    checked={containerPaginationEnabled}
-                    onChange={() => setContainerPaginationEnabled(!containerPaginationEnabled)}
-                    label="Enable container pagination"
-                  />
+
+          <AccordionItem value="7">
+            <AccordionHeader>
+              <div className={styles.header}>Enable container pagination</div>
+            </AccordionHeader>
+            <AccordionPanel>
+              <div className={styles.settingsSectionContainer}>
+                <div className={styles.settingsSectionDescription}>
+                  Load 50 containers at a time. Currently, containers are not pulled in alphanumeric order.
                 </div>
-              </AccordionPanel>
-            </AccordionItem>
-          )}
+                <Checkbox
+                  styles={{
+                    label: { padding: 0 },
+                  }}
+                  className="padding"
+                  ariaLabel="Enable container pagination"
+                  checked={containerPaginationEnabled}
+                  onChange={() => setContainerPaginationEnabled(!containerPaginationEnabled)}
+                  label="Enable container pagination"
+                />
+              </div>
+            </AccordionPanel>
+          </AccordionItem>
           {shouldShowCrossPartitionOption && (
             <AccordionItem value="8">
               <AccordionHeader>

src/Explorer/Tabs/Tabs.tsx

@@ -159,7 +159,7 @@ function TabNav({ tab, active, tabKind }: { tab?: Tab; active: boolean; tabKind?
             </span>
             <span className="tabNavText">{tabTitle}</span>
           </span>
-          <span className="tabIconSection">
+          <span className="tabIconSection" aria-hidden="true">
             <CloseButton tab={tab} active={active} hovering={hovering} tabKind={tabKind} ariaLabel={tabTitle} />
           </span>
         </div>
@@ -247,7 +247,7 @@ function TabPane({ tab, active }: { tab: Tab; active: boolean }) {
   if (tab) {
     if ("render" in tab) {
       return (
-        <div data-test={`Tab:${tab.tabId}`} {...attrs}>
+        <div id={tab.tabId} data-test={`Tab:${tab.tabId}`} {...attrs}>
           {tab.render()}
         </div>
       );

src/Platform/Emulator/emulatorAccount.tsx

@@ -1,4 +1,21 @@
-import emulatorConfig from "../../../configs/emulator.json";
+import { AccountKind } from "../../Common/Constants";
 
-export const EmulatorMasterKey = emulatorConfig.EmulatorMasterKey || "";
-export const emulatorAccount = emulatorConfig.Account || {};
+export const emulatorAccount = {
+  name: "",
+  id: "",
+  location: "",
+  type: "",
+  kind: AccountKind.DocumentDB,
+  properties: {
+    documentEndpoint: "",
+    tableEndpoint: "",
+    gremlinEndpoint: "",
+    cassandraEndpoint: "",
+    capabilities: [
+      {
+        name: "EnableNoSQLVectorSearch",
+        description: "Enable Vector Search on NoSQL account",
+      },
+    ],
+  },
+};

src/hooks/useKnockoutExplorer.ts

@@ -96,6 +96,7 @@ export function useKnockoutExplorer(platform: Platform): Explorer {
   useEffect(() => {
     if (explorer) {
       applyExplorerBindings(explorer);
+      explorer.openNPSSurveyDialog();
     }
   }, [explorer]);
 
@@ -181,11 +182,6 @@ async function configureFabric(): Promise<Explorer> {
 }
 
 const openFirstContainer = async (explorer: Explorer, databaseName: string, collectionName?: string) => {
-  if (useTabs.getState().openedTabs.length > 0) {
-    // Don't open any tabs if there are already tabs open
-    return;
-  }
-
   // Expand database first
   databaseName = sessionStorage.getItem("openDatabaseName") ?? databaseName;
   const database = useDatabases.getState().databases.find((db) => db.id() === databaseName);