1. Enable custom navigation

Use a callback for custom navigation or side-effects.

When the leader of a Follow Me session navigates, we can use the React Router to update the follower’s position. In the callback you will receive a PageInfo object.

<VeltPresence onNavigate={(pageInfo) => navigate(pageInfo.path)} />

PageInfo

propertytypedescription
baseUrlstringThe base URL of the site
pathstringThe path after the base URL
urlstringThe full URL

2. Disable default Follow Me navigation

Disable default Follow Me navigation.

Default: true

Our default navigation uses window.location.href to detect navigation. If you are handling navigation using the callback method above, you should disable our default navigation.

<VeltPresence defaultFlockNavigation={true} />

3. Start or Stop Following a User

You can start or Stop Following a User by calling the startFollowingUser() and stopFollowingUser() methods within a useEffect() hook.

Start Following

Start following a user by passing in their user ID to the startFollowingUser() method.

You can programatically start a Follow Me session by passing in the user ID of the user you want to lead the session.

// Start following the user
presenceElement.startFollowingUser(userId);

Stop Following

Stop Follow Me session for the current user by by calling the stopFollowingUser() method.

If the current user is in a Follow Me session, they will be removed from that session. If there are no more followers in the session, the session will be destroyed.

// Stop following the user
presenceElement.stopFollowingUser();