Merge branch 'users/bogercraig/de_read_region_selection' of https://github.com/Azure/cosmos-explorer into users/bogercraig/de_read_region_selection

Updated to have a write client and multiple read clients. Added enum to help with selection of client based on needed operation.
Need to modify endpoint selection in CosmosClient to select endpoints based on client called.
2026-01-11 05:29:54 +00:00 · 2024-03-28 15:37:45 -07:00 · 2024-03-28 15:35:13 -07:00 · 2024-03-28 15:35:13 -07:00 · 2024-03-28 15:35:12 -07:00 · 2024-03-28 15:35:12 -07:00
328 changed files with 31437 additions and 37045 deletions
--- a/.editorconfig
+++ b/.editorconfig
@@ -1,10 +0,0 @@
-# NOTE: Prettier reads EditorConfig settings, so be careful adjusting settings here and assuming they'll only affect your editor ;).
-
-# top-most EditorConfig file
-root = true
-
-[*.yml]
-indent_size = 2
-
-[*.{js,jsx,ts,tsx}]
-indent_size = 2
--- a/.eslintignore
+++ b/.eslintignore
@@ -1,5 +1,3 @@
-playwright.config.ts
-
 **/node_modules/
 src/**/__mocks__/**/*
 dist/
@@ -91,7 +89,10 @@ src/Explorer/Tables/TableEntityProcessor.ts
 src/Explorer/Tables/Utilities.ts
 src/Explorer/Tabs/ConflictsTab.ts
 src/Explorer/Tabs/DatabaseSettingsTab.ts
+src/Explorer/Tabs/DocumentsTab.test.ts
+src/Explorer/Tabs/DocumentsTab.ts
 src/Explorer/Tabs/GraphTab.ts
+src/Explorer/Tabs/MongoDocumentsTab.ts
 src/Explorer/Tabs/NotebookV2Tab.ts
 src/Explorer/Tabs/ScriptTabBase.ts
 src/Explorer/Tabs/TabComponents.ts
@@ -127,7 +128,7 @@ src/Explorer/Controls/InputTypeahead/InputTypeaheadComponent.tsx
 src/Explorer/Controls/Notebook/NotebookTerminalComponent.test.tsx
 src/Explorer/Controls/Notebook/NotebookTerminalComponent.tsx
 src/Explorer/Controls/NotebookViewer/NotebookViewerComponent.tsx
-src/Explorer/Controls/TreeComponent/LegacyTreeComponent.tsx
+src/Explorer/Controls/TreeComponent/TreeComponent.tsx
 src/Explorer/Graph/GraphExplorerComponent/GraphExplorer.test.tsx
 src/Explorer/Graph/GraphExplorerComponent/NodePropertiesComponent.tsx
 src/Explorer/Graph/GraphExplorerComponent/ReadOnlyNodePropertiesComponent.test.tsx
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -8,9 +8,6 @@ on:
  pull_request:
    branches:
      - master
-permissions:
-  id-token: write
-  contents: read
 jobs:
  codemetrics:
    runs-on: ubuntu-latest
@@ -104,6 +101,72 @@ jobs:
        run: az storage blob upload -c '$web' -f ./preview/config.json --account-name cosmosexplorerpreview --name "${{github.event.pull_request.head.sha || github.sha}}/config.json" --account-key="${PREVIEW_STORAGE_KEY}" --overwrite true
        env:
          PREVIEW_STORAGE_KEY: ${{ secrets.PREVIEW_STORAGE_KEY }}
+  endtoendemulator:
+    name: "End To End Emulator Tests"
+    # Temporarily disabled. This test needs to be rewritten in playwright
+    if: false
+    runs-on: windows-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Use Node.js 18.x
+        uses: actions/setup-node@v4
+        with:
+          node-version: 18.x
+      - uses: southpolesteve/cosmos-emulator-github-action@v1
+      - name: End to End Tests
+        run: |
+          npm ci
+          npm start &
+          npm run wait-for-server
+          npx jest -c ./jest.config.e2e.js --detectOpenHandles test/sql/container.spec.ts
+        shell: bash
+        env:
+          DATA_EXPLORER_ENDPOINT: "https://localhost:1234/explorer.html?platform=Emulator"
+          PLATFORM: "Emulator"
+          NODE_TLS_REJECT_UNAUTHORIZED: 0
+      - uses: actions/upload-artifact@v3
+        if: failure()
+        with:
+          name: screenshots
+          path: failed-*
+  endtoend:
+    name: "E2E"
+    runs-on: ubuntu-latest
+    env:
+      NODE_TLS_REJECT_UNAUTHORIZED: 0
+      NOTEBOOKS_TEST_RUNNER_CLIENT_SECRET: ${{ secrets.NOTEBOOKS_TEST_RUNNER_CLIENT_SECRET }}
+    strategy:
+      fail-fast: false
+      matrix:
+        test-file:
+          - ./test/cassandra/container.spec.ts
+          - ./test/graph/container.spec.ts
+          - ./test/sql/container.spec.ts
+          - ./test/mongo/container.spec.ts
+          - ./test/mongo/container32.spec.ts
+          - ./test/selfServe/selfServeExample.spec.ts
+          # - ./test/notebooks/upload.spec.ts // TEMP disabled since notebooks service is off
+          - ./test/sql/resourceToken.spec.ts
+          - ./test/tables/container.spec.ts
+    steps:
+      - uses: actions/checkout@v4
+      - name: Use Node.js 18.x
+        uses: actions/setup-node@v4
+        with:
+          node-version: 18.x
+      - run: npm ci
+      - run: npm start &
+      - run: npm run wait-for-server
+      - name: ${{ matrix['test-file'] }}
+        run: |
+          # Run tests up to three times
+          for i in $(seq 1 3); do npx jest -c ./jest.config.playwright.js ${{ matrix['test-file'] }} && s=0 && break || s=$? && sleep 1; done; (exit $s)
+        shell: bash
+      - uses: actions/upload-artifact@v3
+        if: failure()
+        with:
+          name: screenshots
+          path: screenshots/
  nuget:
    name: Publish Nuget
    if: github.ref == 'refs/heads/master' || contains(github.ref, 'hotfix/') || contains(github.ref, 'release/')
@@ -153,70 +216,3 @@ jobs:
        name: packages
        with:
          path: "*.nupkg"
-
-  playwright-tests:
-    name: "Run Playwright Tests (Shard ${{ matrix.shardIndex }} of ${{ matrix.shardTotal }})"
-    runs-on: ubuntu-latest
-    env:
-      NODE_TLS_REJECT_UNAUTHORIZED: 0
-      AZURE_SUBSCRIPTION_ID: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
-    strategy:
-      fail-fast: false
-      matrix:
-        shardIndex: [1, 2, 3, 4, 5, 6, 7, 8]
-        shardTotal: [8]
-    steps:
-      - uses: actions/checkout@v4
-      - name: "Az CLI login"
-        uses: azure/login@v1
-        with:
-          client-id: ${{ secrets.AZURE_CLIENT_ID }}
-          tenant-id: ${{ secrets.AZURE_TENANT_ID }}
-          subscription-id: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
-      - name: Use Node.js 18.x
-        uses: actions/setup-node@v4
-        with:
-          node-version: 18.x
-      - run: npm ci
-      - run: npx playwright install --with-deps
-      - name: Run test shard ${{ matrix['shardIndex'] }} of ${{ matrix['shardTotal']}}
-        run: npx playwright test --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }}
-      - name: Upload blob report to GitHub Actions Artifacts
-        if: ${{ !cancelled() }}
-        uses: actions/upload-artifact@v4
-        with:
-            name: blob-report-${{ matrix.shardIndex }}
-            path: blob-report
-            retention-days: 1
-
-  merge-playwright-reports:
-    name: "Merge Playwright Reports"
-    # Merge reports after playwright-tests, even if some shards have failed
-    if: ${{ !cancelled() }}
-    needs: [playwright-tests]
-
-    runs-on: ubuntu-latest
-    steps:
-    - uses: actions/checkout@v4
-    - uses: actions/setup-node@v4
-      with:
-        node-version: 18
-    - name: Install dependencies
-      run: npm ci
-
-    - name: Download blob reports from GitHub Actions Artifacts
-      uses: actions/download-artifact@v4
-      with:
-        path: all-blob-reports
-        pattern: blob-report-*
-        merge-multiple: true
-
-    - name: Merge into HTML Report
-      run: npx playwright merge-reports --reporter html ./all-blob-reports
-
-    - name: Upload HTML report
-      uses: actions/upload-artifact@v4
-      with:
-        name: html-report--attempt-${{ github.run_attempt }}
-        path: playwright-report
-        retention-days: 14
--- a/.github/workflows/cleanup.yml
+++ b/.github/workflows/cleanup.yml
@@ -9,10 +9,6 @@ on:
    # Once every hour
    - cron: "0 15 * * *"

-permissions:
-  id-token: write
-  contents: read
-
 # A workflow run is made up of one or more jobs that can run sequentially or in parallel
 jobs:
  # This workflow contains a single job called "build"
@@ -20,17 +16,10 @@ jobs:
    name: "Cleanup Test Database Accounts"
    runs-on: ubuntu-latest
    env:
-      AZURE_SUBSCRIPTION_ID: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
+      NOTEBOOKS_TEST_RUNNER_CLIENT_ID: ${{ secrets.NOTEBOOKS_TEST_RUNNER_CLIENT_ID }}
+      NOTEBOOKS_TEST_RUNNER_CLIENT_SECRET: ${{ secrets.NOTEBOOKS_TEST_RUNNER_CLIENT_SECRET }}
    steps:
      - uses: actions/checkout@v2
-
-      - name: "Az CLI login"
-        uses: azure/login@v1
-        with:
-          client-id: ${{ secrets.AZURE_CLIENT_ID }}
-          tenant-id: ${{ secrets.AZURE_TENANT_ID }}
-          subscription-id: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
-
      - name: Use Node.js 18.x
        uses: actions/setup-node@v1
        with:
--- a/.gitignore
+++ b/.gitignore
@@ -17,7 +17,4 @@ Contracts/*
 failure.png
 screenshots/*
 GettingStarted-ignore*.ipynb
-/test-results/
-/playwright-report/
-/blob-report/
-/playwright/.cache/
+.vscode/
--- a/.npmrc
+++ b/.npmrc
@@ -1,4 +1 @@
-save-exact=true
-
-# Ignore peer dependency conflicts
-force=true # TODO: Remove this when we update to React 17 or higher!
+save-exact=true
--- a/canvas/README.md
+++ b/canvas/README.md
@@ -0,0 +1,7 @@
+# Why?
+
+This adds a mock module for `canvas`. Nteract has a ignored require and undeclared dependency on this module. `cavnas` is a server side node module and is not used in browser side code for nteract.
+
+Installing it locally (`npm install canvas`) will resolve the problem, but it is a native module so it is flaky depending on the system, node version, processor arch, etc. This module provides a simpler, more robust solution.
+
+Remove this workaround if [this bug](https://github.com/nteract/any-vega/issues/2) ever gets resolved 
--- a/canvas/index.js
+++ b/canvas/index.js
@@ -0,0 +1 @@
+module.exports = {}
--- a/canvas/package.json
+++ b/canvas/package.json
@@ -0,0 +1,11 @@
+{
+  "name": "canvas",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC"
+}
--- a/images/EntraID.svg
+++ b/images/EntraID.svg
@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="uuid-f8d4d392-7c12-4bd9-baff-66fbf7814b91" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
-  <path d="m3.802,14.032c.388.242,1.033.511,1.715.511.621,0,1.198-.18,1.676-.487,0,0,.001,0,.002-.001l1.805-1.128v4.073c-.286,0-.574-.078-.824-.234l-4.374-2.734Z" fill="#225086"/>
-  <path d="m7.853,1.507L.353,9.967c-.579.654-.428,1.642.323,2.111,0,0,2.776,1.735,3.126,1.954.388.242,1.033.511,1.715.511.621,0,1.198-.18,1.676-.487,0,0,.001,0,.002-.001l1.805-1.128-4.364-2.728,4.365-4.924V1s0,0,0,0c-.424,0-.847.169-1.147.507Z" fill="#6df"/>
-  <polygon points="4.636 10.199 4.688 10.231 9 12.927 9.001 12.927 9.001 12.927 9.001 5.276 9 5.275 4.636 10.199" fill="#cbf8ff"/>
-  <path d="m17.324,12.078c.751-.469.902-1.457.323-2.111l-4.921-5.551c-.397-.185-.842-.291-1.313-.291-.925,0-1.752.399-2.302,1.026l-.109.123h0s4.364,4.924,4.364,4.924h0s0,0,0,0l-4.365,2.728v4.073c.287,0,.573-.078.823-.234l7.5-4.688Z" fill="#074793"/>
-  <path d="m9.001,1v4.275s.109-.123.109-.123c.55-.627,1.377-1.026,2.302-1.026.472,0,.916.107,1.313.291l-2.579-2.909c-.299-.338-.723-.507-1.146-.507Z" fill="#0294e4"/>
-  <polygon points="13.365 10.199 13.365 10.199 13.365 10.199 9.001 5.276 9.001 12.926 13.365 10.199" fill="#96bcc2"/>
-</svg>
--- a/jest-playwright.config.js
+++ b/jest-playwright.config.js
@@ -0,0 +1,13 @@
+const isCI = require("is-ci");
+
+module.exports = {
+  exitOnPageError: false,
+  launchOptions: {
+    headless: isCI,
+    slowMo: 10,
+    timeout: 60000,
+  },
+  contextOptions: {
+    ignoreHTTPSErrors: true,
+  },
+};
--- a/jest.config.js
+++ b/jest.config.js
@@ -31,7 +31,7 @@ module.exports = {
  coveragePathIgnorePatterns: ["/node_modules/"],

  // A list of reporter names that Jest uses when writing coverage reports
-  coverageReporters: ["json", "text", "cobertura", "lcov"],
+  coverageReporters: ["json", "text", "cobertura"],

  // An object that configures minimum threshold enforcement for coverage results
  coverageThreshold: {
@@ -76,11 +76,6 @@ module.exports = {
    "^dnd-core$": "dnd-core/dist/cjs",
    "^react-dnd$": "react-dnd/dist/cjs",
    "^react-dnd-html5-backend$": "react-dnd-html5-backend/dist/cjs",
-    "d3-force": "<rootDir>/node_modules/d3-force/dist/d3-force.min.js",
-    "d3-quadtree": "<rootDir>/node_modules/d3-quadtree/dist/d3-quadtree.min.js",
-    "d3-scale-chromatic": "<rootDir>/node_modules/d3-scale-chromatic/dist/d3-scale-chromatic.min.js",
-    "d3-zoom": "<rootDir>/node_modules/d3-zoom/dist/d3-zoom.min.js",
-    uuid: require.resolve("uuid"), // Force module uuid to resolve with the CJS entry point, because Jest does not support package.json.exports. See https://github.com/uuidjs/uuid/issues/451
  },

  // An array of regexp pattern strings, matched against all module paths before considered 'visible' to the module loader
@@ -134,7 +129,8 @@ module.exports = {
  snapshotSerializers: ["enzyme-to-json/serializer"],

  // The test environment that will be used for testing
-  testEnvironment: "jsdom",
+  // testEnvironment: "jest-environment-jsdom",
+
  modulePaths: ["node_modules", "<rootDir>/src"],

  // Options that will be passed to the testEnvironment
@@ -158,7 +154,7 @@ module.exports = {
  // testResultsProcessor: "./trxProcessor.js",

  // This option allows use of a custom test runner
-  testRunner: "jest-circus/runner",
+  // testRunner: "jasmine2",

  // This option sets the URL for the jsdom environment. It is reflected in properties such as location.href
  // testURL: "http://localhost",
@@ -168,9 +164,9 @@ module.exports = {

  // A map from regular expressions to paths to transformers
  transform: {
-    "^.+\\.html?$": "jest-html-loader",
+    "^.+\\.html?$": "html-loader-jest",
    "^.+\\.[t|j]sx?$": "babel-jest",
-    "^.+\\.svg$": "<rootDir>/jest/svgTransform.js",
+    "^.+\\.svg$": "<rootDir>/svgTransform.js",
  },

  // An array of regexp pattern strings that are matched against all source file paths, matched files will skip transformation
@@ -187,7 +183,4 @@ module.exports = {

  // Whether to use watchman for file crawling
  // watchman: true,
-
-  // TODO: toMatchInlineSnapshot() does not work with prettier 3. Remove when fixed: https://github.com/jestjs/jest/issues/14305
-  prettierPath: null,
 };
--- a/jest.config.playwright.js
+++ b/jest.config.playwright.js
@@ -0,0 +1,7 @@
+module.exports = {
+  preset: "jest-playwright-preset",
+  testMatch: ["<rootDir>/test/**/*.spec.[jt]s?(x)"],
+  setupFiles: ["dotenv/config"],
+  testEnvironment: "./test/playwrightEnv.js",
+  setupFilesAfterEnv: ["expect-playwright"],
+};
--- a/less/Common/Constants.less
+++ b/less/Common/Constants.less
@@ -130,7 +130,6 @@
@ActiveTabWidth: 141px;
@TabsHeight: 30px;
@TabsWidth: 140px;
-@ContentWrapper: 111px;
@StatusIconContainerSize: 18px;
@LoadingErrorIconSize: 14px;
@ErrorIconContainer: 16px;
@@ -168,7 +167,7 @@

@FabricBoxBorderRadius: 8px;
@FabricBoxBorderShadow: rgba(0, 0, 0, 0.133) 0px 1.6px 3.6px 0px, rgba(0, 0, 0, 0.11) 0px 0.3px 0.9px 0px;
-@FabricBoxMargin: 4px 8px 4px 8px;
+@FabricBoxMargin: 4px 3px 4px 3px;

@FabricAccentMediumHigh: #0c695a;
@FabricAccentMedium: #117865;
@@ -336,11 +335,4 @@
  width: 0;
  height: 0;
  border-color: @InfoPointerColor transparent;
-}
-/*********************************************************************************************************
-                           Screen Reader Only
-**********************************************************************************************************/
-.screenReaderOnly {
-  position: absolute;
-  left: -9999px;
 }
--- a/less/documentDB.less
+++ b/less/documentDB.less
@@ -1906,7 +1906,7 @@ input::-webkit-calendar-picker-indicator::after {
 }

 .nav-tabs-margin {
-  padding-top: 5px;
+  padding-top: 8px;
  background-color: #f2f2f2;
 }

@@ -2074,6 +2074,14 @@ a:link {
  display: inline;
 }

