[COMPASS-5212] database-collections-plugin should handle asyncronous (lazy) data loading Created: 20/Oct/21  Updated: 29/Oct/23  Resolved: 22/Dec/21

Status: Closed
Project: Compass
Component/s: Table View
Affects Version/s: None
Fix Version/s: 1.30.1

Type: Task Priority: Major - P3
Reporter: Sergey Petushkov Assignee: Sergey Petushkov
Resolution: Fixed Votes: 0
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Issue Links:
Depends
depends on COMPASS-5210 Refactor mongodb-instance-model to al... Closed
Epic Link: COMPASS-4764
Story Points: 5
Documentation Changes: Not Needed
Sprint: Iteration Orlando, Iteration Phnom Penh, Iteration Q, Iteration Reno

 Description   

Refactor databases-collections to render before full db/coll info is availbale (only names should be enough to render db/coll list)

  • dbStats should be fetched only when database is selected
  • collStats should be fetched only when collection is selected
  • Add a loading indicator to the view for db/coll list still fetching
  • Add a placeholders for stats info still loading

Miro board with changes context



 Comments   
Comment by Githook User [ 29/Dec/21 ]

Author:

{'name': 'Sergey', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: feat(databases-collections): Add async loading states for databases and collections list COMPASS-5212 (#2632)

  • chore(data-service): Expose more stats for dbs and colls
  • chore(collection-model): Expose collection properties on the model
  • chore(compass): Allow to override compass min width / height with env
  • chore(compass): Refactor placeholder and main app container styles to avoid placeholder poopping up behind app content
  • chore(collection-model): Add dash to read-only property
  • chore(compass-components): Ease render fns return type
  • chore(compass-components): Move placeholder to shared components; Add light mode styles and animation
  • chore(compass-components): Add hook to get dom rect from resize observer
  • chore(compass-components): Expose focus state as a ref for places where gettting the current value without triggering a deps update (like event callbacks) is appropriate
  • chore(databases-navigation-tree): Rename hook to better describe purpose
  • chore(compass-components): More exports
  • chore(database-model): Add new stats value to props definition
  • chore(databases-collections): Refactor open/drop collections event to always expect parsed namespace
  • chore(databases-collections-list): Create new package for databases and collection list / grid view screen
  • chore(compass-components): Fix ts types export
  • chore(databases-collections): Replace databases collections table with the new list components; Clean up unused code
  • chore(app-stores): Fetch collection meta and open new namespace when collection is selected from the list
  • chore: Update package-lock
  • chore: Fix checks and tests; Add tests for virtual grid
  • chore(compass-e2e-tests): Add testids and replace the old ones in the e2e tests
  • chore(model): Simplify serialization and make collections iterable
  • chore(sidebar): Reduce amount of cloned state in the store; Use databases store state for counts
  • chore: Fix tests and checks
  • chore(sidebar): Subscribe to connectionsStatus instead of connectionsLength
  • chore(hadron-react-components): Remove unused sortable table component
  • chore(databases-collections): Remove all unrelevant tests from collection spec
  • chore: Misc fixes
  • chore(hadron-react-components): Remove unused dependencies
  • chore(app-stores, databases-collections): Update namespace on collection created event
  • chore: Add tracking and make list default view type
  • fix(databases-collections-list): Fix types
  • chore(compass-components): Wrap leafygreen tooltip with our own implementation that handles show delay better
  • chore(compass-components): Fix inline definition types
  • chore(compass-components): Remove unused dependency
  • chore(databses-collections-list): Stricter types for status
  • chore: Remove global overlay from the application COMPASS-5132 (#2640)
  • chore(databases-collections, compass-sidebar): Remove global overlay logic from sidebar and databases-collections plugins; Add placeholder for sidebar navigation fetching; Remove overlay code
  • chore(databases-collections): handle databases and collections fetching status inside the corresponding plugins
  • fix(mocha-config-compass): Disable source map processing when running code in electron / web runtime in tests
  • chore(compass-instance): Handle instance fetching errors inside the instance workspace plugin
  • chore(compass-database, compass-collection): Register plugins as components instead of roles
  • chore(compass-home): Decouple compass-home from handling instance fetching state
  • chore: Remove last references to status plugin and package-lock update
  • fix(compass-components): Fix Placeholder types
Comment by Githook User [ 23/Dec/21 ]

Author:

{'name': 'Sergey', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: feat(databases-collections): Add async loading states for databases and collections list COMPASS-5212 (#2632)

  • chore(data-service): Expose more stats for dbs and colls
  • chore(collection-model): Expose collection properties on the model
  • chore(compass): Allow to override compass min width / height with env
  • chore(compass): Refactor placeholder and main app container styles to avoid placeholder poopping up behind app content
  • chore(collection-model): Add dash to read-only property
  • chore(compass-components): Ease render fns return type
  • chore(compass-components): Move placeholder to shared components; Add light mode styles and animation
  • chore(compass-components): Add hook to get dom rect from resize observer
  • chore(compass-components): Expose focus state as a ref for places where gettting the current value without triggering a deps update (like event callbacks) is appropriate
  • chore(databases-navigation-tree): Rename hook to better describe purpose
  • chore(compass-components): More exports
  • chore(database-model): Add new stats value to props definition
  • chore(databases-collections): Refactor open/drop collections event to always expect parsed namespace
  • chore(databases-collections-list): Create new package for databases and collection list / grid view screen
  • chore(compass-components): Fix ts types export
  • chore(databases-collections): Replace databases collections table with the new list components; Clean up unused code
  • chore(app-stores): Fetch collection meta and open new namespace when collection is selected from the list
  • chore: Update package-lock
  • chore: Fix checks and tests; Add tests for virtual grid
  • chore(compass-e2e-tests): Add testids and replace the old ones in the e2e tests
  • chore(model): Simplify serialization and make collections iterable
  • chore(sidebar): Reduce amount of cloned state in the store; Use databases store state for counts
  • chore: Fix tests and checks
  • chore(sidebar): Subscribe to connectionsStatus instead of connectionsLength
  • chore(hadron-react-components): Remove unused sortable table component
  • chore(databases-collections): Remove all unrelevant tests from collection spec
  • chore: Misc fixes
  • chore(hadron-react-components): Remove unused dependencies
  • chore(app-stores, databases-collections): Update namespace on collection created event
  • chore: Add tracking and make list default view type
  • fix(databases-collections-list): Fix types
  • chore(compass-components): Wrap leafygreen tooltip with our own implementation that handles show delay better
  • chore(compass-components): Fix inline definition types
  • chore(compass-components): Remove unused dependency
  • chore(databses-collections-list): Stricter types for status
  • chore: Remove global overlay from the application COMPASS-5132 (#2640)
  • chore(databases-collections, compass-sidebar): Remove global overlay logic from sidebar and databases-collections plugins; Add placeholder for sidebar navigation fetching; Remove overlay code
  • chore(databases-collections): handle databases and collections fetching status inside the corresponding plugins
  • fix(mocha-config-compass): Disable source map processing when running code in electron / web runtime in tests
  • chore(compass-instance): Handle instance fetching errors inside the instance workspace plugin
  • chore(compass-database, compass-collection): Register plugins as components instead of roles
  • chore(compass-home): Decouple compass-home from handling instance fetching state
  • chore: Remove last references to status plugin and package-lock update
  • fix(compass-components): Fix Placeholder types
Comment by Githook User [ 23/Dec/21 ]

Author:

{'name': 'Sergey', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: feat(databases-collections): Add async loading states for databases and collections list COMPASS-5212 (#2632)

  • chore(data-service): Expose more stats for dbs and colls
  • chore(collection-model): Expose collection properties on the model
  • chore(compass): Allow to override compass min width / height with env
  • chore(compass): Refactor placeholder and main app container styles to avoid placeholder poopping up behind app content
  • chore(collection-model): Add dash to read-only property
  • chore(compass-components): Ease render fns return type
  • chore(compass-components): Move placeholder to shared components; Add light mode styles and animation
  • chore(compass-components): Add hook to get dom rect from resize observer
  • chore(compass-components): Expose focus state as a ref for places where gettting the current value without triggering a deps update (like event callbacks) is appropriate
  • chore(databases-navigation-tree): Rename hook to better describe purpose
  • chore(compass-components): More exports
  • chore(database-model): Add new stats value to props definition
  • chore(databases-collections): Refactor open/drop collections event to always expect parsed namespace
  • chore(databases-collections-list): Create new package for databases and collection list / grid view screen
  • chore(compass-components): Fix ts types export
  • chore(databases-collections): Replace databases collections table with the new list components; Clean up unused code
  • chore(app-stores): Fetch collection meta and open new namespace when collection is selected from the list
  • chore: Update package-lock
  • chore: Fix checks and tests; Add tests for virtual grid
  • chore(compass-e2e-tests): Add testids and replace the old ones in the e2e tests
  • chore(model): Simplify serialization and make collections iterable
  • chore(sidebar): Reduce amount of cloned state in the store; Use databases store state for counts
  • chore: Fix tests and checks
  • chore(sidebar): Subscribe to connectionsStatus instead of connectionsLength
  • chore(hadron-react-components): Remove unused sortable table component
  • chore(databases-collections): Remove all unrelevant tests from collection spec
  • chore: Misc fixes
  • chore(hadron-react-components): Remove unused dependencies
  • chore(app-stores, databases-collections): Update namespace on collection created event
  • chore: Add tracking and make list default view type
  • fix(databases-collections-list): Fix types
  • chore(compass-components): Wrap leafygreen tooltip with our own implementation that handles show delay better
  • chore(compass-components): Fix inline definition types
  • chore(compass-components): Remove unused dependency
  • chore(databses-collections-list): Stricter types for status
  • chore: Remove global overlay from the application COMPASS-5132 (#2640)
  • chore(databases-collections, compass-sidebar): Remove global overlay logic from sidebar and databases-collections plugins; Add placeholder for sidebar navigation fetching; Remove overlay code
  • chore(databases-collections): handle databases and collections fetching status inside the corresponding plugins
  • fix(mocha-config-compass): Disable source map processing when running code in electron / web runtime in tests
  • chore(compass-instance): Handle instance fetching errors inside the instance workspace plugin
  • chore(compass-database, compass-collection): Register plugins as components instead of roles
  • chore(compass-home): Decouple compass-home from handling instance fetching state
  • chore: Remove last references to status plugin and package-lock update
  • fix(compass-components): Fix Placeholder types
Comment by Githook User [ 22/Dec/21 ]

Author:

{'name': 'Sergey', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: feat(databases-collections): Add async loading states for databases and collections list COMPASS-5212 (#2632)

  • chore(data-service): Expose more stats for dbs and colls
  • chore(collection-model): Expose collection properties on the model
  • chore(compass): Allow to override compass min width / height with env
  • chore(compass): Refactor placeholder and main app container styles to avoid placeholder poopping up behind app content
  • chore(collection-model): Add dash to read-only property
  • chore(compass-components): Ease render fns return type
  • chore(compass-components): Move placeholder to shared components; Add light mode styles and animation
  • chore(compass-components): Add hook to get dom rect from resize observer
  • chore(compass-components): Expose focus state as a ref for places where gettting the current value without triggering a deps update (like event callbacks) is appropriate
  • chore(databases-navigation-tree): Rename hook to better describe purpose
  • chore(compass-components): More exports
  • chore(database-model): Add new stats value to props definition
  • chore(databases-collections): Refactor open/drop collections event to always expect parsed namespace
  • chore(databases-collections-list): Create new package for databases and collection list / grid view screen
  • chore(compass-components): Fix ts types export
  • chore(databases-collections): Replace databases collections table with the new list components; Clean up unused code
  • chore(app-stores): Fetch collection meta and open new namespace when collection is selected from the list
  • chore: Update package-lock
  • chore: Fix checks and tests; Add tests for virtual grid
  • chore(compass-e2e-tests): Add testids and replace the old ones in the e2e tests
  • chore(model): Simplify serialization and make collections iterable
  • chore(sidebar): Reduce amount of cloned state in the store; Use databases store state for counts
  • chore: Fix tests and checks
  • chore(sidebar): Subscribe to connectionsStatus instead of connectionsLength
  • chore(hadron-react-components): Remove unused sortable table component
  • chore(databases-collections): Remove all unrelevant tests from collection spec
  • chore: Misc fixes
  • chore(hadron-react-components): Remove unused dependencies
  • chore(app-stores, databases-collections): Update namespace on collection created event
  • chore: Add tracking and make list default view type
  • fix(databases-collections-list): Fix types
  • chore(compass-components): Wrap leafygreen tooltip with our own implementation that handles show delay better
  • chore(compass-components): Fix inline definition types
  • chore(compass-components): Remove unused dependency
  • chore(databses-collections-list): Stricter types for status
  • chore: Remove global overlay from the application COMPASS-5132 (#2640)
  • chore(databases-collections, compass-sidebar): Remove global overlay logic from sidebar and databases-collections plugins; Add placeholder for sidebar navigation fetching; Remove overlay code
  • chore(databases-collections): handle databases and collections fetching status inside the corresponding plugins
  • fix(mocha-config-compass): Disable source map processing when running code in electron / web runtime in tests
  • chore(compass-instance): Handle instance fetching errors inside the instance workspace plugin
  • chore(compass-database, compass-collection): Register plugins as components instead of roles
  • chore(compass-home): Decouple compass-home from handling instance fetching state
  • chore: Remove last references to status plugin and package-lock update
  • fix(compass-components): Fix Placeholder types
Comment by Githook User [ 21/Dec/21 ]

Author:

{'name': 'Sergey', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: feat(databases-collections): Add async loading states for databases and collections list COMPASS-5212 (#2632)

  • chore(data-service): Expose more stats for dbs and colls
  • chore(collection-model): Expose collection properties on the model
  • chore(compass): Allow to override compass min width / height with env
  • chore(compass): Refactor placeholder and main app container styles to avoid placeholder poopping up behind app content
  • chore(collection-model): Add dash to read-only property
  • chore(compass-components): Ease render fns return type
  • chore(compass-components): Move placeholder to shared components; Add light mode styles and animation
  • chore(compass-components): Add hook to get dom rect from resize observer
  • chore(compass-components): Expose focus state as a ref for places where gettting the current value without triggering a deps update (like event callbacks) is appropriate
  • chore(databases-navigation-tree): Rename hook to better describe purpose
  • chore(compass-components): More exports
  • chore(database-model): Add new stats value to props definition
  • chore(databases-collections): Refactor open/drop collections event to always expect parsed namespace
  • chore(databases-collections-list): Create new package for databases and collection list / grid view screen
  • chore(compass-components): Fix ts types export
  • chore(databases-collections): Replace databases collections table with the new list components; Clean up unused code
  • chore(app-stores): Fetch collection meta and open new namespace when collection is selected from the list
  • chore: Update package-lock
  • chore: Fix checks and tests; Add tests for virtual grid
  • chore(compass-e2e-tests): Add testids and replace the old ones in the e2e tests
  • chore(model): Simplify serialization and make collections iterable
  • chore(sidebar): Reduce amount of cloned state in the store; Use databases store state for counts
  • chore: Fix tests and checks
  • chore(sidebar): Subscribe to connectionsStatus instead of connectionsLength
  • chore(hadron-react-components): Remove unused sortable table component
  • chore(databases-collections): Remove all unrelevant tests from collection spec
  • chore: Misc fixes
  • chore(hadron-react-components): Remove unused dependencies
  • chore(app-stores, databases-collections): Update namespace on collection created event
  • chore: Add tracking and make list default view type
  • fix(databases-collections-list): Fix types
  • chore(compass-components): Wrap leafygreen tooltip with our own implementation that handles show delay better
  • chore(compass-components): Fix inline definition types
  • chore(compass-components): Remove unused dependency
  • chore(databses-collections-list): Stricter types for status
  • chore: Remove global overlay from the application COMPASS-5132 (#2640)
  • chore(databases-collections, compass-sidebar): Remove global overlay logic from sidebar and databases-collections plugins; Add placeholder for sidebar navigation fetching; Remove overlay code
  • chore(databases-collections): handle databases and collections fetching status inside the corresponding plugins
  • fix(mocha-config-compass): Disable source map processing when running code in electron / web runtime in tests
  • chore(compass-instance): Handle instance fetching errors inside the instance workspace plugin
  • chore(compass-database, compass-collection): Register plugins as components instead of roles
  • chore(compass-home): Decouple compass-home from handling instance fetching state
  • chore: Remove last references to status plugin and package-lock update
  • fix(compass-components): Fix Placeholder types
Comment by Githook User [ 21/Dec/21 ]

Author:

{'name': 'Sergey', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: feat(databases-collections): Add async loading states for databases and collections list COMPASS-5212 (#2632)

  • chore(data-service): Expose more stats for dbs and colls
  • chore(collection-model): Expose collection properties on the model
  • chore(compass): Allow to override compass min width / height with env
  • chore(compass): Refactor placeholder and main app container styles to avoid placeholder poopping up behind app content
  • chore(collection-model): Add dash to read-only property
  • chore(compass-components): Ease render fns return type
  • chore(compass-components): Move placeholder to shared components; Add light mode styles and animation
  • chore(compass-components): Add hook to get dom rect from resize observer
  • chore(compass-components): Expose focus state as a ref for places where gettting the current value without triggering a deps update (like event callbacks) is appropriate
  • chore(databases-navigation-tree): Rename hook to better describe purpose
  • chore(compass-components): More exports
  • chore(database-model): Add new stats value to props definition
  • chore(databases-collections): Refactor open/drop collections event to always expect parsed namespace
  • chore(databases-collections-list): Create new package for databases and collection list / grid view screen
  • chore(compass-components): Fix ts types export
  • chore(databases-collections): Replace databases collections table with the new list components; Clean up unused code
  • chore(app-stores): Fetch collection meta and open new namespace when collection is selected from the list
  • chore: Update package-lock
  • chore: Fix checks and tests; Add tests for virtual grid
  • chore(compass-e2e-tests): Add testids and replace the old ones in the e2e tests
  • chore(model): Simplify serialization and make collections iterable
  • chore(sidebar): Reduce amount of cloned state in the store; Use databases store state for counts
  • chore: Fix tests and checks
  • chore(sidebar): Subscribe to connectionsStatus instead of connectionsLength
  • chore(hadron-react-components): Remove unused sortable table component
  • chore(databases-collections): Remove all unrelevant tests from collection spec
  • chore: Misc fixes
  • chore(hadron-react-components): Remove unused dependencies
  • chore(app-stores, databases-collections): Update namespace on collection created event
  • chore: Add tracking and make list default view type
  • fix(databases-collections-list): Fix types
  • chore(compass-components): Wrap leafygreen tooltip with our own implementation that handles show delay better
  • chore(compass-components): Fix inline definition types
  • chore(compass-components): Remove unused dependency
  • chore(databses-collections-list): Stricter types for status
  • chore: Remove global overlay from the application COMPASS-5132 (#2640)
  • chore(databases-collections, compass-sidebar): Remove global overlay logic from sidebar and databases-collections plugins; Add placeholder for sidebar navigation fetching; Remove overlay code
  • chore(databases-collections): handle databases and collections fetching status inside the corresponding plugins
  • fix(mocha-config-compass): Disable source map processing when running code in electron / web runtime in tests
  • chore(compass-instance): Handle instance fetching errors inside the instance workspace plugin
  • chore(compass-database, compass-collection): Register plugins as components instead of roles
  • chore(compass-home): Decouple compass-home from handling instance fetching state
  • chore: Remove last references to status plugin and package-lock update
  • fix(compass-components): Fix Placeholder types
Comment by Githook User [ 21/Dec/21 ]

Author:

{'name': 'Sergey Petushkov', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: Merge remote-tracking branch 'origin/main' into compass-5212-dbs-colls-grid-async

Conflicts:
package-lock.json
packages/compass-connect/package.json
packages/compass-crud/package.json
packages/compass-explain-plan/package.json
packages/compass-home/package.json
packages/compass-instance/package.json
packages/compass-schema/package.json
packages/compass-status/package.json
packages/compass/package.json
packages/connect-form/package.json
packages/databases-collections/package.json
Branch: compass-5212-dbs-colls-grid-async
https://github.com/mongodb-js/compass/commit/ed0f6f999fcac5a1f0c667fb7d0758046b0b5171

Comment by Githook User [ 21/Dec/21 ]

Author:

{'name': 'Sergey Petushkov', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: Merge remote-tracking branch 'origin/compass-5212-dbs-colls-grid-async' into compass-5132-remove-overlay

Conflicts:
package-lock.json
Branch: compass-5132-remove-overlay
https://github.com/mongodb-js/compass/commit/97e9f94e9da5fad0be2fe885a1c40e21c3c91976

Comment by Githook User [ 21/Dec/21 ]

Author:

{'name': 'Sergey Petushkov', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: Merge remote-tracking branch 'origin/main' into compass-5212-dbs-colls-grid-async

Conflicts:
package-lock.json
packages/compass-components/package.json
Branch: compass-5132-remove-overlay
https://github.com/mongodb-js/compass/commit/9b8ff1fd7e317755eadef0caa5cb29952adb369b

Comment by Githook User [ 20/Dec/21 ]

Author:

{'name': 'Sergey Petushkov', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: Merge remote-tracking branch 'origin/main' into compass-5212-dbs-colls-grid-async

Conflicts:
package-lock.json
packages/compass-components/package.json
Branch: compass-5212-dbs-colls-grid-async
https://github.com/mongodb-js/compass/commit/9b8ff1fd7e317755eadef0caa5cb29952adb369b

Comment by Githook User [ 14/Dec/21 ]

Author:

{'name': 'Sergey Petushkov', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: Merge remote-tracking branch 'origin/main' into compass-5212-dbs-colls-grid-async
Branch: compass-5212-dbs-colls-grid-async
https://github.com/mongodb-js/compass/commit/436835cc5bf2ff65061c9a8212590f11bd2c2284

Comment by Githook User [ 09/Dec/21 ]

Author:

{'name': 'Sergey Petushkov', 'email': 'petushkov.sergey@gmail.com', 'username': 'gribnoysup'}

Message: Merge remote-tracking branch 'origin/main' into compass-5212-dbs-colls-grid-async

Conflicts:
package-lock.json
Branch: compass-5212-dbs-colls-grid-async
https://github.com/mongodb-js/compass/commit/eb5bd8812df3525f72669f3b2eab4393edbab8d3

Generated at Wed Feb 07 22:38:49 UTC 2024 using Jira 9.7.1#970001-sha1:2222b88b221c4928ef0de3161136cc90c8356a66.