MM-69835 Replace legacy context API with modern one

[hmhealey]

Summary

The next part of updating this for React 19 is to get rid of all usage of the now-deprecated legacy context API. Instead of using contextTypes/childContextTypes/getChildContext, we now use React.createContext to make provider components along with useContext in function components and the slightly different contextType in class components.

Ticket Link

https://mattermost.atlassian.net/browse/MM-69835

[hmhealey]

@coderabbitai Review this

[coderabbitai]

@hmhealey I will review pull request #9.

✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

[coderabbitai]

📝 Walkthrough

Walkthrough

The PR replaces legacy React context declarations and child-context methods with named context objects, providers, contextType, and useContext across form, modal, navbar, panel, and tab components. Test warning suppression and legacy test context setup were also removed.

Changes

React context migration

Layer / File(s)	Summary
Form and modal context migration src/FormGroup.js, src/FormGroupContext.js, src/ControlLabel.js, src/FormControl.js, src/FormControlFeedback.js, src/Modal.js, src/ModalContext.js, src/ModalHeader.js, test/*	Form groups and modals now provide named React context values. Descendant components consume direct context values through contextType.
Navbar and navigation context migration src/Navbar.js, src/NavbarContext.js, src/NavbarBrand.js, src/NavbarCollapse.js, src/NavbarHeader.js, src/NavbarToggle.js, src/Nav.js	Navbar state now uses NavbarContext. Nav receives navbar and tab-container context through a useContext wrapper.
Panel group and panel context migration src/PanelGroup.js, src/PanelGroupContext.js, src/Panel.js, src/PanelContext.js, src/PanelBody.js, src/PanelCollapse.js, src/PanelFooter.js, src/PanelHeading.js, src/PanelTitle.js, src/PanelToggle.js	Panel groups and panels now provide explicit context values. Panel descendants consume direct panel context values.
Tab container and pane context migration src/TabContainer.js, src/TabContainerContext.js, src/TabContent.js, src/TabContentContext.js, src/TabPane.js	Tab selection, identifiers, content state, and pane rendering now use modern React context providers and consumers.

Estimated code review effort: 4 (Complex) | ~45 minutes

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 33.33% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly describes the primary change: replacing the legacy React context API with the modern context API.
Description check	✅ Passed	The description directly explains the migration from the legacy context API to React's modern context features.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch MM-69835-2

---

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/Nav.js`:
- Around line 347-360: Wrap NavWithContext with React forwardRef, update its
signature to receive the forwarded ref, and pass ref={ref} to the inner Nav
component. Preserve the existing context retrieval, props spreading, and bsClass
export behavior.

In `@src/Panel.js`:
- Around line 87-100: Update the ID-generation guard in the Panel logic around
eventKey, id, and idKey so generation runs only when an identifier is actually
present, including excluding undefined. Preserve the existing getId selection
and headingId/bodyId creation for valid identifiers, while leaving ids unset
when both props are absent.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 8581677c-27e0-4822-a61f-75edf7ca6701

📥 Commits

Reviewing files that changed from the base of the PR and between e909302 and b5d10b9.

📒 Files selected for processing (32)

• src/ControlLabel.js
• src/FormControl.js
• src/FormControlFeedback.js
• src/FormGroup.js
• src/FormGroupContext.js
• src/Modal.js
• src/ModalContext.js
• src/ModalHeader.js
• src/Nav.js
• src/Navbar.js
• src/NavbarBrand.js
• src/NavbarCollapse.js
• src/NavbarContext.js
• src/NavbarHeader.js
• src/NavbarToggle.js
• src/Panel.js
• src/PanelBody.js
• src/PanelCollapse.js
• src/PanelContext.js
• src/PanelFooter.js
• src/PanelGroup.js
• src/PanelGroupContext.js
• src/PanelHeading.js
• src/PanelTitle.js
• src/PanelToggle.js
• src/TabContainer.js
• src/TabContainerContext.js
• src/TabContent.js
• src/TabContentContext.js
• src/TabPane.js
• test/OverlayTriggerSpec.js
• test/index.js

💤 Files with no reviewable changes (2)

• test/OverlayTriggerSpec.js
• test/index.js