+.resourceTreeAndTabs {
+  display: flex;
+  flex: 1 1 auto;
+  overflow-x: clip;
+  overflow-y: auto;
+  height: 100%;
+}
+
 .collectiontitle {
  font-size: 14px;
  text-transform: uppercase;
@@ -2256,49 +2264,38 @@ a:link {
  width: 82px;
 }

-// .tabdocuments .scrollable {
-//   height: 100%;
-//   overflow-y: auto;
-//   overflow-x: hidden;
-//   padding-left: 5px;
-//   padding-right: 5px;
-//   width: 100%;
-// }
+.tabdocuments .scrollable {
+  height: 100%;
+  overflow-y: auto;
+  overflow-x: hidden;
+  padding-left: 5px;
+  padding-right: 5px;
+  width: 100%;
+}

-// .tabdocuments > .tabdocumentsGridElement {
-//   width: 50%;
-// }
+.tabdocuments > .tabdocumentsGridElement {
+  width: 50%;
+}

-// .tabdocuments > .evenlySpacedHeader {
-//   width: 30%;
-// }
+.tabdocuments > .evenlySpacedHeader {
+  width: 30%;
+}

-// .tabdocuments.scrollable:focus,
-// .tabdocuments.scrollable:active {
-//   outline: 1px dotted;
-// }
+.tabdocuments.scrollable:focus,
+.tabdocuments.scrollable:active {
+  outline: 1px dotted;
+}

-// .tabdocuments .scrollable table td {
-//   white-space: nowrap;
-//   overflow: hidden;
-//   text-overflow: ellipsis;
-// }
+.tabdocuments .scrollable table td {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}

 .mongoDocumentEditor .monaco-editor.vs .redsquiggly {
  display: none !important;
 }

-.monaco-editor .quick-input-list-label {
-  /* Restore some of Monaco's default styles that are clobbered by our global styles */
-  padding: 0;
-  line-height: 22px;
-}
-
-.monaco-editor .quick-input-list .highlight {
-  /* Padding in highlighted text within the quick input list breaks the flow of the text */
-  padding: 0;
-}
-
 td a {
  color: #393939;
 }
@@ -2308,15 +2305,21 @@ td a:hover {
 }

 .loadMore {
-  display: block;
  width: 100%;
-  text-align: center;
+  padding-left: 30%;
+  padding-top: 2px;
+  cursor: pointer;
 }

 .loadMore > a:focus {
  outline: 1px dotted;
 }

+#content.active .tabdocuments .scrollable {
+  height: 100%;
+  overflow-y: auto;
+}
+
 .table-fixed thead {
  width: 97%;
  padding-left: 18px;
@@ -2352,9 +2355,10 @@ a:link {

 .tabsManagerContainer {
  height: 100%;
-  display: flex;
-  flex-direction: column;
-  min-width: 0; // This prevents it to grow past the parent's width if its content is too wide
+  flex-grow: 1;
+  overflow: hidden;
+  min-height: 300px;
+  overflow-y: scroll;
 }

 .tabs {
@@ -2543,12 +2547,10 @@ a:link {
 }

 .filterdivs {
-  margin: 10px 0px;
+  padding-top: 15px;
+  height: 45px;
+  margin-bottom: 8px;
  white-space: nowrap;
-  input {
-    line-height: 14px; // To correct vertical position of the down arrow of the input
-    outline: none; // Remove the dotted border on focus, because fluent has its own focus style (underlined)
-  }
 }

 .editFilterContainer {
@@ -2611,7 +2613,7 @@ a:link {

 .tabPanesContainer {
  display: flex;
-  flex-grow: 1;
+  height: 100%;
  overflow: hidden;
 }

@@ -2645,7 +2647,7 @@ a:link {
  width: @ActiveTabWidth;
 }

-.nav-tabs > li.active > .tabNavContentContainer > .tab_Content > .contentWrapper > .tabNavText {
+.nav-tabs > li.active > .tabNavContentContainer > .tab_Content > .tabNavText {
  font-weight: bolder;
  border-bottom: 2px solid rgba(0, 120, 212, 1);
 }
@@ -2681,71 +2683,67 @@ a:link {
    width: @TabsWidth;
    border-right: @ButtonBorderWidth solid @BaseMedium;
    white-space: nowrap;
-    .contentWrapper {
-      .flex-display();
-      width: @ContentWrapper;

-      .statusIconContainer {
-        width: @StatusIconContainerSize;
-        height: @StatusIconContainerSize;
-        margin-left: @SmallSpace;
-        display: inline-flex;
+    .statusIconContainer {
+      width: @StatusIconContainerSize;
+      height: @StatusIconContainerSize;
+      margin-left: @SmallSpace;
+      display: inline-flex;

-        .errorIconContainer {
-          width: @ErrorIconContainer;
-          height: @ErrorIconContainer;
-          margin-top: 1px;
+      .errorIconContainer {
+        width: @ErrorIconContainer;
+        height: @ErrorIconContainer;
+        margin-top: 1px;

-          .errorIcon {
-            width: @ErrorIconWidth;
-            height: @LoadingErrorIconSize;
-            background-image: url(../images/error_no_outline.svg);
-            background-repeat: no-repeat;
-            background-position: center;
-            background-size: 3px;
-            display: block;
-            margin: 1px 0px 0px 6px;
-          }
-        }
-
-        .errorIconContainer.actionsEnabled {
-          &:hover {
-            .hover();
-          }
-
-          &:focus {
-            .focus();
-          }
-
-          &:active {
-            .active();
-          }
-        }
-
-        .errorIconContainer[tabindex]:active {
-          outline: none;
-        }
-
-        .loadingIcon {
-          width: @LoadingErrorIconSize;
+        .errorIcon {
+          width: @ErrorIconWidth;
          height: @LoadingErrorIconSize;
-          margin: 0px 0px @SmallSpace @SmallSpace;
+          background-image: url(../images/error_no_outline.svg);
+          background-repeat: no-repeat;
+          background-position: center;
+          background-size: 3px;
+          display: block;
+          margin: 1px 0px 0px 6px;
        }
      }

-      .tabNavText {
-        margin-left: @SmallSpace;
-        margin-right: 2px;
-        color: @BaseDark;
-        text-overflow: ellipsis;
-        overflow: hidden;
-        white-space: nowrap;
-        flex-grow: 1;
+      .errorIconContainer.actionsEnabled {
+        &:hover {
+          .hover();
+        }
+
+        &:focus {
+          .focus();
+        }
+
+        &:active {
+          .active();
+        }
+      }
+
+      .errorIconContainer[tabindex]:active {
+        outline: none;
+      }
+
+      .loadingIcon {
+        width: @LoadingErrorIconSize;
+        height: @LoadingErrorIconSize;
+        margin: 0px 0px @SmallSpace @SmallSpace;
      }
    }

+    .tabNavText {
+      margin-left: @SmallSpace;
+      margin-right: 2px;
+      color: @BaseDark;
+      text-overflow: ellipsis;
+      overflow: hidden;
+      white-space: nowrap;
+      flex-grow: 1;
+    }
+
    .tabIconSection {
-      width: 29px;
+      width: 30px;
      position: relative;
      padding-top: 2px;

--- a/less/documentDBFabric.less
+++ b/less/documentDBFabric.less
@@ -38,7 +38,7 @@ a:focus {
 }

 .nav-tabs-margin {
-  padding-top: 5px;
+  padding-top: 8px;
  background-color: #ffffff
 }

@@ -75,7 +75,7 @@ a:focus {
  border-bottom: 2px solid @FabricAccentMedium;
 }

-.nav-tabs>li.active>.tabNavContentContainer>.tab_Content>.contentWrapper>.tabNavText {
+.nav-tabs>li.active>.tabNavContentContainer>.tab_Content>.tabNavText {
  border-bottom: 0px none transparent;
 }

@@ -93,11 +93,9 @@ a:focus {
    width: calc(@TabsWidth - (@SmallSpace * 2));
    padding-bottom: @SmallSpace;

-    .contentWrapper {
-        .statusIconContainer {
-          margin-left: 0px;
-        }
-      }
+    .statusIconContainer {
+      margin-left: 0px;
+    }

    .tabIconSection {
      .cancelButton {
--- a/less/resourceTree.less
+++ b/less/resourceTree.less
@@ -3,6 +3,19 @@
 .dataResourceTree {
  margin-left: @MediumSpace;
  overflow: auto;
+
+  .databaseHeader {
+    padding: 1px;
+    font-size: 14px;
+  }
+
+  .collectionHeader {
+    font-size: 12px;
+  }
+
+  .loadMoreHeader {
+    color: RGB(5, 99, 193);
+  }
 }

 .notebookResourceTree {
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -5,21 +5,21 @@
  "main": "index.js",
  "dependencies": {
    "@azure/arm-cosmosdb": "9.1.0",
-    "@azure/cosmos": "4.0.1-beta.3",
+    "@azure/cosmos": "4.0.1-beta.2",
    "@azure/cosmos-language-service": "0.0.5",
-    "@azure/identity": "1.5.2",
-    "@azure/ms-rest-nodeauth": "3.1.1",
+    "@azure/identity": "1.2.1",
+    "@azure/ms-rest-nodeauth": "3.0.7",
    "@azure/msal-browser": "2.14.2",
    "@babel/plugin-proposal-class-properties": "7.12.1",
    "@babel/plugin-proposal-decorators": "7.12.12",
-    "@fluentui/react": "8.119.0",
-    "@fluentui/react-components": "9.54.2",
+    "@fluentui/react": "8.112.1",
+    "@fluentui/react-components": "9.34.0",
    "@jupyterlab/services": "6.0.2",
    "@jupyterlab/terminal": "3.0.3",
    "@microsoft/applicationinsights-web": "2.6.1",
    "@nteract/commutable": "7.5.1",
    "@nteract/connected-components": "6.8.2",
-    "@nteract/core": "15.1.9",
+    "@nteract/core": "15.1.0",
    "@nteract/data-explorer": "8.0.3",
    "@nteract/directory-listing": "2.0.6",
    "@nteract/dropdown-menu": "1.0.1",
@@ -42,21 +42,19 @@
    "@nteract/transform-vega": "7.0.6",
    "@octokit/rest": "17.9.2",
    "@phosphor/widgets": "1.9.3",
-    "@testing-library/jest-dom": "6.4.6",
+    "@testing-library/jest-dom": "5.11.9",
    "@types/lodash": "4.14.171",
    "@types/mkdirp": "1.0.1",
    "@types/node-fetch": "2.5.7",
-    "@xmldom/xmldom": "0.7.13",
-    "allotment": "1.20.2",
    "applicationinsights": "1.8.0",
    "bootstrap": "3.4.1",
-    "canvas": "2.11.2",
+    "canvas": "file:./canvas",
    "clean-webpack-plugin": "4.0.0",
    "clipboard-copy": "4.0.1",
    "copy-webpack-plugin": "11.0.0",
    "crossroads": "0.12.2",
    "css-element-queries": "1.1.1",
-    "d3": "7.8.5",
+    "d3": "6.1.1",
    "datatables.net-colreorder-dt": "1.7.0",
    "datatables.net-dt": "1.13.8",
    "date-fns": "1.29.0",
@@ -67,18 +65,16 @@
    "eslint-plugin-react": "7.33.2",
    "hasher": "1.2.0",
    "html2canvas": "1.0.0-rc.5",
-    "i18next": "23.11.5",
+    "i18next": "19.8.4",
    "i18next-browser-languagedetector": "6.0.1",
    "i18next-http-backend": "1.0.23",
    "iframe-resizer-react": "1.1.0",
-    "immer": "9.0.6",
    "immutable": "4.0.0-rc.12",
    "is-ci": "2.0.0",
    "jquery": "3.7.1",
    "jquery-typeahead": "2.11.1",
    "jquery-ui-dist": "1.13.2",
    "knockout": "3.5.1",
-    "loader-utils": "2.0.3",
    "mkdirp": "1.0.4",
    "monaco-editor": "0.44.0",
    "ms": "2.1.3",
@@ -93,31 +89,27 @@
    "react-dnd-html5-backend": "14.0.0",
    "react-dom": "16.14.0",
    "react-hotkeys": "2.0.0",
-    "react-i18next": "14.1.2",
+    "react-i18next": "11.8.5",
    "react-notification-system": "0.2.17",
    "react-redux": "7.1.3",
    "react-splitter-layout": "4.0.0",
    "react-string-format": "1.0.1",
-    "react-window": "1.8.10",
    "react-youtube": "9.0.1",
    "reflect-metadata": "0.1.13",
    "rx-jupyter": "5.5.12",
    "sanitize-html": "2.3.3",
-    "shell-quote": "1.7.3",
    "styled-components": "5.0.1",
    "swr": "0.4.0",
    "terser-webpack-plugin": "5.3.9",
-    "tinykeys": "2.1.0",
-    "underscore": "1.12.1",
+    "underscore": "1.9.1",
    "utility-types": "3.10.0",
    "zustand": "3.5.0"
  },
  "devDependencies": {
-    "@babel/core": "7.24.7",
-    "@babel/preset-env": "7.24.7",
-    "@babel/preset-react": "7.24.7",
-    "@babel/preset-typescript": "7.24.7",
-    "@playwright/test": "1.44.0",
+    "@babel/core": "7.9.0",
+    "@babel/preset-env": "7.9.0",
+    "@babel/preset-react": "7.9.4",
+    "@babel/preset-typescript": "7.9.0",
    "@testing-library/react": "11.2.3",
    "@types/applicationinsights-js": "1.0.7",
    "@types/codemirror": "0.0.56",
@@ -126,20 +118,19 @@
    "@types/datatables.net": "1.10.28",
    "@types/datatables.net-colreorder": "1.4.5",
    "@types/dom-to-image": "2.6.2",
-    "@types/enzyme": "3.10.12",
-    "@types/enzyme-adapter-react-16": "1.0.9",
+    "@types/enzyme": "3.10.7",
+    "@types/enzyme-adapter-react-16": "1.0.6",
    "@types/hasher": "0.0.31",
-    "@types/jest": "29.5.12",
+    "@types/jest": "26.0.20",
    "@types/jquery": "3.5.29",
    "@types/node": "12.11.1",
    "@types/post-robot": "10.0.1",
    "@types/q": "1.5.1",
-    "@types/react": "17.0.44",
-    "@types/react-dom": "17.0.15",
+    "@types/react": "17.0.3",
+    "@types/react-dom": "17.0.3",
    "@types/react-notification-system": "0.2.39",
    "@types/react-redux": "7.1.7",
    "@types/react-splitter-layout": "3.0.1",
-    "@types/react-window": "1.8.8",
    "@types/sanitize-html": "1.27.2",
    "@types/sinon": "2.3.3",
    "@types/styled-components": "5.1.1",
@@ -148,55 +139,56 @@
    "@typescript-eslint/eslint-plugin": "6.7.4",
    "@typescript-eslint/parser": "6.7.4",
    "@webpack-cli/serve": "2.0.5",
-    "babel-jest": "29.7.0",
+    "babel-jest": "24.9.0",
    "babel-loader": "8.1.0",
    "buffer": "5.1.0",
    "case-sensitive-paths-webpack-plugin": "2.4.0",
    "create-file-webpack": "1.0.2",
    "css-loader": "6.8.1",
    "enzyme": "3.11.0",
-    "enzyme-adapter-react-16": "1.15.8",
-    "enzyme-to-json": "3.6.2",
+    "enzyme-adapter-react-16": "1.15.5",
+    "enzyme-to-json": "3.6.1",
    "eslint": "8.50.0",
    "eslint-cli": "1.1.1",
    "eslint-plugin-no-null": "1.0.2",
    "eslint-plugin-prefer-arrow": "1.2.3",
    "eslint-plugin-react-hooks": "4.6.0",
+    "expect-playwright": "0.3.3",
    "fast-glob": "3.2.5",
    "fs-extra": "7.0.0",
    "html-inline-css-webpack-plugin": "1.11.2",
-    "html-loader": "5.0.0",
+    "html-loader": "0.5.5",
+    "html-loader-jest": "0.2.1",
    "html-webpack-plugin": "5.5.3",
-    "jest": "29.7.0",
-    "jest-canvas-mock": "2.5.2",
-    "jest-circus": "29.7.0",
-    "jest-html-loader": "1.0.0",
+    "jest": "26.6.3",
+    "jest-canvas-mock": "2.3.1",
+    "jest-playwright-preset": "1.5.1",
    "jest-react-hooks-shallow": "1.5.1",
-    "jest-trx-results-processor": "3.0.2",
-    "jest-environment-jsdom": "29.7.0",
+    "jest-trx-results-processor": "0.0.7",
    "less": "3.8.1",
    "less-loader": "11.1.3",
    "less-vars-loader": "1.1.0",
    "mini-css-extract-plugin": "2.1.0",
    "monaco-editor-webpack-plugin": "7.1.0",
-    "node-fetch": "2.6.7",
+    "node-fetch": "2.6.1",
+    "playwright": "1.13.0",
    "prettier": "3.0.3",
    "process": "0.11.10",
    "querystring-es3": "0.2.1",
    "raw-loader": "0.5.1",
-    "react-dev-utils": "12.0.1",
+    "react-dev-utils": "11.0.4",
    "rimraf": "3.0.0",
    "sinon": "3.2.1",
    "style-loader": "0.23.0",
    "ts-loader": "9.2.4",
-    "typedoc": "0.26.2",
-    "typescript": "4.9.5",
+    "typedoc": "0.21.5",
+    "typescript": "4.3.5",
    "url-loader": "4.1.1",
    "wait-on": "4.0.2",
    "webpack": "5.88.2",
    "webpack-bundle-analyzer": "4.9.1",
    "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.2"
+    "webpack-dev-server": "4.15.1"
  },
  "scripts": {
    "postinstall": "patch-package",
@@ -211,7 +203,6 @@
    "test": "rimraf coverage && jest",
    "test:debug": "jest --runInBand",
    "test:e2e": "jest -c ./jest.config.playwright.js --detectOpenHandles",
-    "test:file": "jest --coverage=false",
    "watch": "npm run start",
    "wait-for-server": "wait-on -t 240000 -i 5000 -v https-get://0.0.0.0:1234/",
    "build:ase": "gulp build:ase",
@@ -247,4 +238,4 @@
    "printWidth": 120,
    "endOfLine": "auto"
  }
-}
+}
--- a/patches/@phosphor+virtualdom+1.2.0.patch
+++ b/patches/@phosphor+virtualdom+1.2.0.patch
@@ -1,13 +0,0 @@
-diff --git a/node_modules/@phosphor/virtualdom/lib/index.d.ts b/node_modules/@phosphor/virtualdom/lib/index.d.ts
-index 95682b9..73e2daa 100644
--- a/node_modules/@phosphor/virtualdom/lib/index.d.ts
-+++ b/node_modules/@phosphor/virtualdom/lib/index.d.ts
-@@ -58,7 +58,7 @@ export declare type ElementEventMap = {
-     ondrop: DragEvent;
-     ondurationchange: Event;
-     onemptied: Event;
-    onended: MediaStreamErrorEvent;
-+    onended: ErrorEvent;
-     onerror: ErrorEvent;
-     onfocus: FocusEvent;
-     oninput: Event;
--- a/playwright.config.ts
+++ b/playwright.config.ts
@@ -1,60 +0,0 @@
-import { defineConfig, devices } from "@playwright/test";
-
-/**
- * See https://playwright.dev/docs/test-configuration.
- */
-export default defineConfig({
-  testDir: "test",
-  fullyParallel: true,
-  forbidOnly: !!process.env.CI,
-  retries: process.env.CI ? 3 : 0,
-  workers: process.env.CI ? 1 : undefined,
-  reporter: process.env.CI ? "blob" : "html",
-  timeout: 10 * 60 * 1000,
-  use: {
-    actionTimeout: 5 * 60 * 1000,
-    trace: "off",
-    video: "off",
-    screenshot: "on",
-    testIdAttribute: "data-test",
-    contextOptions: {
-      ignoreHTTPSErrors: true,
-    },
-  },
-
-  expect: {
-    timeout: 5 * 60 * 1000,
-  },
-
-  projects: [
-    {
-      name: "chromium",
-      use: { ...devices["Desktop Chrome"] },
-    },
-    {
-      name: "firefox",
-      use: { ...devices["Desktop Firefox"] },
-    },
-    {
-      name: "webkit",
-      use: { ...devices["Desktop Safari"] },
-    },
-    /* Test against branded browsers. */
-    {
-      name: "Google Chrome",
-      use: { ...devices["Desktop Chrome"], channel: "chrome" }, // or 'chrome-beta'
-    },
-    {
-      name: "Microsoft Edge",
-      use: { ...devices["Desktop Edge"], channel: "msedge" }, // or 'msedge-dev'
-    },
-  ],
-
-  webServer: {
-    command: "npm run start",
-    url: "https://127.0.0.1:1234/_ready",
-    timeout: 120 * 1000,
-    ignoreHTTPSErrors: true,
-    reuseExistingServer: !process.env.CI,
-  },
-});
--- a/src/Common/CollapsedResourceTree.tsx
+++ b/src/Common/CollapsedResourceTree.tsx
@@ -0,0 +1,55 @@
+import React, { FunctionComponent, MutableRefObject, useEffect, useRef } from "react";
+import arrowLeftImg from "../../images/imgarrowlefticon.svg";
+import { getApiShortDisplayName } from "../Utils/APITypeUtils";
+import { NormalizedEventKey } from "./Constants";
+
+export interface CollapsedResourceTreeProps {
+  toggleLeftPaneExpanded: () => void;
+  isLeftPaneExpanded: boolean;
+}
+
+export const CollapsedResourceTree: FunctionComponent<CollapsedResourceTreeProps> = ({
+  toggleLeftPaneExpanded,
+  isLeftPaneExpanded,
+}: CollapsedResourceTreeProps): JSX.Element => {
+  const focusButton = useRef<HTMLLIElement>() as MutableRefObject<HTMLLIElement>;
+
+  useEffect(() => {
+    if (focusButton.current) {
+      focusButton.current.focus();
+    }
+  });
+
+  const onKeyPressToggleLeftPaneExpanded = (event: React.KeyboardEvent) => {
+    if (event.key === NormalizedEventKey.Space || event.key === NormalizedEventKey.Enter) {
+      toggleLeftPaneExpanded();
+      event.stopPropagation();
+    }
+  };
+
+  return (
+    <div id="mini" className={!isLeftPaneExpanded ? "mini toggle-mini" : "hiddenMain"}>
+      <div className="main-nav nav">
+        <ul className="nav">
+          <li
+            className="resourceTreeCollapse"
+            id="collapseToggleLeftPaneButton"
+            role="button"
+            tabIndex={0}
+            aria-label={getApiShortDisplayName() + `Expand tree`}
+            onClick={toggleLeftPaneExpanded}
+            onKeyPress={onKeyPressToggleLeftPaneExpanded}
+            ref={focusButton}
+          >
+            <span className="leftarrowCollapsed">
+              <img className="arrowCollapsed" src={arrowLeftImg} alt="Expand" />
+            </span>
+            <span className="collectionCollapsed">
+              <span>{getApiShortDisplayName()}</span>
+            </span>
+          </li>
+        </ul>
+      </div>
+    </div>
+  );
+};
--- a/src/Common/Constants.ts
+++ b/src/Common/Constants.ts
@@ -88,12 +88,6 @@ export class CapabilityNames {
  public static readonly EnableStorageAnalytics: string = "EnableStorageAnalytics";
  public static readonly EnableMongo: string = "EnableMongo";
  public static readonly EnableServerless: string = "EnableServerless";
-  public static readonly EnableNoSQLVectorSearch: string = "EnableNoSQLVectorSearch";
-}
-
-export enum CapacityMode {
-  Provisioned = "Provisioned",
-  Serverless = "Serverless",
 }

 // flight names returned from the portal are always lowercase
@@ -130,10 +124,8 @@ export enum MongoBackendEndpointType {
  remote,
 }

-export class BackendApi {
-  public static readonly GenerateToken: string = "GenerateToken";
-  public static readonly PortalSettings: string = "PortalSettings";
-  public static readonly AccountRestrictions: string = "AccountRestrictions";
+export enum BackendApi {
+  GenerateToken,
 }

 export class PortalBackendEndpoints {
@@ -145,7 +137,7 @@ export class PortalBackendEndpoints {
 }

 export class MongoProxyEndpoints {
-  public static readonly Local: string = "https://localhost:7238";
+  public static readonly Development: string = "https://localhost:7238";
  public static readonly Mpac: string = "https://cdb-ms-mpac-mp.cosmos.azure.com";
  public static readonly Prod: string = "https://cdb-ms-prod-mp.cosmos.azure.com";
  public static readonly Fairfax: string = "https://cdb-ff-prod-mp.cosmos.azure.us";
@@ -197,12 +189,6 @@ export class Queries {
  public static readonly DefaultMaxWaitTimeInSeconds = 30;
 }

-export class RBACOptions {
-  public static setAutomaticRBACOption: string = "Automatic";
-  public static setTrueRBACOption: string = "True";
-  public static setFalseRBACOption: string = "False";
-}
-
 export class SavedQueries {
  public static readonly CollectionName: string = "___Query";
  public static readonly DatabaseName: string = "___Cosmos";
@@ -262,7 +248,6 @@ export class HttpHeaders {
  public static partitionKey: string = "x-ms-documentdb-partitionkey";
  public static migrateOfferToManualThroughput: string = "x-ms-cosmos-migrate-offer-to-manual-throughput";
  public static migrateOfferToAutopilot: string = "x-ms-cosmos-migrate-offer-to-autopilot";
-  public static xAPIKey: string = "X-API-Key";
 }

 export class ContentType {
--- a/src/Common/CosmosClient.test.ts
+++ b/src/Common/CosmosClient.test.ts
@@ -1,6 +1,47 @@
+import { ResourceType } from "@azure/cosmos";
 import { Platform, resetConfigContext, updateConfigContext } from "../ConfigContext";
 import { updateUserContext } from "../UserContext";
-import { endpoint, getTokenFromAuthService, requestPlugin } from "./CosmosClient";
+import { endpoint, getTokenFromAuthService, requestPlugin, tokenProvider } from "./CosmosClient";
+
+describe("tokenProvider", () => {
+  const options = {
+    verb: "GET" as any,
+    path: "/",
+    resourceId: "",
+    resourceType: "dbs" as ResourceType,
+    headers: {},
+    getAuthorizationTokenUsingMasterKey: () => "",
+  };
+
+  beforeEach(() => {
+    updateConfigContext({
+      BACKEND_ENDPOINT: "https://main.documentdb.ext.azure.com",
+    });
+    window.fetch = jest.fn().mockImplementation(() => {
+      return {
+        json: () => "{}",
+        headers: new Map(),
+      };
+    });
+  });
+
+  afterEach(() => {
+    jest.restoreAllMocks();
+  });
+
+  it("calls the auth token service if no master key is set", async () => {
+    await tokenProvider(options);
+    expect((window.fetch as any).mock.calls.length).toBe(1);
+  });
+
+  it("does not call the auth service if a master key is set", async () => {
+    updateUserContext({
+      masterKey: "foo",
+    });
+    await tokenProvider(options);
+    expect((window.fetch as any).mock.calls.length).toBe(0);
+  });
+});

 describe("getTokenFromAuthService", () => {
  beforeEach(() => {
--- a/src/Common/CosmosClient.ts
+++ b/src/Common/CosmosClient.ts
@@ -1,6 +1,6 @@
 import * as Cosmos from "@azure/cosmos";
 import { getAuthorizationTokenUsingResourceTokens } from "Common/getAuthorizationTokenUsingResourceTokens";
-import { AuthorizationToken } from "Contracts/FabricMessageTypes";
+import { AuthorizationToken } from "Contracts/MessageTypes";
 import { checkDatabaseResourceTokensValidity } from "Platform/Fabric/FabricUtil";
 import { LocalStorageUtility, StorageKey } from "Shared/StorageUtility";
 import { AuthType } from "../AuthType";
@@ -11,25 +11,13 @@ import { logConsoleError } from "../Utils/NotificationConsoleUtils";
 import * as PriorityBasedExecutionUtils from "../Utils/PriorityBasedExecutionUtils";
 import { EmulatorMasterKey, HttpHeaders } from "./Constants";
 import { getErrorMessage } from "./ErrorHandlingUtils";
-import * as Logger from "../Common/Logger";

 const _global = typeof self === "undefined" ? window : self;

 export const tokenProvider = async (requestInfo: Cosmos.RequestInfo) => {
  const { verb, resourceId, resourceType, headers } = requestInfo;

-  const dataPlaneRBACOptionEnabled = userContext.dataPlaneRbacEnabled && userContext.apiType === "SQL";
-  if (userContext.features.enableAadDataPlane || dataPlaneRBACOptionEnabled) {
-    Logger.logInfo(
-      `AAD Data Plane Feature flag set to ${userContext.features.enableAadDataPlane} for account with disable local auth ${userContext.databaseAccount.properties.disableLocalAuth} `,
-      "Explorer/tokenProvider",
-    );
-    if (!userContext.aadToken) {
-      logConsoleError(
-        `AAD token does not exist. Please click on "Login for Entra ID" button prior to performing Entra ID RBAC operations`,
-      );
-      return null;
-    }
+  if (userContext.features.enableAadDataPlane && userContext.aadToken) {
    const AUTH_PREFIX = `type=aad&ver=1.0&sig=`;
    const authorizationToken = `${AUTH_PREFIX}${userContext.aadToken}`;
    return authorizationToken;
@@ -71,7 +59,7 @@ export const tokenProvider = async (requestInfo: Cosmos.RequestInfo) => {
      /* ************** TODO: Uncomment this code if we need to support these operations **************
      // User master tokens
      const authorizationToken = await sendCachedDataMessage<AuthorizationToken>(
-        FabricMessageTypes.GetAuthorizationToken,
+        MessageTypes.GetAuthorizationToken,
        [requestInfo],
        userContext.fabricContext.connectionId,
      );
@@ -83,15 +71,8 @@ export const tokenProvider = async (requestInfo: Cosmos.RequestInfo) => {
  }

  if (userContext.masterKey) {
-    Logger.logInfo(`Master Key exists`, "Explorer/tokenProvider");
    // TODO This SDK method mutates the headers object. Find a better one or fix the SDK.
-    await Cosmos.setAuthorizationTokenHeaderUsingMasterKey(
-      verb,
-      resourceId,
-      resourceType,
-      headers,
-      userContext.masterKey,
-    );
+    await Cosmos.setAuthorizationTokenHeaderUsingMasterKey(verb, resourceId, resourceType, headers, EmulatorMasterKey);
    return decodeURIComponent(headers.authorization);
  }

@@ -104,6 +85,8 @@ export const tokenProvider = async (requestInfo: Cosmos.RequestInfo) => {
  return decodeURIComponent(result.PrimaryReadWriteToken);
 };

+// TODO
+// Need to create separate plugins or change endpoint logic to return the correct write or read endpoint.
 export const requestPlugin: Cosmos.Plugin<any> = async (requestContext, diagnosticNode, next) => {
  requestContext.endpoint = new URL(configContext.PROXY_PATH, window.location.href).href;
  requestContext.headers["x-ms-proxy-target"] = endpoint();
@@ -153,14 +136,34 @@ enum SDKSupportedCapabilities {
  PartitionMerge = 1 << 0,
 }

-let _client: Cosmos.CosmosClient;
+// Client Management

-export function client(): Cosmos.CosmosClient {
-  if (_client) {
-    if (!userContext.hasDataPlaneRbacSettingChanged) {
-      return _client;
-    }
+let _client: Cosmos.CosmosClient;
+let _readClients: Map<string, Cosmos.CosmosClient> = new Map();
+
+export enum ClientOperationType {
+  READ,
+  WRITE,
+}
+
+export function client(clientOperationType: ClientOperationType): Cosmos.CosmosClient {
+  switch (clientOperationType) {
+    case ClientOperationType.READ:
+      return readClients();
+    case ClientOperationType.WRITE:
+      return writeClient();
+    default:
+      throw new Error("Invalid operation type");
  }
+}
+
+export function writeClient(): Cosmos.CosmosClient {
+  console.log(`Called primary client`);
+  const currentUserContextDocumentEndpoint = userContext?.databaseAccount?.properties?.documentEndpoint;
+  console.log(`Current selected endpoint in userContext: ${currentUserContextDocumentEndpoint}`);
+
+  if (_client) return _client;
+
  let _defaultHeaders: Cosmos.CosmosHeaders = {};
  _defaultHeaders["x-ms-cosmos-sdk-supportedcapabilities"] =
    SDKSupportedCapabilities.None | SDKSupportedCapabilities.PartitionMerge;
@@ -179,7 +182,7 @@ export function client(): Cosmos.CosmosClient {

  const options: Cosmos.CosmosClientOptions = {
    endpoint: endpoint() || "https://cosmos.azure.com", // CosmosClient gets upset if we pass a bad URL. This should never actually get called
-    key: userContext.dataPlaneRbacEnabled ? "" : userContext.masterKey,
+    key: userContext.masterKey,
    tokenProvider,
    userAgentSuffix: "Azure Portal",
    defaultHeaders: _defaultHeaders,
@@ -205,3 +208,61 @@ export function client(): Cosmos.CosmosClient {
  _client = new Cosmos.CosmosClient(options);
  return _client;
 }
+
+export function readClients(): Cosmos.CosmosClient {
+  console.log(`Called read only client`);
+  const currentUserContextDocumentEndpoint = userContext?.databaseAccount?.properties?.documentEndpoint;
+  console.log(`Current selected read endpoint in userContext: ${currentUserContextDocumentEndpoint}`);
+  3;
+
+  const selectedEndpoint = endpoint() || "https://cosmos.azure.com";
+
+  if (_readClients.has(selectedEndpoint)) {
+    return _readClients.get(selectedEndpoint);
+  }
+
+  let _defaultHeaders: Cosmos.CosmosHeaders = {};
+  _defaultHeaders["x-ms-cosmos-sdk-supportedcapabilities"] =
+    SDKSupportedCapabilities.None | SDKSupportedCapabilities.PartitionMerge;
+
+  if (
+    userContext.authType === AuthType.ConnectionString ||
+    userContext.authType === AuthType.EncryptedToken ||
+    userContext.authType === AuthType.ResourceToken
+  ) {
+    // Default to low priority. Needed for non-AAD-auth scenarios
+    // where we cannot use RP API, and thus, cannot detect whether priority
+    // based execution is enabled.
+    // The header will be ignored if priority based execution is disabled on the account.
+    _defaultHeaders["x-ms-cosmos-priority-level"] = PriorityLevel.Default;
+  }
+
+  const options: Cosmos.CosmosClientOptions = {
+    endpoint: selectedEndpoint, // CosmosClient gets upset if we pass a bad URL. This should never actually get called
+    key: userContext.masterKey,
+    tokenProvider,
+    userAgentSuffix: "Azure Portal",
+    defaultHeaders: _defaultHeaders,
+    connectionPolicy: {
+      retryOptions: {
+        maxRetryAttemptCount: LocalStorageUtility.getEntryNumber(StorageKey.RetryAttempts),
+        fixedRetryIntervalInMilliseconds: LocalStorageUtility.getEntryNumber(StorageKey.RetryInterval),
+        maxWaitTimeInSeconds: LocalStorageUtility.getEntryNumber(StorageKey.MaxWaitTimeInSeconds),
+      },
+    },
+  };
+
+  if (configContext.PROXY_PATH !== undefined) {
+    (options as any).plugins = [{ on: "request", plugin: requestPlugin }];
+  }
+
+  if (PriorityBasedExecutionUtils.isFeatureEnabled()) {
+    const plugins = (options as any).plugins || [];
+    plugins.push({ on: "request", plugin: PriorityBasedExecutionUtils.requestPlugin });
+    (options as any).plugins = plugins;
+  }
+
+  _readClients.set(selectedEndpoint, new Cosmos.CosmosClient(options));
+
+  return _readClients.get(selectedEndpoint);
+}
--- a/src/Common/DocumentUtility.ts
+++ b/src/Common/DocumentUtility.ts
@@ -1,9 +1,9 @@
 import { userContext } from "../UserContext";

-export const getEntityName = (multiple?: boolean): string => {
+export const getEntityName = (): string => {
  if (userContext.apiType === "Mongo") {
-    return multiple ? "documents" : "document";
+    return "document";
  }

-  return multiple ? "items" : "item";
+  return "item";
 };
--- a/src/Common/MessageHandler.ts
+++ b/src/Common/MessageHandler.ts
@@ -1,7 +1,5 @@
-import { FabricMessageTypes } from "Contracts/FabricMessageTypes";
 import Q from "q";
 import * as _ from "underscore";
-import * as Logger from "../Common/Logger";
 import { MessageTypes } from "../Contracts/ExplorerContracts";
 import { getDataExplorerWindow } from "../Utils/WindowUtils";
 import * as Constants from "./Constants";
@@ -38,7 +36,7 @@ export function handleCachedDataMessage(message: any): void {
 * @returns
 */
 export function sendCachedDataMessage<TResponseDataModel>(
-  messageType: MessageTypes | FabricMessageTypes,
+  messageType: MessageTypes,
  params: Object[],
  scope?: string,
  timeoutInMs?: number,
@@ -97,18 +95,10 @@ const _sendMessage = (message: any): void => {
    const portalChildWindow = getDataExplorerWindow(window) || window;
    if (portalChildWindow === window) {
      // Current window is a child of portal, send message to portal window
-      if (portalChildWindow.document.referrer) {
-        portalChildWindow.parent.postMessage(message, portalChildWindow.document.referrer);
-      } else {
-        Logger.logError("Iframe failed to send message to portal", "MessageHandler");
-      }
+      portalChildWindow.parent.postMessage(message, portalChildWindow.document.referrer || "*");
    } else {
      // Current window is not a child of portal, send message to the child window instead (which is data explorer)
-      if (portalChildWindow.location.origin) {
-        portalChildWindow.postMessage(message, portalChildWindow.location.origin);
-      } else {
-        Logger.logError("Iframe failed to send message to data explorer", "MessageHandler");
-      }
+      portalChildWindow.postMessage(message, portalChildWindow.location.origin || "*");
    }
  }
 };
--- a/src/Common/MongoProxyClient.ts
+++ b/src/Common/MongoProxyClient.ts
@@ -67,7 +67,7 @@ export function queryDocuments(
  query: string,
  continuationToken?: string,
 ): Promise<QueryResponse> {
-  if (!useMongoProxyEndpoint("resourcelist") || !useMongoProxyEndpoint("queryDocuments")) {
+  if (!useMongoProxyEndpoint("resourcelist")) {
    return queryDocuments_ToBeDeprecated(databaseId, collection, isResourceList, query, continuationToken);
  }

@@ -106,7 +106,7 @@ export function queryDocuments(
    headers[CosmosSDKConstants.HttpHeaders.Continuation] = continuationToken;
  }

-  const path = isResourceList ? "/resourcelist" : "/queryDocuments";
+  const path = isResourceList ? "/resourcelist" : "";

  return window
    .fetch(`${endpoint}${path}`, {
@@ -672,28 +672,6 @@ export function getEndpoint(endpoint: string): string {
  return url;
 }

-export function useMongoProxyEndpoint(api: string): boolean {
-  const activeMongoProxyEndpoints: string[] = [
-    MongoProxyEndpoints.Local,
-    MongoProxyEndpoints.Mpac,
-    MongoProxyEndpoints.Prod,
-    // MongoProxyEndpoints.Fairfax,
-  ];
-  let canAccessMongoProxy: boolean = userContext.databaseAccount.properties.publicNetworkAccess === "Enabled";
-  if (
-    configContext.MONGO_PROXY_ENDPOINT !== MongoProxyEndpoints.Local &&
-    userContext.databaseAccount.properties.ipRules?.length > 0
-  ) {
-    canAccessMongoProxy = canAccessMongoProxy && configContext.MONGO_PROXY_OUTBOUND_IPS_ALLOWLISTED;
-  }
-
-  return (
-    canAccessMongoProxy &&
-    configContext.NEW_MONGO_APIS?.includes(api) &&
-    activeMongoProxyEndpoints.includes(configContext.MONGO_PROXY_ENDPOINT)
-  );
-}
-
 // TODO: This function throws most of the time except on Forbidden which is a bit strange
 // It causes problems for TypeScript understanding the types
 async function errorHandling(response: Response, action: string, params: unknown): Promise<void> {
@@ -710,3 +688,17 @@ async function errorHandling(response: Response, action: string, params: unknown
 export function getARMCreateCollectionEndpoint(params: DataModels.MongoParameters): string {
  return `subscriptions/${params.sid}/resourceGroups/${params.rg}/providers/Microsoft.DocumentDB/databaseAccounts/${userContext.databaseAccount.name}/mongodbDatabases/${params.db}/collections/${params.coll}`;
 }
+
+function useMongoProxyEndpoint(api: string): boolean {
+  const activeMongoProxyEndpoints: string[] = [MongoProxyEndpoints.Development];
+  let canAccessMongoProxy: boolean = userContext.databaseAccount.properties.publicNetworkAccess === "Enabled";
+  if (userContext.databaseAccount.properties.ipRules?.length > 0) {
+    canAccessMongoProxy = canAccessMongoProxy && configContext.MONGO_PROXY_OUTBOUND_IPS_ALLOWLISTED;
+  }
+
+  return (
+    canAccessMongoProxy &&
+    configContext.NEW_MONGO_APIS?.includes(api) &&
+    activeMongoProxyEndpoints.includes(configContext.MONGO_PROXY_ENDPOINT)
+  );
+}
--- a/src/Common/PortalNotifications.ts
+++ b/src/Common/PortalNotifications.ts
@@ -0,0 +1,39 @@
+import { configContext, Platform } from "../ConfigContext";
+import * as DataModels from "../Contracts/DataModels";
+import * as ViewModels from "../Contracts/ViewModels";
+import { userContext } from "../UserContext";
+import { getAuthorizationHeader } from "../Utils/AuthorizationUtils";
+
+const notificationsPath = () => {
+  switch (configContext.platform) {
+    case Platform.Hosted:
+      return "/api/guest/notifications";
+    case Platform.Portal:
+      return "/api/notifications";
+    default:
+      throw new Error(`Unknown platform: ${configContext.platform}`);
+  }
+};
+
+export const fetchPortalNotifications = async (): Promise<DataModels.Notification[]> => {
+  if (configContext.platform === Platform.Emulator || configContext.platform === Platform.Hosted) {
+    return [];
+  }
+
+  const { databaseAccount, resourceGroup, subscriptionId } = userContext;
+  const url = `${configContext.BACKEND_ENDPOINT}${notificationsPath()}?accountName=${
+    databaseAccount.name
+  }&subscriptionId=${subscriptionId}&resourceGroup=${resourceGroup}`;
+  const authorizationHeader: ViewModels.AuthorizationTokenHeaderMetadata = getAuthorizationHeader();
+  const headers = { [authorizationHeader.header]: authorizationHeader.token };
+
+  const response = await window.fetch(url, {
+    headers,
+  });
+
+  if (!response.ok) {
+    throw new Error(await response.text());
+  }
+
+  return (await response.json()) as DataModels.Notification[];
+};
--- a/src/Common/QueriesClient.ts
+++ b/src/Common/QueriesClient.ts
@@ -3,7 +3,8 @@ import * as _ from "underscore";
 import * as DataModels from "../Contracts/DataModels";
 import * as ViewModels from "../Contracts/ViewModels";
 import Explorer from "../Explorer/Explorer";
-import DocumentId, { IDocumentIdContainer } from "../Explorer/Tree/DocumentId";
+import DocumentsTab from "../Explorer/Tabs/DocumentsTab";
+import DocumentId from "../Explorer/Tree/DocumentId";
 import { useDatabases } from "../Explorer/useDatabases";
 import { userContext } from "../UserContext";
 import * as NotificationConsoleUtils from "../Utils/NotificationConsoleUtils";
@@ -161,10 +162,10 @@ export class QueriesClient {
      {
        partitionKey: QueriesClient.PartitionKey,
        partitionKeyProperties: ["id"],
-      } as IDocumentIdContainer,
+      } as DocumentsTab,
      query,
      [query.queryName],
-    );
+    ); // TODO: Remove DocumentId's dependency on DocumentsTab
    const options: any = { partitionKey: query.resourceId };
    return deleteDocument(queriesCollection, documentId)
      .then(
--- a/src/Common/ResourceTreeContainer.tsx
+++ b/src/Common/ResourceTreeContainer.tsx
@@ -0,0 +1,90 @@
+import { ResourceTree } from "Explorer/Tree/ResourceTree";
+import React, { FunctionComponent, MutableRefObject, useEffect, useRef } from "react";
+import arrowLeftImg from "../../images/imgarrowlefticon.svg";
+import refreshImg from "../../images/refresh-cosmos.svg";
+import { AuthType } from "../AuthType";
+import Explorer from "../Explorer/Explorer";
+import { ResourceTokenTree } from "../Explorer/Tree/ResourceTokenTree";
+import { ResourceTree2 } from "../Explorer/Tree2/ResourceTree";
+import { userContext } from "../UserContext";
+import { getApiShortDisplayName } from "../Utils/APITypeUtils";
+import { Platform, configContext } from "./../ConfigContext";
+import { NormalizedEventKey } from "./Constants";
+
+export interface ResourceTreeContainerProps {
+  toggleLeftPaneExpanded: () => void;
+  isLeftPaneExpanded: boolean;
+  container: Explorer;
+}
+
+export const ResourceTreeContainer: FunctionComponent<ResourceTreeContainerProps> = ({
+  toggleLeftPaneExpanded,
+  isLeftPaneExpanded,
+  container,
+}: ResourceTreeContainerProps): JSX.Element => {
+  const focusButton = useRef<HTMLLIElement>() as MutableRefObject<HTMLLIElement>;
+
+  useEffect(() => {
+    if (isLeftPaneExpanded) {
+      if (focusButton.current) {
+        focusButton.current.focus();
+      }
+    }
+  });
+
+  const onKeyPressToggleLeftPaneExpanded = (event: React.KeyboardEvent) => {
+    if (event.key === NormalizedEventKey.Space || event.key === NormalizedEventKey.Enter) {
+      toggleLeftPaneExpanded();
+      event.stopPropagation();
+    }
+  };
+  return (
+    <div id="main" className={isLeftPaneExpanded ? "main" : "hiddenMain"}>
+      {/* Collections Window - - Start */}
+      <div id="mainslide" className="flexContainer">
+        {/* Collections Window Title/Command Bar - Start */}
+        <div className="collectiontitle">
+          <div className="coltitle">
+            <span className="titlepadcol">{getApiShortDisplayName()}</span>
+            <div className="float-right">
+              <span
+                className="padimgcolrefresh"
+                data-test="refreshTree"
+                role="button"
+                data-bind="click: onRefreshResourcesClick, clickBubble: false, event: { keypress: onRefreshDatabasesKeyPress }"
+                tabIndex={0}
+                aria-label={getApiShortDisplayName() + `Refresh tree`}
+                title="Refresh tree"
+              >
+                <img className="refreshcol" src={refreshImg} alt="Refresh Tree" />
+              </span>
+              <span
+                className="padimgcolrefresh1"
+                id="expandToggleLeftPaneButton"
+                role="button"
+                onClick={toggleLeftPaneExpanded}
+                onKeyPress={onKeyPressToggleLeftPaneExpanded}
+                tabIndex={0}
+                aria-label={getApiShortDisplayName() + `Collapse Tree`}
+                title="Collapse Tree"
+                ref={focusButton}
+              >
+                <img className="refreshcol1" src={arrowLeftImg} alt="Hide" />
+              </span>
+            </div>
+          </div>
+        </div>
+        {userContext.authType === AuthType.ResourceToken ? (
+          <ResourceTokenTree />
+        ) : userContext.features.enableKoResourceTree ? (
+          <div style={{ overflowY: "auto" }} data-bind="react:resourceTree" />
+        ) : configContext.platform === Platform.Fabric ? (
+          <ResourceTree2 container={container} />
+        ) : (
+          <ResourceTree container={container} />
+        )}
+      </div>
+      {/*  Collections Window - End */}
+    </div>
+  );
+};
--- a/src/Common/TableEntity.tsx
+++ b/src/Common/TableEntity.tsx
@@ -142,7 +142,7 @@ export const TableEntity: FunctionComponent<TableEntityProps> = ({
              <Image
                {...imageProps}
                src={EditIcon}
-                alt={`Edit ${entityProperty} entity`}
+                alt="editEntity"
                onClick={onEditEntity}
                tabIndex={0}
                onKeyPress={handleKeyPress}
@@ -156,7 +156,7 @@ export const TableEntity: FunctionComponent<TableEntityProps> = ({
            <Image
              {...imageProps}
              src={DeleteIcon}
-              alt={`Delete ${entityProperty} entity`}
+              alt="delete entity"
              id="deleteEntity"
              onClick={onDeleteEntity}
              tabIndex={0}
--- a/src/Common/snapshots/CosmosClient.test.ts.snap
+++ b/src/Common/snapshots/CosmosClient.test.ts.snap
@@ -1,9 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

 exports[`requestPlugin Emulator builds a url for emulator proxy via webpack 1`] = `
-{
+Object {
  "endpoint": "http://localhost/proxy",
-  "headers": {
+  "headers": Object {
    "x-ms-proxy-target": "http://localhost",
  },
  "path": "/dbs/foo",
@@ -11,9 +11,9 @@ exports[`requestPlugin Emulator builds a url for emulator proxy via webpack 1`]
 `;

 exports[`requestPlugin Hosted builds a proxy URL in development 1`] = `
-{
+Object {
  "endpoint": "http://localhost/proxy",
-  "headers": {
+  "headers": Object {
    "x-ms-proxy-target": "baz",
  },
  "path": "/dbs/foo",
--- a/src/Common/snapshots/IteratorUtilities.test.ts.snap
+++ b/src/Common/snapshots/IteratorUtilities.test.ts.snap
@@ -1,12 +1,12 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

 exports[`nextPage returns results for the next page 1`] = `
-{
+Object {
  "activityId": "foo",
-  "documents": [],
+  "documents": Array [],
  "firstItemIndex": 11,
  "hasMoreResults": false,
-  "headers": {},
+  "headers": Object {},
  "itemCount": 0,
  "lastItemIndex": 10,
  "requestCharge": 1,
--- a/src/Common/dataAccess/snapshots/queryDocuments.test.ts.snap
+++ b/src/Common/dataAccess/snapshots/queryDocuments.test.ts.snap
@@ -1,8 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

 exports[`getCommonQueryOptions builds the correct default options objects 1`] = `
-{
-  "disableNonStreamingOrderByQuery": true,
+Object {
  "enableScanInQuery": true,
  "forceQueryPlan": true,
  "maxDegreeOfParallelism": 0,
@@ -12,8 +11,7 @@ exports[`getCommonQueryOptions builds the correct default options objects 1`] =
 `;

 exports[`getCommonQueryOptions reads from localStorage 1`] = `
-{
-  "disableNonStreamingOrderByQuery": true,
+Object {
  "enableScanInQuery": true,
  "forceQueryPlan": true,
  "maxDegreeOfParallelism": 17,
--- a/src/Common/dataAccess/bulkCreateDocument.ts
+++ b/src/Common/dataAccess/bulkCreateDocument.ts
@@ -1,7 +1,7 @@
 import { JSONObject, OperationResponse } from "@azure/cosmos";
 import { CollectionBase } from "../../Contracts/ViewModels";
 import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export const bulkCreateDocument = async (
@@ -13,7 +13,7 @@ export const bulkCreateDocument = async (
  );

  try {
-    const response = await client()
+    const response = await client(ClientOperationType.WRITE)
      .database(collection.databaseId)
      .container(collection.id())
      .items.bulk(
--- a/src/Common/dataAccess/createCollection.ts
+++ b/src/Common/dataAccess/createCollection.ts
@@ -13,7 +13,7 @@ import { createUpdateMongoDBCollection } from "../../Utils/arm/generatedClients/
 import { createUpdateSqlContainer } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { createUpdateTable } from "../../Utils/arm/generatedClients/cosmos/tableResources";
 import * as ARMTypes from "../../Utils/arm/generatedClients/cosmos/types";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";
 import { createMongoCollectionWithProxy } from "../MongoProxyClient";
 import { createDatabase } from "./createDatabase";
@@ -96,9 +96,6 @@ const createSqlContainer = async (params: DataModels.CreateCollectionParams): Pr
  if (params.uniqueKeyPolicy) {
    resource.uniqueKeyPolicy = params.uniqueKeyPolicy;
  }
-  if (params.vectorEmbeddingPolicy) {
-    resource.vectorEmbeddingPolicy = params.vectorEmbeddingPolicy;
-  }

  const rpPayload: ARMTypes.SqlDatabaseCreateUpdateParameters = {
    properties: {
@@ -269,7 +266,6 @@ const createCollectionWithSDK = async (params: DataModels.CreateCollectionParams
    indexingPolicy: params.indexingPolicy || undefined,
    uniqueKeyPolicy: params.uniqueKeyPolicy || undefined,
    analyticalStorageTtl: params.analyticalStorageTtl,
-    vectorEmbeddingPolicy: params.vectorEmbeddingPolicy,
  } as ContainerRequest; // TODO: remove cast when https://github.com/Azure/azure-cosmos-js/issues/423 is fixed
  const collectionOptions: RequestOptions = {};
  const createDatabaseBody: DatabaseRequest = { id: params.databaseId };
@@ -288,7 +284,9 @@ const createCollectionWithSDK = async (params: DataModels.CreateCollectionParams
    }
  }

-  const databaseResponse: DatabaseResponse = await client().databases.createIfNotExists(createDatabaseBody);
+  const databaseResponse: DatabaseResponse = await client(ClientOperationType.WRITE).databases.createIfNotExists(
+    createDatabaseBody,
+  );
  const collectionResponse: ContainerResponse = await databaseResponse?.database.containers.create(
    createCollectionBody,
    collectionOptions,
--- a/src/Common/dataAccess/createDatabase.ts
+++ b/src/Common/dataAccess/createDatabase.ts
@@ -16,7 +16,7 @@ import {
  MongoDBDatabaseCreateUpdateParameters,
  SqlDatabaseCreateUpdateParameters,
 } from "../../Utils/arm/generatedClients/cosmos/types";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function createDatabase(params: DataModels.CreateDatabaseParams): Promise<DataModels.Database> {
@@ -152,18 +152,8 @@ async function createDatabaseWithSDK(params: DataModels.CreateDatabaseParams): P
      createBody.throughput = params.offerThroughput;
    }
  }
-  let response: DatabaseResponse;
-  try {
-    response = await client().databases.create(createBody);
-  } catch (error) {
-    if (error.message.includes("Shared throughput database creation is not supported for serverless accounts")) {
-      createBody.maxThroughput = undefined;
-      createBody.throughput = undefined;
-      response = await client().databases.create(createBody);
-    } else {
-      throw error;
-    }
-  }
+
+  const response: DatabaseResponse = await client(ClientOperationType.WRITE).databases.create(createBody);
  return response.resource;
 }

--- a/src/Common/dataAccess/createDocument.ts
+++ b/src/Common/dataAccess/createDocument.ts
@@ -1,6 +1,6 @@
 import { CollectionBase } from "../../Contracts/ViewModels";
 import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { getEntityName } from "../DocumentUtility";
 import { handleError } from "../ErrorHandlingUtils";

@@ -9,7 +9,7 @@ export const createDocument = async (collection: CollectionBase, newDocument: un
  const clearMessage = logConsoleProgress(`Creating new ${entityName} for container ${collection.id()}`);

  try {
-    const response = await client()
+    const response = await client(ClientOperationType.WRITE)
      .database(collection.databaseId)
      .container(collection.id())
      .items.create(newDocument);
--- a/src/Common/dataAccess/createStoredProcedure.ts
+++ b/src/Common/dataAccess/createStoredProcedure.ts
@@ -1,6 +1,7 @@
 import { Resource, StoredProcedureDefinition } from "@azure/cosmos";
 import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
+import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import {
  createUpdateSqlStoredProcedure,
  getSqlStoredProcedure,
@@ -9,8 +10,7 @@ import {
  SqlStoredProcedureCreateUpdateParameters,
  SqlStoredProcedureResource,
 } from "../../Utils/arm/generatedClients/cosmos/types";
-import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function createStoredProcedure(
@@ -63,7 +63,7 @@ export async function createStoredProcedure(
      return rpResponse && (rpResponse.properties?.resource as StoredProcedureDefinition & Resource);
    }

-    const response = await client()
+    const response = await client(ClientOperationType.WRITE)
      .database(databaseId)
      .container(collectionId)
      .scripts.storedProcedures.create(storedProcedure);
--- a/src/Common/dataAccess/createTrigger.ts
+++ b/src/Common/dataAccess/createTrigger.ts
@@ -1,10 +1,10 @@
 import { TriggerDefinition } from "@azure/cosmos";
 import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
+import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import { createUpdateSqlTrigger, getSqlTrigger } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { SqlTriggerCreateUpdateParameters, SqlTriggerResource } from "../../Utils/arm/generatedClients/cosmos/types";
-import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function createTrigger(
@@ -55,7 +55,7 @@ export async function createTrigger(
      return rpResponse && rpResponse.properties?.resource;
    }

-    const response = await client()
+    const response = await client(ClientOperationType.WRITE)
      .database(databaseId)
      .container(collectionId)
      .scripts.triggers.create(trigger as unknown as TriggerDefinition); // TODO: TypeScript does not like the SQL SDK trigger type
--- a/src/Common/dataAccess/createUserDefinedFunction.ts
+++ b/src/Common/dataAccess/createUserDefinedFunction.ts
@@ -1,6 +1,7 @@
 import { Resource, UserDefinedFunctionDefinition } from "@azure/cosmos";
 import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
+import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import {
  createUpdateSqlUserDefinedFunction,
  getSqlUserDefinedFunction,
@@ -9,8 +10,7 @@ import {
  SqlUserDefinedFunctionCreateUpdateParameters,
  SqlUserDefinedFunctionResource,
 } from "../../Utils/arm/generatedClients/cosmos/types";
-import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function createUserDefinedFunction(
@@ -63,7 +63,7 @@ export async function createUserDefinedFunction(
      return rpResponse && (rpResponse.properties?.resource as UserDefinedFunctionDefinition & Resource);
    }

-    const response = await client()
+    const response = await client(ClientOperationType.WRITE)
      .database(databaseId)
      .container(collectionId)
      .scripts.userDefinedFunctions.create(userDefinedFunction);
--- a/src/Common/dataAccess/deleteCollection.ts
+++ b/src/Common/dataAccess/deleteCollection.ts
@@ -6,7 +6,7 @@ import { deleteMongoDBCollection } from "../../Utils/arm/generatedClients/cosmos
 import { deleteSqlContainer } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { deleteTable } from "../../Utils/arm/generatedClients/cosmos/tableResources";
 import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { client, ClientOperationType } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function deleteCollection(databaseId: string, collectionId: string): Promise<void> {
@@ -15,7 +15,7 @@ export async function deleteCollection(databaseId: string, collectionId: string)
    if (userContext.authType === AuthType.AAD && !userContext.features.enableSDKoperations) {
      await deleteCollectionWithARM(databaseId, collectionId);
    } else {
-      await client().database(databaseId).container(collectionId).delete();
+      await client(ClientOperationType.WRITE).database(databaseId).container(collectionId).delete();
    }
    logConsoleInfo(`Successfully deleted container ${collectionId}`);
  } catch (error) {
--- a/src/Common/dataAccess/deleteConflict.ts
+++ b/src/Common/dataAccess/deleteConflict.ts
@@ -1,9 +1,9 @@
-import ConflictId from "../../Explorer/Tree/ConflictId";
-import { CollectionBase } from "../../Contracts/ViewModels";
 import { RequestOptions } from "@azure/cosmos";
-import { client } from "../CosmosClient";
+import { CollectionBase } from "../../Contracts/ViewModels";
+import ConflictId from "../../Explorer/Tree/ConflictId";
+import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";
-import { logConsoleProgress, logConsoleInfo } from "../../Utils/NotificationConsoleUtils";

 export const deleteConflict = async (collection: CollectionBase, conflictId: ConflictId): Promise<void> => {
  const clearMessage = logConsoleProgress(`Deleting conflict ${conflictId.id()}`);
@@ -13,7 +13,7 @@ export const deleteConflict = async (collection: CollectionBase, conflictId: Con
      partitionKey: getPartitionKeyHeaderForConflict(conflictId),
    };

-    await client()
+    await client(ClientOperationType.WRITE)
      .database(collection.databaseId)
      .container(collection.id())
      .conflict(conflictId.id())
--- a/src/Common/dataAccess/deleteDatabase.ts
+++ b/src/Common/dataAccess/deleteDatabase.ts
@@ -5,7 +5,7 @@ import { deleteGremlinDatabase } from "../../Utils/arm/generatedClients/cosmos/g
 import { deleteMongoDBDatabase } from "../../Utils/arm/generatedClients/cosmos/mongoDBResources";
 import { deleteSqlDatabase } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { client, ClientOperationType } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function deleteDatabase(databaseId: string): Promise<void> {
@@ -15,7 +15,7 @@ export async function deleteDatabase(databaseId: string): Promise<void> {
    if (userContext.authType === AuthType.AAD && !userContext.features.enableSDKoperations) {
      await deleteDatabaseWithARM(databaseId);
    } else {
-      await client().database(databaseId).delete();
+      await client(ClientOperationType.WRITE).database(databaseId).delete();
    }
    logConsoleInfo(`Successfully deleted database ${databaseId}`);
  } catch (error) {
--- a/src/Common/dataAccess/deleteDocument.ts
+++ b/src/Common/dataAccess/deleteDocument.ts
@@ -1,8 +1,7 @@
-import { BulkOperationType, OperationInput } from "@azure/cosmos";
 import { CollectionBase } from "../../Contracts/ViewModels";
 import DocumentId from "../../Explorer/Tree/DocumentId";
 import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { getEntityName } from "../DocumentUtility";
 import { handleError } from "../ErrorHandlingUtils";
 import { getPartitionKeyValue } from "./getPartitionKeyValue";
@@ -12,7 +11,7 @@ export const deleteDocument = async (collection: CollectionBase, documentId: Doc
  const clearMessage = logConsoleProgress(`Deleting ${entityName} ${documentId.id()}`);

  try {
-    await client()
+    await client(ClientOperationType.WRITE)
      .database(collection.databaseId)
      .container(collection.id())
      .item(documentId.id(), getPartitionKeyValue(documentId))
@@ -25,58 +24,3 @@ export const deleteDocument = async (collection: CollectionBase, documentId: Doc
    clearMessage();
  }
 };
-
-/**
- * Bulk delete documents
- * @param collection
- * @param documentId
- * @returns array of ids that were successfully deleted
- */
-export const deleteDocuments = async (collection: CollectionBase, documentIds: DocumentId[]): Promise<DocumentId[]> => {
-  const nbDocuments = documentIds.length;
-  const clearMessage = logConsoleProgress(`Deleting ${documentIds.length} ${getEntityName(true)}`);
-  try {
-    const v2Container = await client().database(collection.databaseId).container(collection.id());
-
-    // Bulk can only delete 100 documents at a time
-    const BULK_DELETE_LIMIT = 100;
-    const promiseArray = [];
-
-    while (documentIds.length > 0) {
-      const documentIdsChunk = documentIds.splice(0, BULK_DELETE_LIMIT);
-      const operations: OperationInput[] = documentIdsChunk.map((documentId) => ({
-        id: documentId.id(),
-        // bulk delete: if not partition key is specified, do not pass empty array, but undefined
-        partitionKey:
-          documentId.partitionKeyValue &&
-          Array.isArray(documentId.partitionKeyValue) &&
-          documentId.partitionKeyValue.length === 0
-            ? undefined
-            : documentId.partitionKeyValue,
-        operationType: BulkOperationType.Delete,
-      }));
-
-      const promise = v2Container.items.bulk(operations).then((bulkResult) => {
-        return documentIdsChunk.filter((_, index) => bulkResult[index].statusCode === 204);
-      });
-      promiseArray.push(promise);
-    }
-
-    const allResult = await Promise.all(promiseArray);
-    const flatAllResult = Array.prototype.concat.apply([], allResult);
-    logConsoleInfo(
-      `Successfully deleted ${getEntityName(flatAllResult.length > 1)}: ${flatAllResult.length} out of ${nbDocuments}`,
-    );
-    // TODO: handle case result.length != nbDocuments
-    return flatAllResult;
-  } catch (error) {
-    handleError(
-      error,
-      "DeleteDocuments",
-      `Error while deleting ${documentIds.length} ${getEntityName(documentIds.length > 1)}`,
-    );
-    throw error;
-  } finally {
-    clearMessage();
-  }
-};
--- a/src/Common/dataAccess/deleteStoredProcedure.ts
+++ b/src/Common/dataAccess/deleteStoredProcedure.ts
@@ -2,7 +2,7 @@ import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
 import { deleteSqlStoredProcedure } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { client, ClientOperationType } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function deleteStoredProcedure(
@@ -26,7 +26,11 @@ export async function deleteStoredProcedure(
        storedProcedureId,
      );
    } else {
-      await client().database(databaseId).container(collectionId).scripts.storedProcedure(storedProcedureId).delete();
+      await client(ClientOperationType.WRITE)
+        .database(databaseId)
+        .container(collectionId)
+        .scripts.storedProcedure(storedProcedureId)
+        .delete();
    }
  } catch (error) {
    handleError(error, "DeleteStoredProcedure", `Error while deleting stored procedure ${storedProcedureId}`);
--- a/src/Common/dataAccess/deleteTrigger.ts
+++ b/src/Common/dataAccess/deleteTrigger.ts
@@ -2,7 +2,7 @@ import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
 import { deleteSqlTrigger } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { client, ClientOperationType } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function deleteTrigger(databaseId: string, collectionId: string, triggerId: string): Promise<void> {
@@ -22,7 +22,11 @@ export async function deleteTrigger(databaseId: string, collectionId: string, tr
        triggerId,
      );
    } else {
-      await client().database(databaseId).container(collectionId).scripts.trigger(triggerId).delete();
+      await client(ClientOperationType.WRITE)
+        .database(databaseId)
+        .container(collectionId)
+        .scripts.trigger(triggerId)
+        .delete();
    }
  } catch (error) {
    handleError(error, "DeleteTrigger", `Error while deleting trigger ${triggerId}`);
--- a/src/Common/dataAccess/deleteUserDefinedFunction.ts
+++ b/src/Common/dataAccess/deleteUserDefinedFunction.ts
@@ -2,7 +2,7 @@ import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
 import { deleteSqlUserDefinedFunction } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { client, ClientOperationType } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function deleteUserDefinedFunction(databaseId: string, collectionId: string, id: string): Promise<void> {
@@ -22,7 +22,11 @@ export async function deleteUserDefinedFunction(databaseId: string, collectionId
        id,
      );
    } else {
-      await client().database(databaseId).container(collectionId).scripts.userDefinedFunction(id).delete();
+      await client(ClientOperationType.WRITE)
+        .database(databaseId)
+        .container(collectionId)
+        .scripts.userDefinedFunction(id)
+        .delete();
    }
  } catch (error) {
    handleError(error, "DeleteUserDefinedFunction", `Error while deleting user defined function ${id}`);
--- a/src/Common/dataAccess/executeStoredProcedure.ts
+++ b/src/Common/dataAccess/executeStoredProcedure.ts
@@ -1,9 +1,9 @@
 import { Collection } from "../../Contracts/ViewModels";
-import { ClientDefaults, HttpHeaders } from "../Constants";
-import { client } from "../CosmosClient";
-import { handleError } from "../ErrorHandlingUtils";
-import { logConsoleProgress, logConsoleInfo } from "../../Utils/NotificationConsoleUtils";
 import StoredProcedure from "../../Explorer/Tree/StoredProcedure";
+import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
+import { ClientDefaults, HttpHeaders } from "../Constants";
+import { ClientOperationType, client } from "../CosmosClient";
+import { handleError } from "../ErrorHandlingUtils";

 export interface ExecuteSprocResult {
  result: StoredProcedure;
@@ -22,7 +22,7 @@ export const executeStoredProcedure = async (
  }, ClientDefaults.requestTimeoutMs);

  try {
-    const response = await client()
+    const response = await client(ClientOperationType.WRITE)
      .database(collection.databaseId)
      .container(collection.id())
      .scripts.storedProcedure(storedProcedure.id())
--- a/src/Common/dataAccess/getIndexTransformationProgress.ts
+++ b/src/Common/dataAccess/getIndexTransformationProgress.ts
@@ -1,9 +1,9 @@
-import { client } from "../CosmosClient";
-import { handleError } from "../ErrorHandlingUtils";
-import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import * as Constants from "../Constants";
 import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
+import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
+import * as Constants from "../Constants";
+import { ClientOperationType, client } from "../CosmosClient";
+import { handleError } from "../ErrorHandlingUtils";

 export async function getIndexTransformationProgress(databaseId: string, collectionId: string): Promise<number> {
  if (userContext.authType !== AuthType.AAD) {
@@ -12,7 +12,10 @@ export async function getIndexTransformationProgress(databaseId: string, collect
  let indexTransformationPercentage: number;
  const clearMessage = logConsoleProgress(`Reading container ${collectionId}`);
  try {
-    const response = await client().database(databaseId).container(collectionId).read({ populateQuotaInfo: true });
+    const response = await client(ClientOperationType.READ)
+      .database(databaseId)
+      .container(collectionId)
+      .read({ populateQuotaInfo: true });

    indexTransformationPercentage = parseInt(
      response.headers[Constants.HttpHeaders.collectionIndexTransformationProgress] as string,
--- a/src/Common/dataAccess/queryConflicts.ts
+++ b/src/Common/dataAccess/queryConflicts.ts
@@ -1,5 +1,5 @@
 import { ConflictDefinition, FeedOptions, QueryIterator, Resource } from "@azure/cosmos";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";

 export const queryConflicts = (
  databaseId: string,
@@ -7,5 +7,5 @@ export const queryConflicts = (
  query: string,
  options: FeedOptions,
 ): QueryIterator<ConflictDefinition & Resource> => {
-  return client().database(databaseId).container(containerId).conflicts.query(query, options);
+  return client(ClientOperationType.READ).database(databaseId).container(containerId).conflicts.query(query, options);
 };
--- a/src/Common/dataAccess/queryDocuments.ts
+++ b/src/Common/dataAccess/queryDocuments.ts
@@ -1,8 +1,7 @@
 import { FeedOptions, ItemDefinition, QueryIterator, Resource } from "@azure/cosmos";
-import { isVectorSearchEnabled } from "Utils/CapabilityUtils";
 import { LocalStorageUtility, StorageKey } from "../../Shared/StorageUtility";
 import { Queries } from "../Constants";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";

 export const queryDocuments = (
  databaseId: string,
@@ -11,7 +10,7 @@ export const queryDocuments = (
  options: FeedOptions,
 ): QueryIterator<ItemDefinition & Resource> => {
  options = getCommonQueryOptions(options);
-  return client().database(databaseId).container(containerId).items.query(query, options);
+  return client(ClientOperationType.READ).database(databaseId).container(containerId).items.query(query, options);
 };

 export const getCommonQueryOptions = (options: FeedOptions): FeedOptions => {
@@ -27,6 +26,5 @@ export const getCommonQueryOptions = (options: FeedOptions): FeedOptions => {
    (storedItemPerPageSetting !== undefined && storedItemPerPageSetting) ||
    Queries.itemsPerPage;
  options.maxDegreeOfParallelism = LocalStorageUtility.getEntryNumber(StorageKey.MaxDegreeOfParellism);
-  options.disableNonStreamingOrderByQuery = !isVectorSearchEnabled();
  return options;
 };
--- a/src/Common/dataAccess/readCollection.ts
+++ b/src/Common/dataAccess/readCollection.ts
@@ -2,11 +2,12 @@ import { CosmosClient } from "@azure/cosmos";
 import { sampleDataClient } from "Common/SampleDataClient";
 import { userContext } from "UserContext";
 import * as DataModels from "../../Contracts/DataModels";
-import { client } from "../CosmosClient";
+import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function readCollection(databaseId: string, collectionId: string): Promise<DataModels.Collection> {
-  const cosmosClient = client();
+  const cosmosClient = client(ClientOperationType.READ);
  return await readCollectionInternal(cosmosClient, databaseId, collectionId);
 }

@@ -30,6 +31,7 @@ export async function readCollectionInternal(
  collectionId: string,
 ): Promise<DataModels.Collection> {
  let collection: DataModels.Collection;
+  const clearMessage = logConsoleProgress(`Querying container ${collectionId}`);
  try {
    const response = await cosmosClient.database(databaseId).container(collectionId).read();
    collection = response.resource as DataModels.Collection;
@@ -37,5 +39,6 @@ export async function readCollectionInternal(
    handleError(error, "ReadCollection", `Error while querying container ${collectionId}`);
    throw error;
  }
+  clearMessage();
  return collection;
 }
--- a/src/Common/dataAccess/readCollections.ts
+++ b/src/Common/dataAccess/readCollections.ts
@@ -10,7 +10,7 @@ import { listGremlinGraphs } from "../../Utils/arm/generatedClients/cosmos/greml
 import { listMongoDBCollections } from "../../Utils/arm/generatedClients/cosmos/mongoDBResources";
 import { listSqlContainers } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { listTables } from "../../Utils/arm/generatedClients/cosmos/tableResources";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function readCollections(databaseId: string): Promise<DataModels.Collection[]> {
@@ -31,7 +31,7 @@ export async function readCollections(databaseId: string): Promise<DataModels.Co
      const tokenCollectionId = resourceIdObj[3];

      if (tokenDatabaseId === databaseId) {
-        promises.push(client().database(databaseId).container(tokenCollectionId).read());
+        promises.push(client(ClientOperationType.READ).database(databaseId).container(tokenCollectionId).read());
      }
    }

@@ -61,7 +61,7 @@ export async function readCollections(databaseId: string): Promise<DataModels.Co
      return await readCollectionsWithARM(databaseId);
    }

-    const sdkResponse = await client().database(databaseId).containers.readAll().fetchAll();
+    const sdkResponse = await client(ClientOperationType.READ).database(databaseId).containers.readAll().fetchAll();
    return sdkResponse.resources as DataModels.Collection[];
  } catch (error) {
    handleError(error, "ReadCollections", `Error while querying containers for database ${databaseId}`);
@@ -77,7 +77,7 @@ export async function readCollectionsWithPagination(
 ): Promise<DataModels.CollectionsWithPagination> {
  const clearMessage = logConsoleProgress(`Querying containers for database ${databaseId}`);
  try {
-    const sdkResponse = await client()
+    const sdkResponse = await client(ClientOperationType.READ)
      .database(databaseId)
      .containers.query(
        { query: "SELECT * FROM c" },
--- a/src/Common/dataAccess/readDatabases.ts
+++ b/src/Common/dataAccess/readDatabases.ts
@@ -7,7 +7,7 @@ import { listCassandraKeyspaces } from "../../Utils/arm/generatedClients/cosmos/
 import { listGremlinDatabases } from "../../Utils/arm/generatedClients/cosmos/gremlinResources";
 import { listMongoDBDatabases } from "../../Utils/arm/generatedClients/cosmos/mongoDBResources";
 import { listSqlDatabases } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function readDatabases(): Promise<DataModels.Database[]> {
@@ -56,7 +56,7 @@ export async function readDatabases(): Promise<DataModels.Database[]> {
    ) {
      databases = await readDatabasesWithARM();
    } else {
-      const sdkResponse = await client().databases.readAll().fetchAll();
+      const sdkResponse = await client(ClientOperationType.READ).databases.readAll().fetchAll();
      databases = sdkResponse.resources as DataModels.Database[];
    }
  } catch (error) {
--- a/src/Common/dataAccess/readDocument.ts
+++ b/src/Common/dataAccess/readDocument.ts
@@ -3,7 +3,7 @@ import { CollectionBase } from "../../Contracts/ViewModels";
 import DocumentId from "../../Explorer/Tree/DocumentId";
 import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import { HttpHeaders } from "../Constants";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { getEntityName } from "../DocumentUtility";
 import { handleError } from "../ErrorHandlingUtils";
 import { getPartitionKeyValue } from "./getPartitionKeyValue";
@@ -19,7 +19,7 @@ export const readDocument = async (collection: CollectionBase, documentId: Docum
            [HttpHeaders.partitionKey]: documentId.partitionKeyValue,
          }
        : {};
-    const response = await client()
+    const response = await client(ClientOperationType.READ)
      .database(collection.databaseId)
      .container(collection.id())
      .item(documentId.id(), getPartitionKeyValue(documentId))
--- a/src/Common/dataAccess/readOfferWithSDK.ts
+++ b/src/Common/dataAccess/readOfferWithSDK.ts
@@ -1,7 +1,7 @@
 import { RequestOptions } from "@azure/cosmos";
 import { Offer } from "../../Contracts/DataModels";
 import { HttpHeaders } from "../Constants";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { parseSDKOfferResponse } from "../OfferUtility";
 import { readOffers } from "./readOffers";

@@ -21,7 +21,7 @@ export const readOfferWithSDK = async (offerId: string, resourceId: string): Pro
      [HttpHeaders.populateCollectionThroughputInfo]: true,
    },
  };
-  const response = await client().offer(offerId).read(options);
+  const response = await client(ClientOperationType.READ).offer(offerId).read(options);

  return parseSDKOfferResponse(response);
 };
--- a/src/Common/dataAccess/readOffers.ts
+++ b/src/Common/dataAccess/readOffers.ts
@@ -1,13 +1,13 @@
 import { SDKOfferDefinition } from "../../Contracts/DataModels";
 import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
-import { handleError, getErrorMessage } from "../ErrorHandlingUtils";
+import { ClientOperationType, client } from "../CosmosClient";
+import { getErrorMessage, handleError } from "../ErrorHandlingUtils";

 export const readOffers = async (): Promise<SDKOfferDefinition[]> => {
  const clearMessage = logConsoleProgress(`Querying offers`);

  try {
-    const response = await client().offers.readAll().fetchAll();
+    const response = await client(ClientOperationType.READ).offers.readAll().fetchAll();
    return response?.resources;
  } catch (error) {
    // This should be removed when we can correctly identify if an account is serverless when connected using connection string too.
--- a/src/Common/dataAccess/readStoredProcedures.ts
+++ b/src/Common/dataAccess/readStoredProcedures.ts
@@ -4,7 +4,7 @@ import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
 import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import { listSqlStoredProcedures } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function readStoredProcedures(
@@ -34,7 +34,7 @@ export async function readStoredProcedures(
      throw new Error(cloudError?.error?.message);
    }

-    const response = await client()
+    const response = await client(ClientOperationType.READ)
      .database(databaseId)
      .container(collectionId)
      .scripts.storedProcedures.readAll()
--- a/src/Common/dataAccess/readTriggers.ts
+++ b/src/Common/dataAccess/readTriggers.ts
@@ -1,10 +1,10 @@
 import { TriggerDefinition } from "@azure/cosmos";
 import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
+import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import { listSqlTriggers } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { SqlTriggerResource } from "../../Utils/arm/generatedClients/cosmos/types";
-import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function readTriggers(
@@ -28,7 +28,11 @@ export async function readTriggers(
      return rpResponse?.value?.map((trigger) => trigger.properties?.resource);
    }

-    const response = await client().database(databaseId).container(collectionId).scripts.triggers.readAll().fetchAll();
+    const response = await client(ClientOperationType.READ)
+      .database(databaseId)
+      .container(collectionId)
+      .scripts.triggers.readAll()
+      .fetchAll();
    return response?.resources;
  } catch (error) {
    handleError(error, "ReadTriggers", `Failed to query triggers for container ${collectionId}`);
--- a/src/Common/dataAccess/readUserDefinedFunctions.ts
+++ b/src/Common/dataAccess/readUserDefinedFunctions.ts
@@ -1,9 +1,9 @@
 import { Resource, UserDefinedFunctionDefinition } from "@azure/cosmos";
 import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
-import { listSqlUserDefinedFunctions } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { listSqlUserDefinedFunctions } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function readUserDefinedFunctions(
@@ -24,7 +24,7 @@ export async function readUserDefinedFunctions(
      return rpResponse?.value?.map((udf) => udf.properties?.resource as UserDefinedFunctionDefinition & Resource);
    }

-    const response = await client()
+    const response = await client(ClientOperationType.READ)
      .database(databaseId)
      .container(collectionId)
      .scripts.userDefinedFunctions.readAll()
--- a/src/Common/dataAccess/updateCollection.ts
+++ b/src/Common/dataAccess/updateCollection.ts
@@ -2,6 +2,7 @@ import { ContainerDefinition, RequestOptions } from "@azure/cosmos";
 import { AuthType } from "../../AuthType";
 import { Collection } from "../../Contracts/DataModels";
 import { userContext } from "../../UserContext";
+import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import {
  createUpdateCassandraTable,
  getCassandraTable,
@@ -19,8 +20,7 @@ import {
  SqlContainerCreateUpdateParameters,
  SqlContainerResource,
 } from "../../Utils/arm/generatedClients/cosmos/types";
-import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function updateCollection(
@@ -40,7 +40,7 @@ export async function updateCollection(
    ) {
      collection = await updateCollectionWithARM(databaseId, collectionId, newCollection);
    } else {
-      const sdkResponse = await client()
+      const sdkResponse = await client(ClientOperationType.WRITE)
        .database(databaseId)
        .container(collectionId)
        .replace(newCollection as ContainerDefinition, options);
--- a/src/Common/dataAccess/updateDocument.ts
+++ b/src/Common/dataAccess/updateDocument.ts
@@ -3,7 +3,7 @@ import { HttpHeaders } from "Common/Constants";
 import { CollectionBase } from "../../Contracts/ViewModels";
 import DocumentId from "../../Explorer/Tree/DocumentId";
 import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { getEntityName } from "../DocumentUtility";
 import { handleError } from "../ErrorHandlingUtils";
 import { getPartitionKeyValue } from "./getPartitionKeyValue";
@@ -23,7 +23,7 @@ export const updateDocument = async (
            [HttpHeaders.partitionKey]: documentId.partitionKeyValue,
          }
        : {};
-    const response = await client()
+    const response = await client(ClientOperationType.WRITE)
      .database(collection.databaseId)
      .container(collection.id())
      .item(documentId.id(), getPartitionKeyValue(documentId))
--- a/src/Common/dataAccess/updateOffer.ts
+++ b/src/Common/dataAccess/updateOffer.ts
@@ -2,6 +2,7 @@ import { OfferDefinition, RequestOptions } from "@azure/cosmos";
 import { AuthType } from "../../AuthType";
 import { Offer, SDKOfferDefinition, UpdateOfferParams } from "../../Contracts/DataModels";
 import { userContext } from "../../UserContext";
+import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import {
  migrateCassandraKeyspaceToAutoscale,
  migrateCassandraKeyspaceToManualThroughput,
@@ -40,9 +41,8 @@ import {
  updateTableThroughput,
 } from "../../Utils/arm/generatedClients/cosmos/tableResources";
 import { ThroughputSettingsUpdateParameters } from "../../Utils/arm/generatedClients/cosmos/types";
-import { logConsoleInfo, logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import { HttpHeaders } from "../Constants";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";
 import { parseSDKOfferResponse } from "../OfferUtility";
 import { readCollectionOffer } from "./readCollectionOffer";
@@ -401,7 +401,7 @@ const updateOfferWithSDK = async (params: UpdateOfferParams): Promise<Offer> =>
    newOffer.content.offerAutopilotSettings = { maxThroughput: 0 };
  }

-  const sdkResponse = await client()
+  const sdkResponse = await client(ClientOperationType.WRITE)
    .offer(params.currentOffer.id)
    // TODO Remove casting when SDK types are fixed (https://github.com/Azure/azure-sdk-for-js/issues/10660)
    .replace(newOffer as unknown as OfferDefinition, options);
--- a/src/Common/dataAccess/updateStoredProcedure.ts
+++ b/src/Common/dataAccess/updateStoredProcedure.ts
@@ -1,6 +1,7 @@
 import { Resource, StoredProcedureDefinition } from "@azure/cosmos";
 import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
+import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import {
  createUpdateSqlStoredProcedure,
  getSqlStoredProcedure,
@@ -9,8 +10,7 @@ import {
  SqlStoredProcedureCreateUpdateParameters,
  SqlStoredProcedureResource,
 } from "../../Utils/arm/generatedClients/cosmos/types";
-import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function updateStoredProcedure(
@@ -54,7 +54,7 @@ export async function updateStoredProcedure(
      throw new Error(`Failed to update stored procedure: ${storedProcedure.id} does not exist.`);
    }

-    const response = await client()
+    const response = await client(ClientOperationType.WRITE)
      .database(databaseId)
      .container(collectionId)
      .scripts.storedProcedure(storedProcedure.id)
--- a/src/Common/dataAccess/updateTrigger.ts
+++ b/src/Common/dataAccess/updateTrigger.ts
@@ -1,10 +1,10 @@
 import { TriggerDefinition } from "@azure/cosmos";
 import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
+import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import { createUpdateSqlTrigger, getSqlTrigger } from "../../Utils/arm/generatedClients/cosmos/sqlResources";
 import { SqlTriggerCreateUpdateParameters, SqlTriggerResource } from "../../Utils/arm/generatedClients/cosmos/types";
-import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function updateTrigger(
@@ -47,7 +47,7 @@ export async function updateTrigger(
      throw new Error(`Failed to update trigger: ${trigger.id} does not exist.`);
    }

-    const response = await client()
+    const response = await client(ClientOperationType.WRITE)
      .database(databaseId)
      .container(collectionId)
      .scripts.trigger(trigger.id)
--- a/src/Common/dataAccess/updateUserDefinedFunction.ts
+++ b/src/Common/dataAccess/updateUserDefinedFunction.ts
@@ -1,6 +1,7 @@
 import { Resource, UserDefinedFunctionDefinition } from "@azure/cosmos";
 import { AuthType } from "../../AuthType";
 import { userContext } from "../../UserContext";
+import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
 import {
  createUpdateSqlUserDefinedFunction,
  getSqlUserDefinedFunction,
@@ -9,8 +10,7 @@ import {
  SqlUserDefinedFunctionCreateUpdateParameters,
  SqlUserDefinedFunctionResource,
 } from "../../Utils/arm/generatedClients/cosmos/types";
-import { logConsoleProgress } from "../../Utils/NotificationConsoleUtils";
-import { client } from "../CosmosClient";
+import { ClientOperationType, client } from "../CosmosClient";
 import { handleError } from "../ErrorHandlingUtils";

 export async function updateUserDefinedFunction(
@@ -53,7 +53,7 @@ export async function updateUserDefinedFunction(
      throw new Error(`Failed to update user defined function: ${userDefinedFunction.id} does not exist.`);
    }

-    const response = await client()
+    const response = await client(ClientOperationType.WRITE)
      .database(databaseId)
      .container(collectionId)
      .scripts.userDefinedFunction(userDefinedFunction.id)
--- a/src/ConfigContext.ts
+++ b/src/ConfigContext.ts
@@ -42,10 +42,6 @@ export interface ConfigContext {
  ARM_API_VERSION: string;
  GRAPH_ENDPOINT: string;
  GRAPH_API_VERSION: string;
-  // This is the endpoint to get offering Ids to be used to fetch prices. Refer to this doc: https://learn.microsoft.com/en-us/rest/api/marketplacecatalog/dataplane/skus/list?view=rest-marketplacecatalog-dataplane-2023-05-01-preview&tabs=HTTP
-  CATALOG_ENDPOINT: string;
-  CATALOG_API_VERSION: string;
-  CATALOG_API_KEY: string;
  ARCADIA_ENDPOINT: string;
  ARCADIA_LIVY_ENDPOINT_DNS_ZONE: string;
  BACKEND_ENDPOINT?: string;
@@ -87,7 +83,6 @@ let configContext: Readonly<ConfigContext> = {
    `^https:\\/\\/.*\\.analysis-df\\.net$`,
    `^https:\\/\\/.*\\.analysis-df\\.windows\\.net$`,
    `^https:\\/\\/.*\\.azure-test\\.net$`,
-    `^https:\\/\\/cosmos-explorer-preview\\.azurewebsites\\.net`,
  ], // Webpack injects this at build time
  gitSha: process.env.GIT_SHA,
  hostedExplorerURL: "https://cosmos.azure.com/",
@@ -97,9 +92,6 @@ let configContext: Readonly<ConfigContext> = {
  ARM_API_VERSION: "2016-06-01",
  GRAPH_ENDPOINT: "https://graph.microsoft.com",
  GRAPH_API_VERSION: "1.6",
-  CATALOG_ENDPOINT: "https://catalogapi.azure.com/",
-  CATALOG_API_VERSION: "2023-05-01-preview",
-  CATALOG_API_KEY: "",
  ARCADIA_ENDPOINT: "https://workspaceartifacts.projectarcadia.net",
  ARCADIA_LIVY_ENDPOINT_DNS_ZONE: "dev.azuresynapse.net",
  GITHUB_CLIENT_ID: "6cb2f63cf6f7b5cbdeca", // Registered OAuth app: https://github.com/organizations/AzureCosmosDBNotebooks/settings/applications/1189306
@@ -107,20 +99,24 @@ let configContext: Readonly<ConfigContext> = {
  JUNO_ENDPOINT: JunoEndpoints.Prod,
  BACKEND_ENDPOINT: "https://main.documentdb.ext.azure.com",
  PORTAL_BACKEND_ENDPOINT: PortalBackendEndpoints.Prod,
+  NEW_BACKEND_APIS: [BackendApi.GenerateToken],
  MONGO_PROXY_ENDPOINT: MongoProxyEndpoints.Prod,
  NEW_MONGO_APIS: [
-    "resourcelist",
-    "queryDocuments",
-    "createDocument",
-    "readDocument",
-    "updateDocument",
-    "deleteDocument",
-    "createCollectionWithProxy",
-    "legacyMongoShell",
+    // "resourcelist",
+    // "createDocument",
+    // "readDocument",
+    // "updateDocument",
+    // "deleteDocument",
+    // "createCollectionWithProxy",
  ],
  MONGO_PROXY_OUTBOUND_IPS_ALLOWLISTED: false,
  CASSANDRA_PROXY_ENDPOINT: CassandraProxyEndpoints.Prod,
-  NEW_CASSANDRA_APIS: ["postQuery", "createOrDelete", "getKeys", "getSchema"],
+  NEW_CASSANDRA_APIS: [
+    // "postQuery",
+    // "createOrDelete",
+    // "getKeys",
+    // "getSchema",
+  ],
  CASSANDRA_PROXY_OUTBOUND_IPS_ALLOWLISTED: false,
  isTerminalEnabled: false,
  isPhoenixEnabled: false,
@@ -199,9 +195,6 @@ if (process.env.NODE_ENV === "development") {
  updateConfigContext({
    PROXY_PATH: "/proxy",
    EMULATOR_ENDPOINT: "https://localhost:8081",
-    PORTAL_BACKEND_ENDPOINT: PortalBackendEndpoints.Mpac,
-    MONGO_PROXY_ENDPOINT: MongoProxyEndpoints.Mpac,
-    CASSANDRA_PROXY_ENDPOINT: CassandraProxyEndpoints.Mpac,
  });
 }

--- a/src/Contracts/AzureResourceGraph.ts
+++ b/src/Contracts/AzureResourceGraph.ts
@@ -1,8 +1,7 @@
 export interface QueryRequestOptions {
  $skipToken?: string;
  $top?: number;
-  $allowPartialScopes: boolean;
-  subscriptions?: string[];
+  subscriptions: string[];
 }

 export interface QueryResponse {
--- a/src/Contracts/DataExplorerMessagesContract.ts
+++ b/src/Contracts/DataExplorerMessagesContract.ts
@@ -1,22 +1,37 @@
-import { FabricMessageTypes } from "./FabricMessageTypes";
+import { MessageTypes } from "./MessageTypes";

 // This is the current version of these messages
-export const DATA_EXPLORER_RPC_VERSION = "3";
+export const DATA_EXPLORER_RPC_VERSION = "2";

 // Data Explorer to Fabric
-export type DataExploreMessageV3 =
+
+// TODO Remove when upgrading to Fabric v2
+export type DataExploreMessageV1 =
+  | "ready"
  | {
-      type: FabricMessageTypes.Ready;
-      id: string;
-      params: [string]; // version
-    }
-  | {
-      type: FabricMessageTypes.GetAuthorizationToken;
+      type: MessageTypes.GetAuthorizationToken;
      id: string;
      params: GetCosmosTokenMessageOptions[];
    }
  | {
-      type: FabricMessageTypes.GetAllResourceTokens;
+      type: MessageTypes.GetAllResourceTokens;
+      id: string;
+    };
+// -----------------------------
+
+export type DataExploreMessageV2 =
+  | {
+      type: MessageTypes.Ready;
+      id: string;
+      params: [string]; // version
+    }
+  | {
+      type: MessageTypes.GetAuthorizationToken;
+      id: string;
+      params: GetCosmosTokenMessageOptions[];
+    }
+  | {
+      type: MessageTypes.GetAllResourceTokens;
      id: string;
    };

--- a/src/Contracts/DataModels.ts
+++ b/src/Contracts/DataModels.ts
@@ -1,4 +1,4 @@
-import { CapacityMode, ConnectionStatusType, ContainerStatusType } from "../Common/Constants";
+import { ConnectionStatusType, ContainerStatusType } from "../Common/Constants";

 export interface ArmEntity {
  id: string;
@@ -35,7 +35,6 @@ export interface DatabaseAccountExtendedProperties {
  ipRules?: IpRule[];
  privateEndpointConnections?: unknown[];
  capacity?: { totalThroughputLimit: number };
-  capacityMode?: CapacityMode;
  locations?: DatabaseAccountResponseLocation[];
  postgresqlEndpoint?: string;
  publicNetworkAccess?: string;
@@ -158,7 +157,6 @@ export interface Collection extends Resource {
  changeFeedPolicy?: ChangeFeedPolicy;
  analyticalStorageTtl?: number;
  geospatialConfig?: GeospatialConfig;
-  vectorEmbeddingPolicy?: VectorEmbeddingPolicy;
  schema?: ISchema;
  requestSchema?: () => void;
  computedProperties?: ComputedProperties;
@@ -196,14 +194,8 @@ export interface IndexingPolicy {
  indexingMode: "consistent" | "lazy" | "none";
  includedPaths: any;
  excludedPaths: any;
-  compositeIndexes?: any[];
-  spatialIndexes?: any[];
-  vectorIndexes?: VectorIndex[];
-}
-
-export interface VectorIndex {
-  path: string;
-  type: "flat" | "diskANN" | "quantizedFlat";
+  compositeIndexes?: any;
+  spatialIndexes?: any;
 }

 export interface ComputedProperty {
@@ -341,18 +333,6 @@ export interface CreateCollectionParams {
  partitionKey?: PartitionKey;
  uniqueKeyPolicy?: UniqueKeyPolicy;
  createMongoWildcardIndex?: boolean;
-  vectorEmbeddingPolicy?: VectorEmbeddingPolicy;
-}
-
-export interface VectorEmbeddingPolicy {
-  vectorEmbeddings: VectorEmbedding[];
-}
-
-export interface VectorEmbedding {
-  dataType: "float16" | "float32" | "uint8" | "int8";
-  dimensions: number;
-  distanceFunction: "euclidean" | "cosine" | "dotproduct";
-  path: string;
 }

 export interface ReadDatabaseOfferParams {
--- a/src/Contracts/FabricMessageTypes.ts
+++ b/src/Contracts/FabricMessageTypes.ts
@@ -1,13 +0,0 @@
-/**
- * Data Explorer -> Fabric communication.
- */
-export enum FabricMessageTypes {
-  GetAuthorizationToken = "GetAuthorizationToken",
-  GetAllResourceTokens = "GetAllResourceTokens",
-  Ready = "Ready",
-}
-
-export interface AuthorizationToken {
-  XDate: string;
-  PrimaryReadWriteToken: string;
-}
--- a/src/Contracts/FabricMessagesContract.ts
+++ b/src/Contracts/FabricMessagesContract.ts
@@ -1,4 +1,4 @@
-import { AuthorizationToken } from "Contracts/FabricMessageTypes";
+import { AuthorizationToken } from "./MessageTypes";

 // This is the version of these messages
 export const FABRIC_RPC_VERSION = "2";
--- a/src/Contracts/MessageTypes.ts
+++ b/src/Contracts/MessageTypes.ts
@@ -1,13 +1,12 @@
 /**
 * Messaging types used with Data Explorer <-> Portal communication,
- * Hosted <-> Explorer communication
+ * Hosted <-> Explorer communication and Data Explorer -> Fabric communication.
 *
 * !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
 * WARNING: !!!!!!! YOU CAN ONLY ADD NEW TYPES TO THE END OF THIS ENUM !!!!!!!
 * !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
 *
 * Enum are integers, so inserting or deleting a type will break the communication.
- *
 */
 export enum MessageTypes {
  TelemetryInfo,
@@ -44,9 +43,13 @@ export enum MessageTypes {
  DisplayNPSSurvey,
  OpenVCoreMongoNetworkingBlade,
  OpenVCoreMongoConnectionStringsBlade,
-  GetAuthorizationToken, // unused. Can be removed if the portal uses the same list of enums.
-  GetAllResourceTokens, // unused. Can be removed if the portal uses the same list of enums.
-  Ready, // unused. Can be removed if the portal uses the same list of enums.
+  GetAuthorizationToken, // Data Explorer -> Fabric
+  GetAllResourceTokens, // Data Explorer -> Fabric
+  Ready, // Data Explorer -> Fabric
  OpenCESCVAFeedbackBlade,
-  ActivateTab,
+}
+
+export interface AuthorizationToken {
+  XDate: string;
+  PrimaryReadWriteToken: string;
 }
--- a/src/Contracts/ViewModels.ts
+++ b/src/Contracts/ViewModels.ts
@@ -98,6 +98,7 @@ export interface Database extends TreeNode {
  openAddCollection(database: Database, event: MouseEvent): void;
  onSettingsClick: () => void;
  loadOffer(): Promise<void>;
+  getPendingThroughputSplitNotification(): Promise<DataModels.Notification>;
 }

 export interface CollectionBase extends TreeNode {
@@ -175,11 +176,6 @@ export interface Collection extends CollectionBase {
  loadTriggers(): Promise<any>;
  loadOffer(): Promise<void>;

-  showStoredProcedures: ko.Observable<boolean>;
-  showTriggers: ko.Observable<boolean>;
-  showUserDefinedFunctions: ko.Observable<boolean>;
-  showConflicts: ko.Observable<boolean>;
-
  createStoredProcedureNode(data: StoredProcedureDefinition & Resource): StoredProcedure;
  createUserDefinedFunctionNode(data: UserDefinedFunctionDefinition & Resource): UserDefinedFunction;
  createTriggerNode(data: TriggerDefinition | SqlTriggerResource): Trigger;
@@ -190,6 +186,8 @@ export interface Collection extends CollectionBase {
  onDragOver(source: Collection, event: { originalEvent: DragEvent }): void;
  onDrop(source: Collection, event: { originalEvent: DragEvent }): void;
  uploadFiles(fileList: FileList): Promise<{ data: UploadDetailsRecord[] }>;
+
+  getPendingThroughputSplitNotification(): Promise<DataModels.Notification>;
 }

 /**
@@ -326,9 +324,9 @@ export enum DocumentExplorerState {
  noDocumentSelected,
  newDocumentValid,
  newDocumentInvalid,
-  existingDocumentNoEdits,
-  existingDocumentDirtyValid,
-  existingDocumentDirtyInvalid,
+  exisitingDocumentNoEdits,
+  exisitingDocumentDirtyValid,
+  exisitingDocumentDirtyInvalid,
 }

 export enum IndexingPolicyEditorState {
@@ -341,9 +339,9 @@ export enum IndexingPolicyEditorState {
 export enum ScriptEditorState {
  newInvalid,
  newValid,
-  existingNoEdits,
-  existingDirtyValid,
-  existingDirtyInvalid,
+  exisitingNoEdits,
+  exisitingDirtyValid,
+  exisitingDirtyInvalid,
 }

 export enum CollectionTabKind {
@@ -389,7 +387,6 @@ export interface DataExplorerInputsFrame {
  dnsSuffix?: string;
  serverId?: string;
  extensionEndpoint?: string;
-  portalBackendEndpoint?: string;
  mongoProxyEndpoint?: string;
  cassandraProxyEndpoint?: string;
  subscriptionType?: SubscriptionType;
@@ -422,7 +419,6 @@ export interface SelfServeFrameInputs {
  authorizationToken: string;
  csmEndpoint: string;
  flights?: readonly string[];
-  catalogAPIKey: string;
 }

 export class MonacoEditorSettings {
--- a/src/Controls/Heatmap/Heatmap.test.ts
+++ b/src/Controls/Heatmap/Heatmap.test.ts
@@ -36,21 +36,21 @@ describe("The Heatmap Control", () => {
    });

    it("should call _getChartSettings when drawHeatmap is invoked", () => {
-      const _getChartSettings = jest.spyOn(heatmap, "_getChartSettings");
+      const _getChartSettings = spyOn<any>(heatmap, "_getChartSettings");
      heatmap.drawHeatmap();
-      expect(_getChartSettings).toHaveBeenCalled();
+      expect(_getChartSettings.calls.any()).toBe(true);
    });

    it("should call _getLayoutSettings when drawHeatmap is invoked", () => {
-      const _getLayoutSettings = jest.spyOn(heatmap, "_getLayoutSettings");
+      const _getLayoutSettings = spyOn<any>(heatmap, "_getLayoutSettings");
      heatmap.drawHeatmap();
-      expect(_getLayoutSettings).toHaveBeenCalled();
+      expect(_getLayoutSettings.calls.any()).toBe(true);
    });

    it("should call _getChartDisplaySettings when drawHeatmap is invoked", () => {
-      const _getChartDisplaySettings = jest.spyOn(heatmap, "_getChartDisplaySettings");
+      const _getChartDisplaySettings = spyOn<any>(heatmap, "_getChartDisplaySettings");
      heatmap.drawHeatmap();
-      expect(_getChartDisplaySettings).toHaveBeenCalled();
+      expect(_getChartDisplaySettings.calls.any()).toBe(true);
    });

    it("drawHeatmap should render a Heatmap inside the div element", () => {
--- a/src/Controls/Heatmap/Heatmap.ts
+++ b/src/Controls/Heatmap/Heatmap.ts
@@ -96,8 +96,7 @@ export class Heatmap {
    return output;
  }

-  // public for testing purposes
-  public _getChartSettings(): ChartSettings[] {
+  private _getChartSettings(): ChartSettings[] {
    return [
      {
        z: this._chartData.dataPoints,
@@ -132,8 +131,7 @@ export class Heatmap {
    ];
  }

-  // public for testing purposes
-  public _getLayoutSettings(): LayoutSettings {
+  private _getLayoutSettings(): LayoutSettings {
    return {
      margin: {
        l: 40,
@@ -179,8 +177,7 @@ export class Heatmap {
    };
  }

-  // public for testing purposes
-  public _getChartDisplaySettings(): DisplaySettings {
+  private _getChartDisplaySettings(): DisplaySettings {
    return {
      /* heatmap can be fully responsive however the min-height needed in that case is greater than the iframe portal height, hence explicit width + height have been set in _getLayoutSettings
      responsive: true,*/
--- a/src/Explorer/ContextMenuButtonFactory.tsx
+++ b/src/Explorer/ContextMenuButtonFactory.tsx
@@ -1,4 +1,3 @@
-import { TreeNodeMenuItem } from "Explorer/Controls/TreeComponent/TreeNodeComponent";
 import { useDatabases } from "Explorer/useDatabases";
 import { Action } from "Shared/Telemetry/TelemetryConstants";
 import { traceOpen } from "Shared/Telemetry/TelemetryProcessor";
@@ -20,6 +19,7 @@ import { userContext } from "../UserContext";
 import { getCollectionName, getDatabaseName } from "../Utils/APITypeUtils";
 import { useSidePanel } from "../hooks/useSidePanel";
 import { Platform, configContext } from "./../ConfigContext";
+import { TreeNodeMenuItem } from "./Controls/TreeComponent/TreeComponent";
 import Explorer from "./Explorer";
 import { useNotebook } from "./Notebook/useNotebook";
 import { DeleteCollectionConfirmationPane } from "./Panes/DeleteCollectionConfirmationPane/DeleteCollectionConfirmationPane";
@@ -100,16 +100,6 @@ export const createCollectionContextMenuButton = (
    });
  }

-  if (useNotebook.getState().isShellEnabled && userContext.apiType === "Cassandra") {
-    items.push({
-      iconSrc: HostedTerminalIcon,
-      onClick: () => {
-        container.openNotebookTerminal(ViewModels.TerminalKind.Cassandra);
-      },
-      label: "Open Cassandra Shell",
-    });
-  }
-
  if (
    configContext.platform !== Platform.Fabric &&
    (userContext.apiType === "SQL" || userContext.apiType === "Gremlin")
--- a/src/Explorer/Controls/CollapsiblePanel/CollapsibleSectionComponent.tsx
+++ b/src/Explorer/Controls/CollapsiblePanel/CollapsibleSectionComponent.tsx
@@ -1,4 +1,4 @@
-import { DirectionalHint, Icon, Label, Stack, TooltipHost } from "@fluentui/react";
+import { Icon, Label, Stack } from "@fluentui/react";
 import * as React from "react";
 import { NormalizedEventKey } from "../../../Common/Constants";
 import { accordionStackTokens } from "../Settings/SettingsRenderUtils";
@@ -8,7 +8,6 @@ export interface CollapsibleSectionProps {
  isExpandedByDefault: boolean;
  onExpand?: () => void;
  children: JSX.Element;
-  tooltipContent?: string | JSX.Element | JSX.Element[];
 }

 export interface CollapsibleSectionState {
@@ -27,8 +26,8 @@ export class CollapsibleSectionComponent extends React.Component<CollapsibleSect
    this.setState({ isExpanded: !this.state.isExpanded });
  };

-  public componentDidUpdate(_prevProps: CollapsibleSectionProps, prevState: CollapsibleSectionState): void {
-    if (!prevState.isExpanded && this.state.isExpanded && this.props.onExpand) {
+  public componentDidUpdate(): void {
+    if (this.state.isExpanded && this.props.onExpand) {
      this.props.onExpand();
    }
  }
@@ -44,7 +43,7 @@ export class CollapsibleSectionComponent extends React.Component<CollapsibleSect
    return (
      <>
        <Stack
-          className={"collapsibleSection"}
+          className="collapsibleSection"
          horizontal
          verticalAlign="center"
          tokens={accordionStackTokens}
@@ -56,19 +55,6 @@ export class CollapsibleSectionComponent extends React.Component<CollapsibleSect
        >
          <Icon iconName={this.state.isExpanded ? "ChevronDown" : "ChevronRight"} />
          <Label>{this.props.title}</Label>
-          {this.props.tooltipContent && (
-            <TooltipHost
-              directionalHint={DirectionalHint.bottomLeftEdge}
-              content={this.props.tooltipContent}
-              styles={{
-                root: {
-                  marginLeft: "0 !important",
-                },
-              }}
-            >
-              <Icon iconName="Info" className="panelInfoIcon" tabIndex={0} />
-            </TooltipHost>
-          )}
        </Stack>
        {this.state.isExpanded && this.props.children}
      </>
--- a/src/Explorer/Controls/CollapsiblePanel/snapshots/CollapsibleSectionComponent.test.tsx.snap
+++ b/src/Explorer/Controls/CollapsiblePanel/snapshots/CollapsibleSectionComponent.test.tsx.snap
@@ -11,7 +11,7 @@ exports[`CollapsibleSectionComponent renders 1`] = `
    role="button"
    tabIndex={0}
    tokens={
-      {
+      Object {
        "childrenGap": 10,
      }
    }
--- a/src/Explorer/Controls/CommandButton/CommandButtonComponent.tsx
+++ b/src/Explorer/Controls/CommandButton/CommandButtonComponent.tsx
@@ -1,7 +1,6 @@
 /**
 * React component for Command button component.
 */
-import { KeyboardAction } from "KeyboardShortcuts";
 import * as React from "react";
 import CollapseChevronDownIcon from "../../../../images/QueryBuilder/CollapseChevronDown_16x.png";
 import { KeyCodes } from "../../../Common/Constants";
@@ -31,7 +30,7 @@ export interface CommandButtonComponentProps {
  /**
   * Click handler for command button click
   */
-  onCommandClick?: (e: React.SyntheticEvent | KeyboardEvent) => void;
+  onCommandClick: (e: React.SyntheticEvent) => void;

  /**
   * Label for the button
@@ -108,17 +107,10 @@ export interface CommandButtonComponentProps {
   * Vertical bar to divide buttons
   */
  isDivider?: boolean;
-
  /**
   * Aria-label for the button
   */
  ariaLabel: string;
-
-  /**
-   * If specified, a keyboard action that should trigger this button's onCommandClick handler when activated.
-   * If not specified, the button will not be triggerable by keyboard shortcuts.
-   */
-  keyboardAction?: KeyboardAction;
 }

 export class CommandButtonComponent extends React.Component<CommandButtonComponentProps> {
--- a/src/Explorer/Controls/Editor/EditorReact.tsx
+++ b/src/Explorer/Controls/Editor/EditorReact.tsx
@@ -20,23 +20,14 @@ export interface EditorReactProps {
  lineDecorationsWidth?: monaco.editor.IEditorOptions["lineDecorationsWidth"];
  minimap?: monaco.editor.IEditorOptions["minimap"];
  scrollBeyondLastLine?: monaco.editor.IEditorOptions["scrollBeyondLastLine"];
-  fontSize?: monaco.editor.IEditorOptions["fontSize"];
  monacoContainerStyles?: React.CSSProperties;
-  className?: string;
-  spinnerClassName?: string;
-
-  enableWordWrapContextMenuItem?: boolean; // Enable/Disable "Word Wrap" context menu item
-  onWordWrapChanged?: (wordWrap: "on" | "off") => void; // Called when word wrap is changed
 }

 export class EditorReact extends React.Component<EditorReactProps, EditorReactStates> {
-  private static readonly VIEWING_OPTIONS_GROUP_ID = "viewingoptions"; // Group ID for the context menu group
  private rootNode: HTMLElement;
  private editor: monaco.editor.IStandaloneCodeEditor;
  private selectionListener: monaco.IDisposable;

-  private monacoEditorOptionsWordWrap: monaco.editor.EditorOption;
-
  public constructor(props: EditorReactProps) {
    super(props);
    this.state = {
@@ -55,25 +46,9 @@ export class EditorReact extends React.Component<EditorReactProps, EditorReactSt
    }, 100);
  }

-  public componentDidUpdate() {
-    if (!this.editor) {
-      return;
-    }
-
-    const existingContent = this.editor.getModel().getValue();
-
-    if (this.props.content !== existingContent) {
-      if (this.props.isReadOnly) {
-        this.editor.setValue(this.props.content);
-      } else {
-        this.editor.pushUndoStop();
-        this.editor.executeEdits("", [
-          {
-            range: this.editor.getModel().getFullModelRange(),
-            text: this.props.content,
-          },
-        ]);
-      }
+  public componentDidUpdate(previous: EditorReactProps) {
+    if (this.props.content !== previous.content) {
+      this.editor?.setValue(this.props.content);
    }
  }

@@ -84,11 +59,9 @@ export class EditorReact extends React.Component<EditorReactProps, EditorReactSt
  public render(): JSX.Element {
    return (
      <React.Fragment>
-        {!this.state.showEditor && (
-          <Spinner size={SpinnerSize.large} className={this.props.spinnerClassName || "spinner"} />
-        )}
+        {!this.state.showEditor && <Spinner size={SpinnerSize.large} className="spinner" />}
        <div
-          className={this.props.className || "jsonEditor"}
+          className="jsonEditor"
          style={this.props.monacoContainerStyles}
          ref={(elt: HTMLElement) => this.setRef(elt)}
        />
@@ -98,14 +71,9 @@ export class EditorReact extends React.Component<EditorReactProps, EditorReactSt

  protected configureEditor(editor: monaco.editor.IStandaloneCodeEditor) {
    this.editor = editor;
+    const queryEditorModel = this.editor.getModel();
    if (!this.props.isReadOnly && this.props.onContentChanged) {
-      // Hooking the model's onDidChangeContent event because of some event ordering issues.
-      // If a single user input causes BOTH the editor content to change AND the cursor selection to change (which is likely),
-      // then there are some inconsistencies as to which event fires first.
-      // But the editor.onDidChangeModelContent event seems to always fire before the cursor selection event.
-      // (This is NOT true for the model's onDidChangeContent event, which sometimes fires after the cursor selection event.)
-      // If the cursor selection event fires first, then the calling component may re-render the component with old content, so we want to ensure the model content changed event always fires first.
-      this.editor.onDidChangeModelContent(() => {
+      queryEditorModel.onDidChangeContent(() => {
        const queryEditorModel = this.editor.getModel();
        this.props.onContentChanged(queryEditorModel.getValue());
      });
@@ -119,23 +87,6 @@ export class EditorReact extends React.Component<EditorReactProps, EditorReactSt
        },
      );
    }
-
-    if (this.props.enableWordWrapContextMenuItem) {
-      editor.addAction({
-        // An unique identifier of the contributed action.
-        id: "wordwrap",
-        label: "Toggle Word Wrap",
-        contextMenuGroupId: EditorReact.VIEWING_OPTIONS_GROUP_ID,
-        contextMenuOrder: 1,
-        // Method that will be executed when the action is triggered.
-        // @param editor The editor instance is passed in as a convenience
-        run: (ed) => {
-          const newOption = ed.getOption(this.monacoEditorOptionsWordWrap) === "on" ? "off" : "on";
-          ed.updateOptions({ wordWrap: newOption });
-          this.props.onWordWrapChanged(newOption);
-        },
-      });
-    }
  }

  /**
@@ -147,7 +98,7 @@ export class EditorReact extends React.Component<EditorReactProps, EditorReactSt
      value: this.props.content,
      readOnly: this.props.isReadOnly,
      ariaLabel: this.props.ariaLabel,
-      fontSize: this.props.fontSize || 12,
+      fontSize: 12,
      automaticLayout: true,
      theme: this.props.theme,
      wordWrap: this.props.wordWrap || "off",
@@ -159,18 +110,8 @@ export class EditorReact extends React.Component<EditorReactProps, EditorReactSt
    };

    this.rootNode.innerHTML = "";
-    const lazymonaco = await loadMonaco();
-
-    // We can only get this constant after loading monaco lazily
-    this.monacoEditorOptionsWordWrap = lazymonaco.editor.EditorOption.wordWrap;
-
-    try {
-      createCallback(lazymonaco?.editor?.create(this.rootNode, options));
-    } catch (error) {
-      // This could happen if the parent node suddenly disappears during create()
-      console.error("Unable to create EditorReact", error);
-      return;
-    }
+    const monaco = await loadMonaco();
+    createCallback(monaco?.editor?.create(this.rootNode, options));

    if (this.rootNode.innerHTML) {
      this.setState({
--- a/src/Explorer/Controls/FeaturePanel/snapshots/FeaturePanelComponent.test.tsx.snap
+++ b/src/Explorer/Controls/FeaturePanel/snapshots/FeaturePanelComponent.test.tsx.snap
@@ -18,7 +18,7 @@ exports[`Feature panel renders all flags 1`] = `
  <Stack
    className="options"
    tokens={
-      {
+      Object {
        "childrenGap": 10,
      }
    }
@@ -27,7 +27,7 @@ exports[`Feature panel renders all flags 1`] = `
      horizontal={true}
      horizontalAlign="space-between"
      tokens={
-        {
+        Object {
          "childrenGap": 10,
        }
      }
@@ -52,7 +52,7 @@ exports[`Feature panel renders all flags 1`] = `
      horizontal={true}
      horizontalAlign="start"
      tokens={
-        {
+        Object {
          "childrenGap": 10,
        }
      }
@@ -61,16 +61,16 @@ exports[`Feature panel renders all flags 1`] = `
        label="Base Url"
        onChange={[Function]}
        options={
-          [
-            {
+          Array [
+            Object {
              "key": "https://localhost:1234/explorer.html",
              "text": "localhost:1234",
            },
-            {
+            Object {
              "key": "https://cosmos.azure.com/explorer.html",
              "text": "cosmos.azure.com",
            },
-            {
+            Object {
              "key": "https://portal.azure.com",
              "text": "portal",
            },
@@ -78,8 +78,8 @@ exports[`Feature panel renders all flags 1`] = `
        }
        selectedKey="https://localhost:1234/explorer.html"
        styles={
-          {
-            "dropdown": {
+          Object {
+            "dropdown": Object {
              "width": 200,
            },
          }
@@ -89,20 +89,20 @@ exports[`Feature panel renders all flags 1`] = `
        label="Platform"
        onChange={[Function]}
        options={
-          [
-            {
+          Array [
+            Object {
              "key": "Hosted",
              "text": "Hosted",
            },
-            {
+            Object {
              "key": "Portal",
              "text": "Portal",
            },
-            {
+            Object {
              "key": "Emulator",
              "text": "Emulator",
            },
-            {
+            Object {
              "key": "",
              "text": "None",
            },
@@ -110,8 +110,8 @@ exports[`Feature panel renders all flags 1`] = `
        }
        selectedKey="Hosted"
        styles={
-          {
-            "dropdown": {
+          Object {
+            "dropdown": Object {
              "width": 200,
            },
          }
@@ -208,7 +208,7 @@ exports[`Feature panel renders all flags 1`] = `
    <Stack
      horizontal={true}
      tokens={
-        {
+        Object {
          "childrenGap": 10,
        }
      }
@@ -222,8 +222,8 @@ exports[`Feature panel renders all flags 1`] = `
          onChange={[Function]}
          placeholder="https://notebookserver"
          styles={
-            {
-              "fieldGroup": {
+            Object {
+              "fieldGroup": Object {
                "width": 300,
              },
            }
@@ -235,8 +235,8 @@ exports[`Feature panel renders all flags 1`] = `
          onChange={[Function]}
          placeholder=""
          styles={
-            {
-              "fieldGroup": {
+            Object {
+              "fieldGroup": Object {
                "width": 300,
              },
            }
@@ -248,8 +248,8 @@ exports[`Feature panel renders all flags 1`] = `
          onChange={[Function]}
          placeholder=""
          styles={
-            {
-              "fieldGroup": {
+            Object {
+              "fieldGroup": Object {
                "width": 300,
              },
            }
@@ -265,8 +265,8 @@ exports[`Feature panel renders all flags 1`] = `
          onChange={[Function]}
          placeholder=""
          styles={
-            {
-              "fieldGroup": {
+            Object {
+              "fieldGroup": Object {
                "width": 300,
              },
            }
@@ -279,8 +279,8 @@ exports[`Feature panel renders all flags 1`] = `
          onChange={[Function]}
          placeholder="https://localhost:1234/explorer.html"
          styles={
-            {
-              "fieldGroup": {
+            Object {
+              "fieldGroup": Object {
                "width": 300,
              },
            }
@@ -292,8 +292,8 @@ exports[`Feature panel renders all flags 1`] = `
          onChange={[Function]}
          placeholder=""
          styles={
-            {
-              "fieldGroup": {
+            Object {
+              "fieldGroup": Object {
                "width": 300,
              },
            }
--- a/src/Explorer/Controls/NotebookGallery/Cards/snapshots/GalleryCardComponent.test.tsx.snap
+++ b/src/Explorer/Controls/NotebookGallery/Cards/snapshots/GalleryCardComponent.test.tsx.snap
@@ -4,8 +4,8 @@ exports[`GalleryCardComponent renders 1`] = `
 <StyledDocumentCardBase
  aria-label="name"
  styles={
-    {
-      "root": {
+    Object {
+      "root": Object {
        "display": "inline-block",
        "marginRight": 20,
        "width": 256,
@@ -16,8 +16,8 @@ exports[`GalleryCardComponent renders 1`] = `
  <StyledDocumentCardActivityBase
    activity="Invalid Date"
    people={
-      [
-        {
+      Array [
+        Object {
          "name": "author",
          "profileImageSrc": false,
        },
@@ -26,8 +26,8 @@ exports[`GalleryCardComponent renders 1`] = `
  />
  <StyledDocumentCardPreviewBase
    previewImages={
-      [
-        {
+      Array [
+        Object {
          "height": 144,
          "imageFit": 2,
          "previewImageSrc": "thumbnailUrl",
@@ -40,8 +40,8 @@ exports[`GalleryCardComponent renders 1`] = `
    <Text
      nowrap={true}
      styles={
-        {
-          "root": {
+        Object {
+          "root": Object {
            "height": 18,
            "padding": "2px 16px",
          },
@@ -69,15 +69,15 @@ exports[`GalleryCardComponent renders 1`] = `
    />
    <span
      style={
-        {
+        Object {
          "padding": "8px 16px",
        }
      }
    >
      <Text
        styles={
-          {
-            "root": {
+          Object {
+            "root": Object {
              "color": "#605E5C",
              "paddingRight": 8,
            },
@@ -88,8 +88,8 @@ exports[`GalleryCardComponent renders 1`] = `
        <Icon
          iconName="RedEye"
          styles={
-            {
-              "root": {
+            Object {
+              "root": Object {
                "verticalAlign": "middle",
              },
            }
@@ -100,8 +100,8 @@ exports[`GalleryCardComponent renders 1`] = `
      </Text>
      <Text
        styles={
-          {
-            "root": {
+          Object {
+            "root": Object {
              "color": "#605E5C",
              "paddingRight": 8,
            },
@@ -112,8 +112,8 @@ exports[`GalleryCardComponent renders 1`] = `
        <Icon
          iconName="Download"
          styles={
-            {
-              "root": {
+            Object {
+              "root": Object {
                "verticalAlign": "middle",
              },
            }
@@ -124,8 +124,8 @@ exports[`GalleryCardComponent renders 1`] = `
      </Text>
      <Text
        styles={
-          {
-            "root": {
+          Object {
+            "root": Object {
              "color": "#605E5C",
              "paddingRight": 8,
            },
@@ -136,8 +136,8 @@ exports[`GalleryCardComponent renders 1`] = `
        <Icon
          iconName="Heart"
          styles={
-            {
-              "root": {
+            Object {
+              "root": Object {
                "verticalAlign": "middle",
              },
            }
@@ -151,8 +151,8 @@ exports[`GalleryCardComponent renders 1`] = `
  <StyledDocumentCardDetailsBase>
    <Separator
      styles={
-        {
-          "root": {
+        Object {
+          "root": Object {
            "height": 1,
            "padding": 0,
          },
@@ -161,22 +161,22 @@ exports[`GalleryCardComponent renders 1`] = `
    />
    <span
      style={
-        {
+        Object {
          "padding": "0px 16px",
        }
      }
    >
      <StyledTooltipHostBase
        calloutProps={
-          {
+          Object {
            "gapSpace": 0,
          }
        }
        content="Favorite"
        id="TooltipHost-IconButton-Heart"
        styles={
-          {
-            "root": {
+          Object {
+            "root": Object {
              "display": "inline-block",
              "float": "left",
            },
@@ -186,7 +186,7 @@ exports[`GalleryCardComponent renders 1`] = `
        <CustomizedIconButton
          ariaLabel="Favorite"
          iconProps={
-            {
+            Object {
              "iconName": "Heart",
            }
          }
@@ -196,15 +196,15 @@ exports[`GalleryCardComponent renders 1`] = `
      </StyledTooltipHostBase>
      <StyledTooltipHostBase
        calloutProps={
-          {
+          Object {
            "gapSpace": 0,
          }
        }
        content="Download"
        id="TooltipHost-IconButton-Download"
        styles={
-          {
-            "root": {
+          Object {
+            "root": Object {
              "display": "inline-block",
              "float": "left",
            },
@@ -214,7 +214,7 @@ exports[`GalleryCardComponent renders 1`] = `
        <CustomizedIconButton
          ariaLabel="Download"
          iconProps={
-            {
+            Object {
              "iconName": "Download",
            }
          }
@@ -224,15 +224,15 @@ exports[`GalleryCardComponent renders 1`] = `
      </StyledTooltipHostBase>
      <StyledTooltipHostBase
        calloutProps={
-          {
+          Object {
            "gapSpace": 0,
          }
        }
        content="Remove"
        id="TooltipHost-IconButton-Delete"
        styles={
-          {
-            "root": {
+          Object {
+            "root": Object {
              "display": "inline-block",
              "float": "right",
            },
@@ -242,7 +242,7 @@ exports[`GalleryCardComponent renders 1`] = `
        <CustomizedIconButton
          ariaLabel="Remove"
          iconProps={
-            {
+            Object {
              "iconName": "Delete",
            }
          }
--- a/src/Explorer/Controls/NotebookGallery/CodeOfConduct/snapshots/CodeOfConduct.test.tsx.snap
+++ b/src/Explorer/Controls/NotebookGallery/CodeOfConduct/snapshots/CodeOfConduct.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`CodeOfConduct renders 1`] = `
 <Stack
  tokens={
-    {
+    Object {
      "childrenGap": 20,
    }
  }
@@ -11,7 +11,7 @@ exports[`CodeOfConduct renders 1`] = `
  <StackItem>
    <Text
      style={
-        {
+        Object {
          "fontSize": "20px",
          "fontWeight": 500,
        }
@@ -41,12 +41,12 @@ exports[`CodeOfConduct renders 1`] = `
      label="I have read and accept the code of conduct."
      onChange={[Function]}
      styles={
-        {
-          "label": {
+        Object {
+          "label": Object {
            "margin": 0,
            "padding": "2 0 2 0",
          },
-          "text": {
+          "text": Object {
            "fontSize": 12,
          },
        }
--- a/src/Explorer/Controls/NotebookGallery/InfoComponent/snapshots/InfoComponent.test.tsx.snap
+++ b/src/Explorer/Controls/NotebookGallery/InfoComponent/snapshots/InfoComponent.test.tsx.snap
@@ -4,7 +4,7 @@ exports[`InfoComponent renders 1`] = `
 <StyledHoverCardBase
  instantOpenOnClick={true}
  plainCardProps={
-    {
+    Object {
      "onRenderPlainCard": [Function],
    }
  }
@@ -18,8 +18,8 @@ exports[`InfoComponent renders 1`] = `
      className="infoIconMain"
      iconName="Help"
      styles={
-        {
-          "root": {
+        Object {
+          "root": Object {
            "verticalAlign": "middle",
          },
        }
--- a/src/Explorer/Controls/NotebookGallery/snapshots/GalleryViewerComponent.test.tsx.snap
+++ b/src/Explorer/Controls/NotebookGallery/snapshots/GalleryViewerComponent.test.tsx.snap
@@ -13,14 +13,14 @@ exports[`GalleryViewerComponent renders 1`] = `
      itemKey="OfficialSamples"
      key="OfficialSamples"
      style={
-        {
+        Object {
          "marginTop": 20,
        }
      }
    >
      <Stack
        tokens={
-          {
+          Object {
            "childrenGap": 10,
          }
        }
@@ -28,7 +28,7 @@ exports[`GalleryViewerComponent renders 1`] = `
        <Stack
          horizontal={true}
          tokens={
-            {
+            Object {
              "childrenGap": 20,
              "padding": 10,
            }
@@ -50,8 +50,8 @@ exports[`GalleryViewerComponent renders 1`] = `
          </StackItem>
          <StackItem
            styles={
-              {
-                "root": {
+              Object {
+                "root": Object {
                  "minWidth": 200,
                },
              }
@@ -60,20 +60,20 @@ exports[`GalleryViewerComponent renders 1`] = `
            <Dropdown
              onChange={[Function]}
              options={
-                [
-                  {
+                Array [
+                  Object {
                    "key": 0,
                    "text": "Most viewed",
                  },
-                  {
+                  Object {
                    "key": 1,
                    "text": "Most downloaded",
                  },
-                  {
+                  Object {
                    "key": 3,
                    "text": "Most recent",
                  },
-                  {
+                  Object {
                    "key": 2,
                    "text": "Most favorited",
                  },
--- a/src/Explorer/Controls/NotebookViewer/snapshots/NotebookMetadataComponent.test.tsx.snap
+++ b/src/Explorer/Controls/NotebookViewer/snapshots/NotebookMetadataComponent.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`NotebookMetadataComponent renders liked notebook 1`] = `
 <Stack
  tokens={
-    {
+    Object {
      "childrenGap": 10,
    }
  }
@@ -11,7 +11,7 @@ exports[`NotebookMetadataComponent renders liked notebook 1`] = `
  <Stack
    horizontal={true}
    tokens={
-      {
+      Object {
        "childrenGap": 30,
      }
    }
@@ -29,7 +29,7 @@ exports[`NotebookMetadataComponent renders liked notebook 1`] = `
      <Text>
        <CustomizedIconButton
          iconProps={
-            {
+            Object {
              "iconName": "HeartFill",
            }
          }
@@ -53,7 +53,7 @@ exports[`NotebookMetadataComponent renders liked notebook 1`] = `
  <Stack
    horizontal={true}
    tokens={
-      {
+      Object {
        "childrenGap": 10,
      }
    }
@@ -96,8 +96,8 @@ exports[`NotebookMetadataComponent renders liked notebook 1`] = `
  </Text>
  <Text
    styles={
-      {
-        "root": {
+      Object {
+        "root": Object {
          "fontWeight": 600,
        },
      }
@@ -115,7 +115,7 @@ exports[`NotebookMetadataComponent renders liked notebook 1`] = `
 exports[`NotebookMetadataComponent renders un-liked notebook 1`] = `
 <Stack
  tokens={
-    {
+    Object {
      "childrenGap": 10,
    }
  }
@@ -123,7 +123,7 @@ exports[`NotebookMetadataComponent renders un-liked notebook 1`] = `
  <Stack
    horizontal={true}
    tokens={
-      {
+      Object {
        "childrenGap": 30,
      }
    }
@@ -141,7 +141,7 @@ exports[`NotebookMetadataComponent renders un-liked notebook 1`] = `
      <Text>
        <CustomizedIconButton
          iconProps={
-            {
+            Object {
              "iconName": "Heart",
            }
          }
@@ -165,7 +165,7 @@ exports[`NotebookMetadataComponent renders un-liked notebook 1`] = `
  <Stack
    horizontal={true}
    tokens={
-      {
+      Object {
        "childrenGap": 10,
      }
    }
@@ -208,8 +208,8 @@ exports[`NotebookMetadataComponent renders un-liked notebook 1`] = `
  </Text>
  <Text
    styles={
-      {
-        "root": {
+      Object {
+        "root": Object {
          "fontWeight": 600,
        },
      }
--- a/src/Explorer/Controls/Settings/SettingsComponent.less
+++ b/src/Explorer/Controls/Settings/SettingsComponent.less
@@ -7,14 +7,14 @@
 }

 .settingsV2ToolTip {
-  padding: 10px;
-  font: 12px @DataExplorerFont;
-  max-width: 300px;
+    padding: 10px;
+    font: 12px @DataExplorerFont;
+    max-width: 300px;
 }

 .autoPilotSelector span {
-  height: 25px;
-  font: 14px @DataExplorerFont;
+    height: 25px;
+    font: 14px @DataExplorerFont;
 }

 .settingsV2TabsContainer {
@@ -25,14 +25,7 @@
  font-family: @DataExplorerFont;
 }

-.settingsV2Editor {
+.settingsV2IndexingPolicyEditor {
  width: 100%;
  height: 60vh;
-}
-
-.settingsV2EditorSpinner {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
+}
--- a/src/Explorer/Controls/Settings/SettingsComponent.tsx
+++ b/src/Explorer/Controls/Settings/SettingsComponent.tsx
@@ -3,12 +3,7 @@ import {
  ComputedPropertiesComponent,
  ComputedPropertiesComponentProps,
 } from "Explorer/Controls/Settings/SettingsSubComponents/ComputedPropertiesComponent";
-import {
-  ContainerVectorPolicyComponent,
-  ContainerVectorPolicyComponentProps,
-} from "Explorer/Controls/Settings/SettingsSubComponents/ContainerVectorPolicyComponent";
 import { useDatabases } from "Explorer/useDatabases";
-import { isVectorSearchEnabled } from "Utils/CapabilityUtils";
 import { isRunningOnPublicCloud } from "Utils/CloudUtils";
 import * as React from "react";
 import DiscardIcon from "../../../../images/discard.svg";
@@ -130,6 +125,7 @@ export interface SettingsComponentState {
  conflictResolutionPolicyProcedureBaseline: string;
  isConflictResolutionDirty: boolean;

+  initialNotification: DataModels.Notification;
  selectedTab: SettingsV2TabTypes;
 }

@@ -148,7 +144,6 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
  private shouldShowComputedPropertiesEditor: boolean;
  private shouldShowIndexingPolicyEditor: boolean;
  private shouldShowPartitionKeyEditor: boolean;
-  private isVectorSearchEnabled: boolean;
  private totalThroughputUsed: number;
  public mongoDBCollectionResource: MongoDBCollectionResource;

@@ -163,7 +158,6 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
      this.shouldShowComputedPropertiesEditor = userContext.apiType === "SQL";
      this.shouldShowIndexingPolicyEditor = userContext.apiType !== "Cassandra" && userContext.apiType !== "Mongo";
      this.shouldShowPartitionKeyEditor = userContext.apiType === "SQL" && isRunningOnPublicCloud();
-      this.isVectorSearchEnabled = isVectorSearchEnabled() && !hasDatabaseSharedThroughput(this.collection);

      this.changeFeedPolicyVisible = userContext.features.enableChangeFeedPolicy;

@@ -228,6 +222,7 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
      conflictResolutionPolicyProcedureBaseline: undefined,
      isConflictResolutionDirty: false,

+      initialNotification: undefined,
      selectedTab: SettingsV2TabTypes.ScaleTab,
    };

@@ -1050,6 +1045,7 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
      onMaxAutoPilotThroughputChange: this.onMaxAutoPilotThroughputChange,
      onScaleSaveableChange: this.onScaleSaveableChange,
      onScaleDiscardableChange: this.onScaleDiscardableChange,
+      initialNotification: this.props.settingsTab.pendingNotification(),
      throughputError: this.state.throughputError,
    };

@@ -1101,7 +1097,6 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
      indexTransformationProgress: this.state.indexTransformationProgress,
      refreshIndexTransformationProgress: this.refreshIndexTransformationProgress,
      onIndexingPolicyDirtyChange: this.onIndexingPolicyDirtyChange,
-      isVectorSearchEnabled: this.isVectorSearchEnabled,
    };

    const mongoIndexingPolicyComponentProps: MongoIndexingPolicyComponentProps = {
@@ -1148,10 +1143,6 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
      explorer: this.props.settingsTab.getContainer(),
    };

-    const containerVectorPolicyProps: ContainerVectorPolicyComponentProps = {
-      vectorEmbeddingPolicy: this.collection.rawDataModel?.vectorEmbeddingPolicy,
-    };
-
    const tabs: SettingsV2TabInfo[] = [];
    if (!hasDatabaseSharedThroughput(this.collection) && this.offer) {
      tabs.push({
@@ -1165,13 +1156,6 @@ export class SettingsComponent extends React.Component<SettingsComponentProps, S
      content: <SubSettingsComponent {...subSettingsComponentProps} />,
    });

-    if (this.isVectorSearchEnabled) {
-      tabs.push({
-        tab: SettingsV2TabTypes.ContainerVectorPolicyTab,
-        content: <ContainerVectorPolicyComponent {...containerVectorPolicyProps} />,
-      });
-    }
-
    if (this.shouldShowIndexingPolicyEditor) {
      tabs.push({
        tab: SettingsV2TabTypes.IndexingPolicyTab,
--- a/src/Explorer/Controls/Settings/SettingsSubComponents/ComputedPropertiesComponent.tsx
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/ComputedPropertiesComponent.tsx
@@ -121,7 +121,7 @@ export class ComputedPropertiesComponent extends React.Component<
          </Link>
          &#160; about how to define computed properties and how to use them.
        </Text>
-        <div className="settingsV2Editor" tabIndex={0} ref={this.computedPropertiesDiv}></div>
+        <div className="settingsV2IndexingPolicyEditor" tabIndex={0} ref={this.computedPropertiesDiv}></div>
      </Stack>
    );
  }
--- a/src/Explorer/Controls/Settings/SettingsSubComponents/ContainerVectorPolicyComponent.tsx
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/ContainerVectorPolicyComponent.tsx
@@ -1,30 +0,0 @@
-import { Stack } from "@fluentui/react";
-import { VectorEmbeddingPolicy } from "Contracts/DataModels";
-import { EditorReact } from "Explorer/Controls/Editor/EditorReact";
-import { titleAndInputStackProps } from "Explorer/Controls/Settings/SettingsRenderUtils";
-import React from "react";
-
-export interface ContainerVectorPolicyComponentProps {
-  vectorEmbeddingPolicy: VectorEmbeddingPolicy;
-}
-
-export const ContainerVectorPolicyComponent: React.FC<ContainerVectorPolicyComponentProps> = ({
-  vectorEmbeddingPolicy,
-}) => {
-  return (
-    <Stack {...titleAndInputStackProps} styles={{ root: { position: "relative" } }}>
-      <EditorReact
-        language={"json"}
-        content={JSON.stringify(vectorEmbeddingPolicy || {}, null, 4)}
-        isReadOnly={true}
-        wordWrap={"on"}
-        ariaLabel={"Container vector policy"}
-        lineNumbers={"on"}
-        scrollBeyondLastLine={false}
-        className={"settingsV2Editor"}
-        spinnerClassName={"settingsV2EditorSpinner"}
-        fontSize={14}
-      />
-    </Stack>
-  );
-};
--- a/src/Explorer/Controls/Settings/SettingsSubComponents/IndexingPolicyComponent.tsx
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/IndexingPolicyComponent.tsx
@@ -16,7 +16,6 @@ export interface IndexingPolicyComponentProps {
  logIndexingPolicySuccessMessage: () => void;
  indexTransformationProgress: number;
  refreshIndexTransformationProgress: () => Promise<void>;
-  isVectorSearchEnabled?: boolean;
  onIndexingPolicyDirtyChange: (isIndexingPolicyDirty: boolean) => void;
 }

@@ -120,15 +119,10 @@ export class IndexingPolicyComponent extends React.Component<
          indexTransformationProgress={this.props.indexTransformationProgress}
          refreshIndexTransformationProgress={this.props.refreshIndexTransformationProgress}
        />
-        {this.props.isVectorSearchEnabled && (
-          <MessageBar messageBarType={MessageBarType.severeWarning}>
-            Container vector policies and vector indexes are not modifiable after container creation
-          </MessageBar>
-        )}
        {isDirty(this.props.indexingPolicyContent, this.props.indexingPolicyContentBaseline) && (
          <MessageBar messageBarType={MessageBarType.warning}>{unsavedEditorWarningMessage("indexPolicy")}</MessageBar>
        )}
-        <div className="settingsV2Editor" tabIndex={0} ref={this.indexingPolicyDiv}></div>
+        <div className="settingsV2IndexingPolicyEditor" tabIndex={0} ref={this.indexingPolicyDiv}></div>
      </Stack>
    );
  }
--- a/src/Explorer/Controls/Settings/SettingsSubComponents/IndexingPolicyRefresh/snapshots/IndexingPolicyRefreshComponent.test.tsx.snap
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/IndexingPolicyRefresh/snapshots/IndexingPolicyRefreshComponent.test.tsx.snap
@@ -6,8 +6,8 @@ exports[`IndexingPolicyRefreshComponent renders 1`] = `
 >
  <Text
    styles={
-      {
-        "root": {
+      Object {
+        "root": Object {
          "color": "windowtext",
          "fontSize": 14,
        },
--- a/src/Explorer/Controls/Settings/SettingsSubComponents/MongoIndexingPolicy/snapshots/AddMongoIndexComponent.test.tsx.snap
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/MongoIndexingPolicy/snapshots/AddMongoIndexComponent.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`AddMongoIndexComponent renders 1`] = `
 <Stack
  tokens={
-    {
+    Object {
      "childrenGap": 5,
    }
  }
@@ -11,7 +11,7 @@ exports[`AddMongoIndexComponent renders 1`] = `
  <Stack
    horizontal={true}
    tokens={
-      {
+      Object {
        "childrenGap": 20,
      }
    }
@@ -21,8 +21,8 @@ exports[`AddMongoIndexComponent renders 1`] = `
      componentRef={[Function]}
      onChange={[Function]}
      styles={
-        {
-          "root": {
+        Object {
+          "root": Object {
            "paddingLeft": 10,
            "width": 210,
          },
@@ -34,12 +34,12 @@ exports[`AddMongoIndexComponent renders 1`] = `
      ariaLabel="Index Type 1"
      onChange={[Function]}
      options={
-        [
-          {
+        Array [
+          Object {
            "key": "Single",
            "text": "Single Field",
          },
-          {
+          Object {
            "key": "Wildcard",
            "text": "Wildcard",
          },
@@ -48,8 +48,8 @@ exports[`AddMongoIndexComponent renders 1`] = `
      placeholder="Select an index type"
      selectedKey="Single"
      styles={
-        {
-          "dropdown": {
+        Object {
+          "dropdown": Object {
            "paddingleft": 10,
            "width": 202,
          },
@@ -60,7 +60,7 @@ exports[`AddMongoIndexComponent renders 1`] = `
      ariaLabel="Undo Button 1"
      disabled={false}
      iconProps={
-        {
+        Object {
          "iconName": "Undo",
        }
      }
@@ -70,8 +70,8 @@ exports[`AddMongoIndexComponent renders 1`] = `
  <StyledMessageBar
    messageBarType={1}
    styles={
-      {
-        "root": {
+      Object {
+        "root": Object {
          "marginLeft": 10,
        },
      }
--- a/src/Explorer/Controls/Settings/SettingsSubComponents/MongoIndexingPolicy/snapshots/MongoIndexingPolicyComponent.test.tsx.snap
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/MongoIndexingPolicy/snapshots/MongoIndexingPolicyComponent.test.tsx.snap
@@ -9,7 +9,7 @@ exports[`MongoIndexingPolicyComponent error shown for collection with compound i
 exports[`MongoIndexingPolicyComponent renders 1`] = `
 <Stack
  tokens={
-    {
+    Object {
      "childrenGap": 20,
    }
  }
@@ -29,14 +29,14 @@ exports[`MongoIndexingPolicyComponent renders 1`] = `
  </Text>
  <Stack
    styles={
-      {
-        "root": {
+      Object {
+        "root": Object {
          "width": 600,
        },
      }
    }
    tokens={
-      {
+      Object {
        "childrenGap": 5,
      }
    }
@@ -47,8 +47,8 @@ exports[`MongoIndexingPolicyComponent renders 1`] = `
    >
      <StyledWithViewportComponent
        columns={
-          [
-            {
+          Array [
+            Object {
              "fieldName": "definition",
              "isResizable": true,
              "key": "definition",
@@ -56,7 +56,7 @@ exports[`MongoIndexingPolicyComponent renders 1`] = `
              "minWidth": 100,
              "name": "Definition",
            },
-            {
+            Object {
              "fieldName": "type",
              "isResizable": true,
              "key": "type",
@@ -64,7 +64,7 @@ exports[`MongoIndexingPolicyComponent renders 1`] = `
              "minWidth": 100,
              "name": "Type",
            },
-            {
+            Object {
              "fieldName": "actionButton",
              "isResizable": true,
              "key": "actionButton",
@@ -75,15 +75,15 @@ exports[`MongoIndexingPolicyComponent renders 1`] = `
          ]
        }
        disableSelectionZone={true}
-        items={[]}
+        items={Array []}
        layoutMode={1}
        onRenderRow={[Function]}
        selectionMode={0}
        styles={
-          {
-            "root": {
-              "selectors": {
-                ".ms-FocusZone": {
+          Object {
+            "root": Object {
+              "selectors": Object {
+                ".ms-FocusZone": Object {
                  "paddingTop": 0,
                },
              },
@@ -93,14 +93,14 @@ exports[`MongoIndexingPolicyComponent renders 1`] = `
      />
      <Stack
        styles={
-          {
-            "root": {
+          Object {
+            "root": Object {
              "width": 600,
            },
          }
        }
        tokens={
-          {
+          Object {
            "childrenGap": 10,
          }
        }
@@ -117,11 +117,11 @@ exports[`MongoIndexingPolicyComponent renders 1`] = `
  </Stack>
  <Separator
    styles={
-      {
-        "root": [
-          {
-            "selectors": {
-              "::before": {
+      Object {
+        "root": Array [
+          Object {
+            "selectors": Object {
+              "::before": Object {
                "background": undefined,
              },
            },
@@ -132,8 +132,8 @@ exports[`MongoIndexingPolicyComponent renders 1`] = `
  />
  <Stack
    styles={
-      {
-        "root": {
+      Object {
+        "root": Object {
          "width": 600,
        },
      }
--- a/src/Explorer/Controls/Settings/SettingsSubComponents/ScaleComponent.test.tsx
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/ScaleComponent.test.tsx
@@ -1,10 +1,18 @@
+import { shallow } from "enzyme";
+import ko from "knockout";
+import React from "react";
 import * as Constants from "../../../../Common/Constants";
+import * as DataModels from "../../../../Contracts/DataModels";
 import { updateUserContext } from "../../../../UserContext";
 import Explorer from "../../../Explorer";
+import { throughputUnit } from "../SettingsRenderUtils";
 import { collection } from "../TestUtils";
 import { ScaleComponent, ScaleComponentProps } from "./ScaleComponent";
+import { ThroughputInputAutoPilotV3Component } from "./ThroughputInputComponents/ThroughputInputAutoPilotV3Component";

 describe("ScaleComponent", () => {
+  const targetThroughput = 6000;
+
  const baseProps: ScaleComponentProps = {
    collection: collection,
    database: undefined,
@@ -28,8 +36,39 @@ describe("ScaleComponent", () => {
    onScaleDiscardableChange: () => {
      return;
    },
+    initialNotification: {
+      description: `Throughput update for ${targetThroughput} ${throughputUnit}`,
+    } as DataModels.Notification,
  };

+  it("renders with correct initial notification", () => {
+    let wrapper = shallow(<ScaleComponent {...baseProps} />);
+    expect(wrapper).toMatchSnapshot();
+    expect(wrapper.exists(ThroughputInputAutoPilotV3Component)).toEqual(true);
+    expect(wrapper.exists("#throughputApplyLongDelayMessage")).toEqual(true);
+    expect(wrapper.exists("#throughputApplyShortDelayMessage")).toEqual(false);
+    expect(wrapper.find("#throughputApplyLongDelayMessage").html()).toContain(targetThroughput);
+
+    const newCollection = { ...collection };
+    const maxThroughput = 5000;
+    newCollection.offer = ko.observable({
+      manualThroughput: undefined,
+      autoscaleMaxThroughput: maxThroughput,
+      minimumThroughput: 400,
+      id: "offer",
+      offerReplacePending: true,
+    });
+    const newProps = {
+      ...baseProps,
+      initialNotification: undefined as DataModels.Notification,
+      collection: newCollection,
+    };
+    wrapper = shallow(<ScaleComponent {...newProps} />);
+    expect(wrapper.exists("#throughputApplyShortDelayMessage")).toEqual(true);
+    expect(wrapper.exists("#throughputApplyLongDelayMessage")).toEqual(false);
+    expect(wrapper.find("#throughputApplyShortDelayMessage").html()).toContain(maxThroughput);
+  });
+
  it("autoScale disabled", () => {
    const scaleComponent = new ScaleComponent(baseProps);
    expect(scaleComponent.isAutoScaleEnabled()).toEqual(false);
--- a/src/Explorer/Controls/Settings/SettingsSubComponents/ScaleComponent.tsx
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/ScaleComponent.tsx
@@ -10,6 +10,7 @@ import * as AutoPilotUtils from "../../../../Utils/AutoPilotUtils";
 import { isRunningOnNationalCloud } from "../../../../Utils/CloudUtils";
 import {
  getTextFieldStyles,
+  getThroughputApplyLongDelayMessage,
  getThroughputApplyShortDelayMessage,
  subComponentStackProps,
  throughputUnit,
@@ -33,6 +34,7 @@ export interface ScaleComponentProps {
  onMaxAutoPilotThroughputChange: (newThroughput: number) => void;
  onScaleSaveableChange: (isScaleSaveable: boolean) => void;
  onScaleDiscardableChange: (isScaleDiscardable: boolean) => void;
+  initialNotification: DataModels.Notification;
  throughputError?: string;
 }

@@ -100,6 +102,10 @@ export class ScaleComponent extends React.Component<ScaleComponentProps> {
  };

  public getInitialNotificationElement = (): JSX.Element => {
+    if (this.props.initialNotification) {
+      return this.getLongDelayMessage();
+    }
+
    if (this.offer?.offerReplacePending) {
      const throughput = this.offer.manualThroughput || this.offer.autoscaleMaxThroughput;
      return getThroughputApplyShortDelayMessage(
@@ -114,6 +120,26 @@ export class ScaleComponent extends React.Component<ScaleComponentProps> {
    return undefined;
  };

+  public getLongDelayMessage = (): JSX.Element => {
+    const matches: string[] = this.props.initialNotification?.description.match(
+      `Throughput update for (.*) ${throughputUnit}`,
+    );
+
+    const throughput = this.props.throughputBaseline;
+    const targetThroughput: number = matches.length > 1 && Number(matches[1]);
+    if (targetThroughput) {
+      return getThroughputApplyLongDelayMessage(
+        this.props.wasAutopilotOriginallySet,
+        throughput,
+        throughputUnit,
+        this.databaseId,
+        this.collectionId,
+        targetThroughput,
+      );
+    }
+    return <></>;
+  };
+
  private getThroughputInputComponent = (): JSX.Element => (
    <ThroughputInputAutoPilotV3Component
      databaseAccount={userContext?.databaseAccount}
--- a/src/Explorer/Controls/Settings/SettingsSubComponents/ThroughputInputComponents/snapshots/ThroughputInputAutoPilotV3Component.test.tsx.snap
+++ b/src/Explorer/Controls/Settings/SettingsSubComponents/ThroughputInputComponents/snapshots/ThroughputInputAutoPilotV3Component.test.tsx.snap
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Craig Boger (from Dev Box)	23d088f45b	Merge branch 'users/bogercraig/de_read_region_selection' of https://github.com/Azure/cosmos-explorer into users/bogercraig/de_read_region_selection	2024-03-28 15:37:45 -07:00
Craig Boger (from Dev Box)	56f50e1320	Updated to have a write client and multiple read clients. Added enum to help with selection of client based on needed operation. Need to modify endpoint selection in CosmosClient to select endpoints based on client called.	2024-03-28 15:35:13 -07:00
Craig Boger (from Dev Box)	4c61cfef58	Actually working client regeneration. Garbage collection still not cleaning up old clients.	2024-03-28 15:35:13 -07:00
Craig Boger (from Dev Box)	07dacfa04f	Revert "Setup so that client regenerates when another endpoint is selected." This reverts commit `bbe4a755a0`.	2024-03-28 15:35:12 -07:00
Craig Boger (from Dev Box)	638d9c1fae	Reverting back to a single client for memory testing.	2024-03-28 15:35:12 -07:00
Craig Boger (from Dev Box)	5d3454d973	Rough implementation of a client map. Need to figure out how to keep read client config in sync when other connection policy settings change. If number of retry change, etc.	2024-03-28 15:35:12 -07:00
Craig Boger (from Dev Box)	18f1b416b2	Setup so that client regenerates when another endpoint is selected. Also ran tests on queries in multiple tabs. Looks like the operations complete. Need to confirm old client is garbage collected.	2024-03-28 15:35:12 -07:00
Craig Boger (from Dev Box)	8d352e6e7d	Quick demo of using another client for some read operations. Other read operations still cause error when primary region is blocked. HPM proxying for local dev still looks to work ok. Still need to add ability to swap out endpoints in the regional endpoint.	2024-03-28 15:35:12 -07:00
Craig Boger (from Dev Box)	47201603c3	Added rough button to command bar to allow switching of client endpoint.	2024-03-28 15:35:12 -07:00
Craig Boger (from Dev Box)	60a76a69f6	Initial attempt at updating the user context with a regional endpoint. Successful.	2024-03-28 15:35:12 -07:00
Craig Boger (from Dev Box)	c5fcca2dc1	Added comments.	2024-03-28 15:35:12 -07:00
Craig Boger (from Dev Box)	d441ed94da	Updating .gitignore for vscode settings.	2024-03-28 15:35:12 -07:00
Craig Boger (from Dev Box)	bda08b286a	Updated to have a write client and multiple read clients. Added enum to help with selection of client based on needed operation. Need to modify endpoint selection in CosmosClient to select endpoints based on client called.	2024-02-20 16:31:42 -08:00
Craig Boger (from Dev Box)	029382b1bd	Actually working client regeneration. Garbage collection still not cleaning up old clients.	2024-02-16 18:18:20 -08:00
Craig Boger (from Dev Box)	fd8670ee9b	Revert "Setup so that client regenerates when another endpoint is selected." This reverts commit `bbe4a755a0`.	2024-02-16 17:46:02 -08:00
Craig Boger (from Dev Box)	b45e667d51	Reverting back to a single client for memory testing.	2024-02-16 15:05:26 -08:00
Craig Boger (from Dev Box)	f14c786b21	Rough implementation of a client map. Need to figure out how to keep read client config in sync when other connection policy settings change. If number of retry change, etc.	2024-02-16 14:19:36 -08:00
Craig Boger (from Dev Box)	bbe4a755a0	Setup so that client regenerates when another endpoint is selected. Also ran tests on queries in multiple tabs. Looks like the operations complete. Need to confirm old client is garbage collected.	2024-02-16 14:19:36 -08:00
Craig Boger (from Dev Box)	08a4250986	Quick demo of using another client for some read operations. Other read operations still cause error when primary region is blocked. HPM proxying for local dev still looks to work ok. Still need to add ability to swap out endpoints in the regional endpoint.	2024-02-16 14:19:36 -08:00
Craig Boger (from Dev Box)	2b4a4d0d61	Added rough button to command bar to allow switching of client endpoint.	2024-02-16 14:19:36 -08:00
Craig Boger (from Dev Box)	0b37369812	Initial attempt at updating the user context with a regional endpoint. Successful.	2024-02-16 14:19:35 -08:00
Craig Boger (from Dev Box)	f270553218	Added comments.	2024-02-16 14:19:35 -08:00
Craig Boger (from Dev Box)	9bb3e2bc70	Updating .gitignore for vscode settings.	2024-02-16 14:19:35 -08:00