SAP / ui5-webcomponents-react

A wrapper implementation for React of the UI5 Web Components that are compliant with the SAP Fiori User Experience
https://sap.github.io/ui5-webcomponents-react/
Apache License 2.0
449 stars 101 forks source link

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

Open skowrons opened 6 days ago

skowrons commented 6 days ago

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

Bildschirmfoto 2024-11-20 um 15 42 28

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

skowrons commented 23 hours ago

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>