Navigation Controller for PostDetailPage

Web
1

I didn’t see any post that quite addressed my question, so here goes.

We allow our users to share a link to a post, and it has a format like this:

`<BASE_URL>/#!/post/<POST_ID>`

Here, <BASE_URL> is the path to a page in our React app that embeds the UI Kit. We parse the hash (if it exists) to navigate the user to the PostDetailPage for a given postId.

The issue we are noticing is that a user can go to the provided URL fine, and the <BackButton …> component renders fine… but it just doesn’t do anything.

I’ve noticing in src/v4/core/providers/NavigationProvider.tsx of the UIKit the following initialization of pages:

const [pages, setPages] = useState<Page>([getDefaultRoute(activeRoute)]);

i.e., set the current PostDetail page as the only page in the navigation. This means the Back button component has nowhere to navigate to! Is there a way to seed the navigation provider with a page to go back to? Ideally, the back button can take the user to a community in the application that contains the given postId.

My understanding of the NavigationBehavior overrides is that they can replace existing functions. The issue here seems to be different - with only one page in the Navigation Provider, there is no function even called in the first place.

Please let me know if there is documentation I may have missed somewhere on this topic. I’m just trying to navigate some oddities as we implement this for our community members.

2

Hello @mqm, thank you for sharing the information. We’ve escalated this to the team for further investigation and will get back to you with an update.

3

Hello @mqm , Thank you for your patience here, and apologies for the delay in getting back to you.

You’re absolutely right — with deep linking, our UIKit doesn’t currently backfill the navigation history automatically. This is by design, as the navigation stack initializes exclusively with the targeted route (e.g., PostDetailPage). Since the stack contains only that deep-linked page, there isn’t a previous page for the Back button to return to by default.

While Social+ generates the link, the in-app routing and back-stack management (such as defining a fallback destination like a community page or your main feed) currently needs to be handled within your app’s navigation logic.

I’ve also shared this as product feedback with our team, so we can explore improving native support for deep linking and back navigation in a future update.

4

Thanks for the update - your second paragraph tracks with my understanding.

I suppose its the 3rd paragraph where I’m unclear. When you say “your app’s navigation logic”, do you mean part of the config passed to the SocialPlus component, or logic we have to implement in our own app that uses that component?

If the latter case, do we need to add styling logic to hide the back button, or find a way to override the `onClick` for the back button?