- Print
- DarkLight
- PDF
iOS App White Labeling
- Print
- DarkLight
- PDF
General setup
As explained in the requirements, the repo contains targets/build flavors to build our experimental and official apps. This guide covers the default flavor, which is the Experimental app.
Open RocketChatRN.xcworkspace on Xcode (13.0 or newer)
On the General tab, select “RocketChatRN” and change Display Name, Bundle Identifier, Version, and Build.
![image.avif](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image.avif?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
Select “ShareRocketChatRN” and “NotificationService” and change the same properties
Display Name
andBundle Identifier
are different from the previous target.Version
andBuild
must be the same on all targets.
On Signing and Capabilities for “RocketChatRN,” check “Automatically manage signing,” select your app group, and add a keychain group.
Similarly, on the “ShareRocketChatRN” and “NotificationService” targets, check “Automatically manage signing,” select your app group, and add the same keychain group.Set the same app group on
RocketChatRN/Info.plist
,ShareRocketChatRN/Info.plist
andNotificationService/Info.plist
![image(14).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(14).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
![image(15).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(15).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
![image(16).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(16).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
Set the same keychain group on
RocketChatRN/Info.plist
,ShareRocketChatRN/Info.plist
andNotificationService/Info.plist
![image(17).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(17).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
![image(19).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(19).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
![image(18).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(18).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
It needs to be the same on all entitlements.
![image(20).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(20).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
![image(21).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(21).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
![image(22).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(22).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
Change the app icon on
Experimental.xcassets/App Icon
![image(23).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(23).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
Change the app splash screen on
Experimental.xcassets/Launch Screen Icon
Change the splash background colors on
Experimental.xcassets/splashBackgroundColor
Set your Bugsnag API key on
RocketChatRN/Info.plist
![image(26).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(26).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
Generate iOS app on Firebase
Visit the project overview on your Firebase console.
Go to Settings > Project settings.
On the “General” tab, click on “iOS” button under “Your apps” section:
Enter your bundle ID and then “Register app”:
Download the config file and move it as instructed:
Add it to all targets:
Run the app
Execute the following in the project terminal:
yarn
npx pod-install
yarn ios
Configure the Apple developer portal
Login to Apple developer portal
Visit your Apple developer account.
Enter your credentials.
Click Certificates, Identifiers & Profiles.
![image(32).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(32).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
Create an app identifier
Visit the Apple identifier list.
Click to add identifier.
Select App IDs and click Continue.
Add a Description and Bundle ID:
On Capabilities, select App Groups and Push notifications.
Click Continue and then Register.
Create an app identifier for the share extension version
Share extension is a version of the app that opens when you share data from another app to Rocket.Chat. For example, share a photo from the gallery.
Visit the resources identifier list.
Click to add Identifier.
Select App IDs and Continue.
Add a description and Bundle ID.
This time, select only App Groups under Capabilities.
Click Continue and then Register.
Create an app identifier for our notification service
![image(37).png](http://cdn.us.document360.io/27ca1fd4-36d7-4cde-b4eb-97fc1652954c/Images/Documentation/image(37).png?sv=2022-11-02&spr=https&st=2024-09-07T23%3A41%3A04Z&se=2024-09-07T23%3A51%3A04Z&sr=c&sp=r&sig=O3Br%2FHHfgTVmuWYT6HXydt65IYuEEADaBuMdzbCbNX8%3D)
Create an app group
Visit the resources identifier list.
Click to add Identifier.
Select App IDs and Continue.
Enter a Description and an Identifier:
Click Continue and then Register.
Apply app group
Visit the resources identifier list.
Click on the first identifier you created.
On App Groups, click Configure.
Select the App Group you created and click Continue.
Click Save.
Repeat these steps for the second identifier you created for the Share Extension and notification service.
Create push notifications certificates
Visit the resources identifier list.
Click on the first identifier you created.
On Push Notifications, click Configure.
Development SSL Certificate
On Development SSL Certificate, click Create Certificate.
Follow the official tutorial to generate a Certificate Signing Request.
Select the certificate you created and click Continue.
Download the certificate and install it on your machine per the on-screen instructions.
After installing it, Keychain Access should have opened automatically on your Mac.
Export the certificate to generate a
.p12
file.For simplicity, save it in the same folder of your CSR and
.cer
. You’ll need it later for SSL/TLS authentication and encryption.
Production SSL Certificate
On Production SSL Certificate, click Create Certificate.
Follow the official tutorial to generate a Certificate Signing Request.
Select the certificate you created and click Continue.
Download the certificate and install it on your machine per the on-screen instructions.
After installing it, Keychain Access should have opened automatically on your Mac.
Export the certificate to generate a
.p12
fileFor simplicity, save it in the same folder of your CSR and
.cer
. You’ll need it later for SSL/TLS authentication and encryption.