Bug: Sidebar Dropdown Does Not Collapse on Second Click in React Documentation

[SahilPatel2003]

In the official React documentation, when I click on the dropdown button (▾) for a topic in the sidebar, it expands as expected. However, clicking on the same dropdown again does not collapse the section.

It only collapses when I click on another topic’s dropdown, which is inconsistent behavior and confusing from a UX perspective.

React version: 19.1

Steps To Reproduce

1. Go to the React documentation.

2. Click on any dropdown (e.g., "Learn React" or "API Reference") in the left sidebar to expand it.

3. Click again on the same dropdown.

4. Observe that the dropdown does not collapse.

5. Click on a different dropdown.

6. Observe that the previous one collapses.

Link to code example: https://react.dev/reference/react/hooks

The current behavior

Clicking on the same dropdown icon does not collapse the section.

The only way to collapse a section is to open a different section.

The expected behavior

Clicking on the same dropdown icon should toggle (expand/collapse) the section.

This behavior is expected and more intuitive for users.

[Sanyam2511]

Hi! I was able to reproduce this issue in React 19.1. I'd love to work on fixing it. Could you assign this to me?

[AfnanFerdousi]

Hey! If no one is working on this, could you assign this to me? I am pretty sure I can fix this one

[Pankaj-70]

Hii, sharp insight. Allow me to resolve this issue just by altering state of a variable using react hook useState. Could you please authorize my access to the repository?

[amankumarnayak]

Hi @SahilPatel2003,
Sharp observation! I’d love to contribute and resolve this issue.