UI for Azure Cosmos DB. Powers the Azure Portal, https://cosmos.azure.com/, and the Cosmos DB Emulator (Mirror of https://github.com/Azure/cosmos-explorer)
Go to file
Laurent Nguyen 36736882ee
Migrate DocumentsTab to React and add bulk delete and column resize (#1770)
* Document page now loads list of docs and displays selection

* DocumentsTabV2 now properly loads documents, show partition keys and display first doc with proper selection behavior. Move it to its own folder.

* Extract table in a separate component

* Resizable columns on the document table

* Fix selection behavior and some layout issue

* Adding table scrolling

* Fix NaN height issue

* Fix NaN height issue

* Fix column sizing + cell selection

* Improvement in width size. Add Load More

* Add react editor and pass column headers

* Dynamic columns for pk

* Fix initial columns size

* Add nav buttons

* Editing content updates buttons state

* Discard and save buttons working

* Fix save new document. Implement delete.

* Remove debug display

* Fix unexpand filter and reformat

* Fix compil issues

* Add refresh button

* Update column header placeholder style

* Implement delete multiple docs

* Fix multi delete

* Fix show/hide delete button

* Fix selection behavior

* Fix UX with buttons behavior and editor display

* Fix UX issue with not discarding edit changes

* Add some TODO's

* Remove debugging info and reformat

* Add mongo support

* Fix build issues

* Fix table header. Remove debug statement

* Restore broken nosql

* Fix mongo save new document/update document

* Fix bugs with clicking on newly created documents

* Fix comment

* Fix double fetch issue when clicking on an item

* Auto-select last document when saving new document

* Fix resourceTokenPartitionKey code

* Fix format

* Fix isQueryCopilotSampleContainer flag

* Fix unused code

* Call tab when updating error flag

* Destructure props to make useEffect dependencies work

* Fix loadStartKey

* minor update

* Fix format

* Add title to table

* Fix table coming off its container with unwanted horizontal scrollbar

* Increase table width. Fix eslint issue.

* Move refresh documents button from table back to DocumentsTabV2

* Fix load more text centering

* Don't show Load More if nothing to show

* Fix columns min width

* Add keyboard shortcuts

* Add keyboard handlers to load more and refresh button

* Add keyboard support to select table row

* Disable eslint issue from fluent library

* Connect cancel query button

* Add Fluent V9 theme for Fabric (#1821)

* Clean up dependencies and memoize internal functions and object. Move methods and object that don't depend on state outside of component.

* Fix filter disappearing when clicking Apply Filter

* Fix typo and format

* Implement bulk delete for nosql

* Replace filter ui components with fluent ui

* Remove jquery calls

* Migrate unit test to DocumentsTabV2

* Remove DocumentsTab and MongoDocumentsTab. Fix build issues.

* Properly handle activetab

* Remove comments and unused code

* Port keyboard shortcuts from commitId 1f4d0f2

* Port item editor shortcuts to improved Items tab branch (#1831)

* set filter focus on Ctrl+Shift+F

* implement filter enter/esc keybinds

* remove debugging

* Collapse filter when query is executed

* Fix monaco editor not happy when parent is null

* Fix how bulk delete operation gets called when no partition key

* Fix update id list after delete

* Fix deleteDocuments

* Fix build issue

* Fix bug in mongo delete

* Fix mongo delete flow

* Proper error handling in mongo

* Handle >100 bulk delete operations

* Add unit tests for DocumentsTableComponent

* More improvements to table unit tests

* Fix import. Disable selection test for now

* Add more DocumentsTab unit react tests

* Remove selection test

* Add more unit tests. Add lcov coverage report to display in vscode

* Move unit tests to correct file

* Add unit test on command bar

* Fix build issues

* Add more unit tests

* Remove unneeded call

* Add DocumentsTab for Mongo API

* Fix linting errors

* Update fluent ui v9 dependency. Color columns separation. Fix refresh button placement to not interfere with header cell width.

* Revert @fluentui/react-components to a safe version that compiles

* Add confirmation window when documents have been deleted

* Fix mongo unit tests

* Fix format

* Update src/Common/dataAccess/deleteDocument.ts

Co-authored-by: Ashley Stanton-Nurse <ashleyst@microsoft.com>

* Update src/Common/dataAccess/deleteDocument.ts

Co-authored-by: Ashley Stanton-Nurse <ashleyst@microsoft.com>

* Update src/Common/dataAccess/deleteDocument.ts

Co-authored-by: Ashley Stanton-Nurse <ashleyst@microsoft.com>

* Fix bug with markup. Simplify code.

* Protect against creating React editor without parent node

* Replace rendering tests with snapshot match

* Add test screenshot to troubleshoot e2e test

* Revert "Add test screenshot to troubleshoot e2e test"

This reverts commit 1b8138ade0.

* Attempt 2 at troubleshooting failing test

* Revert "Attempt 2 at troubleshooting failing test"

This reverts commit 3e51a593bf.

* Delete button now shows if one or more rows are selected

---------

Co-authored-by: Vsevolod Kukol <sevoku@microsoft.com>
Co-authored-by: Ashley Stanton-Nurse <ashleyst@microsoft.com>
2024-05-29 09:09:13 +02:00
.github Replace Entra app client secret auth with OpenID Connect in E2E tests. (#1792) 2024-04-09 10:55:08 -07:00
.vs Cost Estimate Changes (#342) 2020-12-18 16:15:55 -08:00
.vscode Improve error handling when acquiring aad tokens (#1746) 2024-03-04 16:08:13 -08:00
__mocks__ Clean up unused utility functions for creating databases and collections (#181) 2020-09-03 13:05:22 -07:00
canvas Remove dependency on canvas (#354) 2020-12-26 21:56:37 -06:00
configs add feedback policies integration with copilot (#1745) 2024-03-06 10:33:21 -06:00
docs Text changes for API rebranding (#1330) 2022-10-05 17:35:03 -07:00
externals Add CellOutputViewer for SandboxOutputs (#686) 2021-04-22 13:37:12 -04:00
fonts/segoe-ui/west-european/normal Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
images Enabled the ability to close the home tab (#1765) 2024-03-13 16:32:59 -04:00
less Migrate DocumentsTab to React and add bulk delete and column resize (#1770) 2024-05-29 09:09:13 +02:00
patches Migrate DocumentsTab to React and add bulk delete and column resize (#1770) 2024-05-29 09:09:13 +02:00
preview Update subscription for preview PRs (#1265) 2022-05-04 20:11:13 -07:00
quickstart Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
sampleData integrate copilot UI with backend (#1478) 2023-06-16 00:25:23 -07:00
src Migrate DocumentsTab to React and add bulk delete and column resize (#1770) 2024-05-29 09:09:13 +02:00
strict-null-checks Switch to accessibility insights's version of these tools (#603) 2021-04-12 15:12:19 -05:00
test Set backend endpoints in testExplorer to use MPAC. (#1797) 2024-04-11 15:43:46 -07:00
utils Replace Entra app client secret auth with OpenID Connect in E2E tests. (#1792) 2024-04-09 10:55:08 -07:00
.env.example Migrate resource tree to react (#941) 2021-07-20 11:40:04 -07:00
.eslintignore Migrate DocumentsTab to React and add bulk delete and column resize (#1770) 2024-05-29 09:09:13 +02:00
.eslintrc.js Make Data Explorer work on node v18 (#1654) 2023-12-13 10:24:40 -08:00
.gitignore Fix E2E tests. Add Playwright (#698) 2021-04-19 22:08:25 -05:00
.npmrc Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
CODING_GUIDELINES.md Remove IE11 from Coding Guidelines 2021-05-07 10:04:47 -05:00
CONTRIBUTING.md Update Coding Guidelines (#441) 2021-02-18 13:18:50 -06:00
DataExplorer.nuspec Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
LICENSE Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
README.md Update README.md 2021-03-27 11:18:59 -07:00
ReleaseNotes.md Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
SECURITY.md Microsoft mandatory file (#1276) 2023-06-08 18:32:42 -07:00
azure-pipelines.cg.yml Update azure-pipelines.cg.yml for Azure Pipelines 2020-10-15 16:20:38 -05:00
babel.config.js Prettier 2.0 (#393) 2021-01-20 09:15:01 -06:00
copyToConsumers.js Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
jest-playwright.config.js Retry flaky tests 2021-04-21 11:01:16 -05:00
jest.config.js Migrate DocumentsTab to React and add bulk delete and column resize (#1770) 2024-05-29 09:09:13 +02:00
jest.config.playwright.js Fix E2E tests. Add Playwright (#698) 2021-04-19 22:08:25 -05:00
mockModule.js Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
package-lock.json Migrate DocumentsTab to React and add bulk delete and column resize (#1770) 2024-05-29 09:09:13 +02:00
package.json Migrate DocumentsTab to React and add bulk delete and column resize (#1770) 2024-05-29 09:09:13 +02:00
svgTransform.js [Query Copilot v2] Implementing output bubble (#1587) 2023-08-29 08:56:53 +02:00
tsconfig.contracts.json Created selfServe landing page (#444) 2021-03-10 13:55:05 -08:00
tsconfig.json Update throughput settings tab with new elasticity properties (#1461) 2023-06-16 15:54:29 -07:00
tsconfig.strict.json Add Mongo Proxy to Data Explorer (Standalone and Portal) (#1738) 2024-02-09 10:58:10 -05:00
tsconfig.test.json eslint switch/case exhaustiveness check rule (#739) 2021-05-04 09:12:54 -07:00
web.config Legacy Mongo Shell Mongo Proxy support (#1802) 2024-04-17 19:01:12 -04:00
webpack.config.js Make Data Explorer work on node v18 (#1654) 2023-12-13 10:24:40 -08:00

README.md

Cosmos DB Explorer

UI for Azure Cosmos DB. Powers the Azure Portal, https://cosmos.azure.com/, and the Cosmos DB Emulator

Getting Started

  • npm install
  • npm run build

Developing

Watch mode

Run npm start to start the development server and automatically rebuild on changes

Hosted Development (https://cosmos.azure.com)

  • Visit: https://localhost:1234/hostedExplorer.html
  • The default webpack dev server configuration will proxy requests to the production portal backend: https://main.documentdb.ext.azure.com. This will allow you to use production connection strings on your local machine.

Emulator Development

Setting up a Remote Emulator

The Cosmos emulator currently only runs in Windows environments. You can still develop on a non-Windows machine by setting up an emulator on a windows box and exposing its ports publicly:

  1. Expose these ports publicly: 8081, 8900, 8979, 10250, 10251, 10252, 10253, 10254, 10255, 10256

  2. Download and install the emulator: https://docs.microsoft.com/en-us/azure/cosmos-db/local-emulator

  3. Start the emulator from PowerShell:

> cd C:/

> .\CosmosDB.Emulator.exe -AllowNetworkAccess -Key="<EMULATOR MASTER KEY>"

Portal Development

Testing

Unit Tests

Unit tests are located adjacent to the code under test and run with Jest:

npm run test

End to End CI Tests

Jest and Puppeteer are used for end to end browser based tests and are contained in test/. To run these tests locally:

  1. Copy .env.example to .env
  2. Update the values in .env including your local data explorer endpoint (ask a teammate/codeowner for help with .env values)
  3. Make sure all packages are installed npm install
  4. Run the server npm run start and wait for it to start
  5. Run npm run test:e2e

Releasing

We generally adhere to the release strategy documented by the Azure SDK Guidelines. Most releases should happen from the master branch. If master contains commits that cannot be released, you may create a release from a release/ or hotfix/ branch. See linked documentation for more details.

Architecture

Contributing

Please read the contribution guidelines.