fix: clean up renderer errors

[mabaasit]

Description

When running Compass, there's lot of errors from react/emotion. I fed all of that to Claude and it came up with these fixes.

1. Commit 1 fixes Warning: Each child in a list should have a unique "key" prop.
2. Commit 2 fixes Warning: React does not recognize the 'tabId' prop on a DOM element.
3. Commit 3 fixes There was a problem inserting the following rule: ".leafygreen-ui-b4u0dq::-moz-range-thumb{width:0;height:0;}" SyntaxError: Failed to execute 'insertRule' on 'CSSStyleSheet'
4. Commit 4 fixes Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
5. Commit 5 fixes Not attaching event collection; key already exists console.<computed>

Checklist

• New tests and/or benchmarks are included
• Documentation is changed or added
• If this change updates the UI, screenshots/videos are added and a design review is requested
• If this change could impact the load on the MongoDB cluster, please describe the expected and worst case impact
• I have signed the MongoDB Contributor License Agreement (https://www.mongodb.com/legal/contributor-agreement)

Motivation and Context

• Bugfix
• New feature
• Dependency update
• Misc

Open Questions

Dependents

Types of changes

• Backport Needed
• Patch (non-breaking change which fixes an issue)
• Minor (non-breaking change which adds functionality)
• Major (fix or feature that would cause existing functionality to change)

[codeowners-service-app]

Assigned dudaschar for team compass-developers because nbbeeken is out of office.

[Copilot]

Pull request overview

This PR targets cleanup of renderer-side React/Emotion warnings in Compass by preventing invalid prop leakage to DOM nodes, ensuring stable React keys, and avoiding state updates after unmount.

Changes:

• Prevent React state updates on unmounted components in the collections/databases tables by disabling react-table’s automatic page-index reset.
• Remove invalid/non-DOM props from tab title rendering and ensure tab drawer rendering uses stable keys to eliminate React warnings.
• Guard the Firefox-only range-thumb CSS rule to avoid Emotion insertRule failures in non-Firefox engines.

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
packages/databases-collections-list/src/items-table.tsx	Disables autoResetPageIndex to avoid post-unmount state updates from table internals.
packages/compass-crud/src/stores/crud-store.ts	Renames internal collection field to collectionModel and updates usage site.
packages/compass-components/src/components/resize-handle.tsx	Wraps Firefox-specific slider thumb styling in a feature query to reduce insertRule errors.
packages/compass-collection/src/plugin-tab-title.tsx	Prevents tabId/subTab (and dispatch) from being forwarded via prop spreads to the tab element.
packages/compass-collection/src/components/collection-tab.tsx	Adds stable keys when rendering tab drawers to eliminate React list key warnings.

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

[gribnoysup]

Why do we allow to pass them to the component if they are not valid dom attributes and not used by anything else?

[mabaasit]

workspace-tab-context-provider.tsx#L115 is where we wrap this component and pass these props to this component. I am not sure why we are doing that though.