ObjectPage" ObjectPageSection in IconTabBar Mode: current selectedSectionId is not taken into account while render #7215
Description
Describe the bug
The ObjectPage component in mode="IconTabBar" fails to select the correct tab when selectedSectionId is updated. (e.g., via routing or state changes). The tab content updates correctly, but the UI does not reflect the active tab until manual interaction or page refresh.
- Controlled change of
selectedSectionIdis not taken into account. - Despite the fact that the
selectedSectionIdhas been changed, the ObjectPage does show the selected tab.
Isolated Example
No response
Reproduction steps
- Configure an ObjectPage with
mode="IconTabBar"and multiple ObjectPageSection. - Manually store the selectedSectionId in the React state
- Change the selectedSectionId interactively (by clicking on a button, etc)
- Observe that:
- The content switches to the correct tab.
- The tab header highlight does not update.
Expected Behaviour
When selectedSectionId changes, both the content and the tab header highlight should synchronize to reflect the active section.
In other words, a controlled way of changing tab should work.
Screenshots or Videos
In this screenshot, selecting the Change Tab 3 button fails to activate Tab 3, and the highlight is stuck on the Tab 1 header.
UI5 Web Components for React Version
UI5 Web Components for React Version
UI5 Web Components Version
2.8.1
Browser
Chrome
Operating System
No response
Additional Context
No response
Relevant log output
Organization
SAP
Declaration
- I’m not disclosing any internal or sensitive information.