Skip to content

Support action items on mobile More page navigation #26430

@abhayymishraa

Description

@abhayymishraa

Is your proposal related to a problem?

There is no button on mobile page to go to the refer page .

Mobile users currently cannot access several navigation items that are available on the desktop sidebar (e.g., "View public page", "Copy public page link", "Refer and earn"). Additionally, the "Copy public page link" button incorrectly shows a trailing arrow icon, which is inconsistent with the sidebar behavior where action items have no arrow.

Describe the solution you'd like

Use the existing useBottomNavItems hook on the mobile /more page to render the missing items instead of introducing new components, ensuring consistency with the rest of the navigation. Update MobileNavigationMoreItem so it can recognize action-based items (those without an href but with an onClick) and render them as a rather than a . For these action items, hide the arrow-right icon to match the behavior of the desktop sidebar. Finally, filter out the “settings” item—since it’s already available elsewhere—while keeping the current navigation structure intact.

Describe alternatives you've considered

  • Creating a brand‑new component (MobileNavigationBottomItems) that duplicated the logic of useBottomNavItems. This would increase maintenance overhead.

Additional context

  • The change is implemented in a PR titled "feature/mobile-more-page-action-items".
  • The updated component lives in apps/web/modules/shell/navigation/NavigationItem.tsx.
  • The mobile page now imports useBottomNavItems and renders the items via MobileNavigationMoreItem.
  • Visual regression testing confirms that the arrow is hidden for action items and the new items appear correctly on mobile.

Current:

Image

we should follow same like how we have in the sidebar at desktop
Image

There is no button on mobile resolution to navigate to /refer page

Requirement/Document

  • No additional documentation is required beyond updating the developer docs to note that the mobile More page now includes bottom navigation items.

House rules
  • If this issue has a 🚨 needs approval label, don't start coding yet. Wait until a core member approves feature request by removing this label, then you can start coding.
    • For clarity: Non-core member issues automatically get the 🚨 needs approval label.
    • Your feature ideas are invaluable to us! However, they undergo review to ensure alignment with the product's direction.
    • Follow Best Practices lined out in our Contributor Docs
      ](http://localhost:3000/pro)

Metadata

Metadata

Assignees

No one assigned

    Labels

    ✨ featureNew feature or request🚨 needs approvalThis feature request has not been reviewed yet by the Product Team and needs approval beforehand

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions