Skip to main content

Share Chatroom

​# Share Chatroom

The share chatroom feature allows users to share a public chatroom from the Chat app to other apps or social media platforms. This function gives you an URL which can be used to share it ahead. ​

Steps to share a post

  1. Add your domain for the respective platforms.

For Android

Declare the domain in your AndroidManifest.xml. Add supported domain inside launcher activity as intent-filter

<activity>
...
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data
android:host="YOUR_DOMAIN"
android:scheme="YOUR_CUSTOM_SCHEME"
/>
</intent-filter>
<activity>

For iOS

Declare the domain in your info.plist file.

<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLName</key>
<string>YOUR_APPLICATION_BUNDLE_IDENTIFIER</string>
<key>CFBundleURLSchemes</key>
<array>
<string>YOUR_SCHEME</string>
</array>
</dict>
</array>

Add these methods in AppDelegate.mm file.

@implementation AppDelegate
...
- (BOOL)application:(UIApplication *)application
openURL:(NSURL *)url
options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options
{
return [RCTLinkingManager application:application openURL:url options:options];
}

<!-- For universal links -->
- (BOOL)application:(UIApplication *)application continueUserActivity:(nonnull NSUserActivity *)userActivity
restorationHandler:(nonnull void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler
{
return [RCTLinkingManager application:application
continueUserActivity:userActivity
restorationHandler:restorationHandler];
}
@end
tip

For intergration of universal links(https links are considered as universal links), please visit React Navigation linking documentation.

  1. Change your custom domain inside shareUtils > index.ts in domain variable.

  2. Create a function as shareChatroom() and inside call our declared function shareChatroomUrl()

// function to share a chatroom
function onShare(chatroomID: number) {
let shareChatroomRequest = {
chatroomId: chatroomID,
domain: "", // Add your custom link to open app,
};
let shareUrl = shareChatroomURL(shareChatroomRequest);
processResponse(shareUrl);
}
tip

Change the contents as your requirements inside shareUtils > index.ts like text or images.

Steps to redirect to the shared post

  1. Once you have setup the domain, setup linking to handle the incoming deep link. Add linking prop in your navigation container and add your custom link in the prefixes key of linking object.
const linking = {
prefixes: [""], // Add your custom link to open app for e.g https://rnsampleapp.com, make sure to not put '/' after domain.
};

return (
<NavigationContainer linking={linking} ref={navigationRef}>
<Stack.Navigator initialRouteName={YOUR_INITIAL_ROUTE_NAME}>
// ...stack screens of your app
</Stack.Navigator>
</NavigationContainer>
);
  1. Call parseDeepLink() that you can import from ParseDeepLink > index.ts with the incoming deeplink in your Linking.addEventListener() and Linking.getInitialURL() methods to enable routing whenever user clicks on a post link.
const deepLinkRequest: DeepLinkRequest = {
uri: "", // url form deeplinking
uuid: "", // logged in user uuid
userName: userName, // logged in user name
isGuest: false,
};

parseDeepLink(deepLinkRequest, (response) => {
// Parsed response
});