[ObjectPage]: Anchor bar does not adhere to fiori section/subsection guidelines

[skowrons]

Describe the bug

If an section only has one subsection there should be no subsection selection in the anchor bar.

From the guidelines:

"If a section contains only one subsection, the title of the subsection is used as the name of the section. In this case, there is no subsection submenu in the anchor bar." (https://experience.sap.com/fiori-design-web/object-page/#sections)

Isolated Example

https://stackblitz.com/edit/github-pjrpra?file=src%2FApp.tsx

Reproduction steps

1. Define ObjectPage Section
2. Add subsection
3. Subsection should not displayed in anchor bar

Expected Behaviour

There should be a way to hide the subsection title for the anchor bar or it should be done automatically.

Screenshots or Videos

UI5 Web Components for React Version

2.3.1

UI5 Web Components Version

2.3.0

Browser

Chrome

Operating System

MacOS

Additional Context

No response

Relevant log output

No response

Organization

No response

Declaration

• I’m not disclosing any internal or sensitive information.

[skowrons]

A current "workaround" would be to wrap the ObjectPageSubSection in a div:

        <ObjectPageSection hideTitleText titleText="Comments" id="comments">
          <div>
            <ObjectPageSubSection
              titleText="Comments"
              id="comments"
              hideTitleText
            >
              <StandardFeed
                collection={Collections.ProjectsTasksFeed}
                parentId={task.id}
              />
            </ObjectPageSubSection>
          </div>
        </ObjectPageSection>

[Lukas742]

Hi @skowrons

sorry for the late reply!
I’ve checked if we could implement this behavior on our end, but unfortunately found, that it would require a lot of refactoring, which we’ve decided not to go ahead with for this functionality.

For our implementation, it is recommended to use subsections only when more than one is available. If there should only be a single section rendered, the content should be passed directly as a child of the ObjectPageSection.

The linked PR will add a note about this to the children prop of the ObjectPageSection and the description of the ObjectPageSubSection.