diff --git a/native/navigation/route-names.js b/native/navigation/route-names.js
index 94ede5f83..2993a34fa 100644
--- a/native/navigation/route-names.js
+++ b/native/navigation/route-names.js
@@ -1,332 +1,335 @@
 // @flow
 
 import type { RouteProp } from '@react-navigation/native';
 
 import type { ActionResultModalParams } from './action-result-modal.react.js';
 import type { InviteLinkModalParams } from './invite-link-modal.react';
 import type { AvatarSelectionParams } from '../account/registration/avatar-selection.react.js';
 import type { ConnectEthereumParams } from '../account/registration/connect-ethereum.react.js';
 import type { EmojiAvatarSelectionParams } from '../account/registration/emoji-avatar-selection.react.js';
 import type { ExistingEthereumAccountParams } from '../account/registration/existing-ethereum-account.react.js';
 import type { KeyserverSelectionParams } from '../account/registration/keyserver-selection.react.js';
 import type { PasswordSelectionParams } from '../account/registration/password-selection.react.js';
 import type { RegistrationTermsParams } from '../account/registration/registration-terms.react.js';
 import type { UsernameSelectionParams } from '../account/registration/username-selection.react.js';
 import type { TermsAndPrivacyModalParams } from '../account/terms-and-privacy-modal.react.js';
 import type { ThreadPickerModalParams } from '../calendar/thread-picker-modal.react.js';
 import type { ComposeSubchannelParams } from '../chat/compose-subchannel.react.js';
 import type { FullScreenThreadMediaGalleryParams } from '../chat/fullscreen-thread-media-gallery.react.js';
 import type { ImagePasteModalParams } from '../chat/image-paste-modal.react.js';
 import type { MessageListParams } from '../chat/message-list-types.js';
 import type { MessageReactionsModalParams } from '../chat/message-reactions-modal.react.js';
 import type { MessageResultsScreenParams } from '../chat/message-results-screen.react.js';
 import type { MultimediaMessageTooltipModalParams } from '../chat/multimedia-message-tooltip-modal.react.js';
 import type { RobotextMessageTooltipModalParams } from '../chat/robotext-message-tooltip-modal.react.js';
 import type { AddUsersModalParams } from '../chat/settings/add-users-modal.react.js';
 import type { ColorSelectorModalParams } from '../chat/settings/color-selector-modal.react.js';
 import type { ComposeSubchannelModalParams } from '../chat/settings/compose-subchannel-modal.react.js';
 import type { DeleteThreadParams } from '../chat/settings/delete-thread.react.js';
 import type { EmojiThreadAvatarCreationParams } from '../chat/settings/emoji-thread-avatar-creation.react.js';
 import type { ThreadSettingsMemberTooltipModalParams } from '../chat/settings/thread-settings-member-tooltip-modal.react.js';
 import type { ThreadSettingsParams } from '../chat/settings/thread-settings.react.js';
 import type { SidebarListModalParams } from '../chat/sidebar-list-modal.react.js';
 import type { SubchannelListModalParams } from '../chat/subchannels-list-modal.react.js';
 import type { TextMessageTooltipModalParams } from '../chat/text-message-tooltip-modal.react.js';
 import type { TogglePinModalParams } from '../chat/toggle-pin-modal.react.js';
 import type { CommunityCreationMembersScreenParams } from '../community-creation/community-creation-members.react.js';
 import type { ManagePublicLinkScreenParams } from '../invite-links/manage-public-link-screen.react.js';
 import type { ViewInviteLinksScreenParams } from '../invite-links/view-invite-links-screen.react.js';
 import type { ChatCameraModalParams } from '../media/chat-camera-modal.react.js';
 import type { ImageModalParams } from '../media/image-modal.react.js';
 import type { ThreadAvatarCameraModalParams } from '../media/thread-avatar-camera-modal.react.js';
 import type { VideoPlaybackModalParams } from '../media/video-playback-modal.react.js';
 import type { CustomServerModalParams } from '../profile/custom-server-modal.react.js';
 import type { UserRelationshipTooltipModalParams } from '../profile/user-relationship-tooltip-modal.react.js';
 import type { ChangeRolesScreenParams } from '../roles/change-roles-screen.react.js';
 import type { CommunityRolesScreenParams } from '../roles/community-roles-screen.react.js';
 import type { CreateRolesScreenParams } from '../roles/create-roles-screen.react.js';
 import type { MessageSearchParams } from '../search/message-search.react.js';
 import type { UserProfileAvatarModalParams } from '../user-profile/user-profile-avatar-modal.react.js';
 import type { UserProfileBottomSheetParams } from '../user-profile/user-profile-bottom-sheet.react.js';
 
 export const ActionResultModalRouteName = 'ActionResultModal';
 export const AddUsersModalRouteName = 'AddUsersModal';
 export const AppearancePreferencesRouteName = 'AppearancePreferences';
 export const AppRouteName = 'App';
 export const AppsRouteName = 'Apps';
 export const BackgroundChatThreadListRouteName = 'BackgroundChatThreadList';
 export const BackupMenuRouteName = 'BackupMenu';
 export const BlockListRouteName = 'BlockList';
 export const BuildInfoRouteName = 'BuildInfo';
 export const CalendarRouteName = 'Calendar';
 export const ChangeRolesScreenRouteName = 'ChangeRolesScreen';
 export const ChatCameraModalRouteName = 'ChatCameraModal';
 export const ChatRouteName = 'Chat';
 export const ChatThreadListRouteName = 'ChatThreadList';
 export const ColorSelectorModalRouteName = 'ColorSelectorModal';
 export const ComposeSubchannelModalRouteName = 'ComposeSubchannelModal';
 export const ComposeSubchannelRouteName = 'ComposeSubchannel';
 export const CommunityDrawerNavigatorRouteName = 'CommunityDrawerNavigator';
 export const CustomServerModalRouteName = 'CustomServerModal';
 export const DefaultNotificationsPreferencesRouteName = 'DefaultNotifications';
 export const DeleteAccountRouteName = 'DeleteAccount';
 export const DeleteThreadRouteName = 'DeleteThread';
 export const DevToolsRouteName = 'DevTools';
 export const EditPasswordRouteName = 'EditPassword';
 export const EmojiThreadAvatarCreationRouteName = 'EmojiThreadAvatarCreation';
 export const EmojiUserAvatarCreationRouteName = 'EmojiUserAvatarCreation';
 export const FriendListRouteName = 'FriendList';
 export const FullScreenThreadMediaGalleryRouteName =
   'FullScreenThreadMediaGallery';
 export const HomeChatThreadListRouteName = 'HomeChatThreadList';
 export const ImageModalRouteName = 'ImageModal';
 export const ImagePasteModalRouteName = 'ImagePasteModal';
 export const InviteLinkModalRouteName = 'InviteLinkModal';
 export const InviteLinkNavigatorRouteName = 'InviteLinkNavigator';
 export const LinkedDevicesRouteName = 'LinkedDevices';
 export const LoggedOutModalRouteName = 'LoggedOutModal';
 export const ManagePublicLinkRouteName = 'ManagePublicLink';
 export const MessageListRouteName = 'MessageList';
 export const MessageReactionsModalRouteName = 'MessageReactionsModal';
 export const MessageResultsScreenRouteName = 'MessageResultsScreen';
 export const MultimediaMessageTooltipModalRouteName =
   'MultimediaMessageTooltipModal';
 export const PrivacyPreferencesRouteName = 'PrivacyPreferences';
 export const ProfileRouteName = 'Profile';
 export const ProfileScreenRouteName = 'ProfileScreen';
 export const UserRelationshipTooltipModalRouteName =
   'UserRelationshipTooltipModal';
 export const RobotextMessageTooltipModalRouteName =
   'RobotextMessageTooltipModal';
 export const SecondaryDeviceQRCodeScannerRouteName =
   'SecondaryDeviceQRCodeScanner';
 export const SidebarListModalRouteName = 'SidebarListModal';
 export const SubchannelsListModalRouteName = 'SubchannelsListModal';
 export const TabNavigatorRouteName = 'TabNavigator';
 export const TextMessageTooltipModalRouteName = 'TextMessageTooltipModal';
 export const ThreadAvatarCameraModalRouteName = 'ThreadAvatarCameraModal';
 export const ThreadPickerModalRouteName = 'ThreadPickerModal';
 export const ThreadSettingsMemberTooltipModalRouteName =
   'ThreadSettingsMemberTooltipModal';
 export const ThreadSettingsRouteName = 'ThreadSettings';
+export const TunnelbrokerMenuRouteName = 'TunnelbrokerMenu';
 export const UserAvatarCameraModalRouteName = 'UserAvatarCameraModal';
 export const TogglePinModalRouteName = 'TogglePinModal';
 export const VideoPlaybackModalRouteName = 'VideoPlaybackModal';
 export const ViewInviteLinksRouteName = 'ViewInviteLinks';
 export const TermsAndPrivacyRouteName = 'TermsAndPrivacyModal';
 export const RegistrationRouteName = 'Registration';
 export const KeyserverSelectionRouteName = 'KeyserverSelection';
 export const CoolOrNerdModeSelectionRouteName = 'CoolOrNerdModeSelection';
 export const ConnectEthereumRouteName = 'ConnectEthereum';
 export const ExistingEthereumAccountRouteName = 'ExistingEthereumAccount';
 export const UsernameSelectionRouteName = 'UsernameSelection';
 export const CommunityCreationRouteName = 'CommunityCreation';
 export const CommunityConfigurationRouteName = 'CommunityConfiguration';
 export const CommunityCreationMembersRouteName = 'CommunityCreationMembers';
 export const MessageSearchRouteName = 'MessageSearch';
 export const PasswordSelectionRouteName = 'PasswordSelection';
 export const AvatarSelectionRouteName = 'AvatarSelection';
 export const EmojiAvatarSelectionRouteName = 'EmojiAvatarSelection';
 export const RegistrationUserAvatarCameraModalRouteName =
   'RegistrationUserAvatarCameraModal';
 export const RegistrationTermsRouteName = 'RegistrationTerms';
 export const RolesNavigatorRouteName = 'RolesNavigator';
 export const CommunityRolesScreenRouteName = 'CommunityRolesScreen';
 export const CreateRolesScreenRouteName = 'CreateRolesScreen';
 export const QRCodeSignInNavigatorRouteName = 'QRCodeSignInNavigator';
 export const QRCodeScreenRouteName = 'QRCodeScreen';
 export const UserProfileBottomSheetNavigatorRouteName =
   'UserProfileBottomSheetNavigator';
 export const UserProfileBottomSheetRouteName = 'UserProfileBottomSheet';
 export const UserProfileAvatarModalRouteName = 'UserProfileAvatarModal';
 export const KeyserverSelectionListRouteName = 'KeyserverSelectionList';
 export const AddKeyserverRouteName = 'AddKeyserver';
 
 export type RootParamList = {
   +LoggedOutModal: void,
   +App: void,
   +ThreadPickerModal: ThreadPickerModalParams,
   +AddUsersModal: AddUsersModalParams,
   +CustomServerModal: CustomServerModalParams,
   +ColorSelectorModal: ColorSelectorModalParams,
   +ComposeSubchannelModal: ComposeSubchannelModalParams,
   +SidebarListModal: SidebarListModalParams,
   +ImagePasteModal: ImagePasteModalParams,
   +TermsAndPrivacyModal: TermsAndPrivacyModalParams,
   +SubchannelsListModal: SubchannelListModalParams,
   +MessageReactionsModal: MessageReactionsModalParams,
   +Registration: void,
   +CommunityCreation: void,
   +InviteLinkModal: InviteLinkModalParams,
   +InviteLinkNavigator: void,
   +RolesNavigator: void,
   +QRCodeSignInNavigator: void,
   +UserProfileBottomSheetNavigator: void,
+  +TunnelbrokerMenu: void,
 };
 
 export type MessageTooltipRouteNames =
   | typeof RobotextMessageTooltipModalRouteName
   | typeof MultimediaMessageTooltipModalRouteName
   | typeof TextMessageTooltipModalRouteName;
 
 export const PinnableMessageTooltipRouteNames = [
   TextMessageTooltipModalRouteName,
   MultimediaMessageTooltipModalRouteName,
 ];
 
 export type TooltipModalParamList = {
   +MultimediaMessageTooltipModal: MultimediaMessageTooltipModalParams,
   +TextMessageTooltipModal: TextMessageTooltipModalParams,
   +ThreadSettingsMemberTooltipModal: ThreadSettingsMemberTooltipModalParams,
   +UserRelationshipTooltipModal: UserRelationshipTooltipModalParams,
   +RobotextMessageTooltipModal: RobotextMessageTooltipModalParams,
 };
 
 export type OverlayParamList = {
   +CommunityDrawerNavigator: void,
   +ImageModal: ImageModalParams,
   +ActionResultModal: ActionResultModalParams,
   +ChatCameraModal: ChatCameraModalParams,
   +UserAvatarCameraModal: void,
   +ThreadAvatarCameraModal: ThreadAvatarCameraModalParams,
   +VideoPlaybackModal: VideoPlaybackModalParams,
   +TogglePinModal: TogglePinModalParams,
   ...TooltipModalParamList,
 };
 
 export type TabParamList = {
   +Calendar: void,
   +Chat: void,
   +Profile: void,
   +Apps: void,
 };
 
 export type ChatParamList = {
   +ChatThreadList: void,
   +MessageList: MessageListParams,
   +ComposeSubchannel: ComposeSubchannelParams,
   +ThreadSettings: ThreadSettingsParams,
   +EmojiThreadAvatarCreation: EmojiThreadAvatarCreationParams,
   +DeleteThread: DeleteThreadParams,
   +FullScreenThreadMediaGallery: FullScreenThreadMediaGalleryParams,
   +MessageResultsScreen: MessageResultsScreenParams,
   +MessageSearch: MessageSearchParams,
   +ChangeRolesScreen: ChangeRolesScreenParams,
 };
 
 export type ChatTopTabsParamList = {
   +HomeChatThreadList: void,
   +BackgroundChatThreadList: void,
 };
 
 export type ProfileParamList = {
   +ProfileScreen: void,
   +EmojiUserAvatarCreation: void,
   +EditPassword: void,
   +DeleteAccount: void,
   +BuildInfo: void,
   +DevTools: void,
   +AppearancePreferences: void,
   +PrivacyPreferences: void,
   +DefaultNotifications: void,
   +FriendList: void,
   +BlockList: void,
   +LinkedDevices: void,
   +SecondaryDeviceQRCodeScanner: void,
   +BackupMenu: void,
+  +TunnelbrokerMenu: void,
   +KeyserverSelectionList: void,
   +AddKeyserver: void,
 };
 
 export type CommunityDrawerParamList = { +TabNavigator: void };
 
 export type RegistrationParamList = {
   +CoolOrNerdModeSelection: void,
   +KeyserverSelection: KeyserverSelectionParams,
   +ConnectEthereum: ConnectEthereumParams,
   +ExistingEthereumAccount: ExistingEthereumAccountParams,
   +UsernameSelection: UsernameSelectionParams,
   +PasswordSelection: PasswordSelectionParams,
   +AvatarSelection: AvatarSelectionParams,
   +EmojiAvatarSelection: EmojiAvatarSelectionParams,
   +RegistrationUserAvatarCameraModal: void,
   +RegistrationTerms: RegistrationTermsParams,
 };
 
 export type InviteLinkParamList = {
   +ViewInviteLinks: ViewInviteLinksScreenParams,
   +ManagePublicLink: ManagePublicLinkScreenParams,
 };
 
 export type CommunityCreationParamList = {
   +CommunityConfiguration: void,
   +CommunityCreationMembers: CommunityCreationMembersScreenParams,
 };
 
 export type RolesParamList = {
   +CommunityRolesScreen: CommunityRolesScreenParams,
   +CreateRolesScreen: CreateRolesScreenParams,
 };
 
 export type QRCodeSignInParamList = {
   +QRCodeScreen: void,
 };
 
 export type UserProfileBottomSheetParamList = {
   +UserProfileBottomSheet: UserProfileBottomSheetParams,
   +UserProfileAvatarModal: UserProfileAvatarModalParams,
   +UserRelationshipTooltipModal: UserRelationshipTooltipModalParams,
 };
 
 export type ScreenParamList = {
   ...RootParamList,
   ...OverlayParamList,
   ...TabParamList,
   ...ChatParamList,
   ...ChatTopTabsParamList,
   ...ProfileParamList,
   ...CommunityDrawerParamList,
   ...RegistrationParamList,
   ...InviteLinkParamList,
   ...CommunityCreationParamList,
   ...RolesParamList,
   ...QRCodeSignInParamList,
   ...UserProfileBottomSheetParamList,
 };
 
 export type NavigationRoute<RouteName: string = $Keys<ScreenParamList>> =
   RouteProp<ScreenParamList, RouteName>;
 
 export const accountModals = [
   LoggedOutModalRouteName,
   RegistrationRouteName,
   QRCodeSignInNavigatorRouteName,
 ];
 
 export const scrollBlockingModals = [
   ImageModalRouteName,
   MultimediaMessageTooltipModalRouteName,
   TextMessageTooltipModalRouteName,
   ThreadSettingsMemberTooltipModalRouteName,
   UserRelationshipTooltipModalRouteName,
   RobotextMessageTooltipModalRouteName,
   VideoPlaybackModalRouteName,
 ];
 
 export const chatRootModals = [
   AddUsersModalRouteName,
   ColorSelectorModalRouteName,
   ComposeSubchannelModalRouteName,
 ];
 
 export const threadRoutes = [
   MessageListRouteName,
   ThreadSettingsRouteName,
   DeleteThreadRouteName,
   ComposeSubchannelRouteName,
   FullScreenThreadMediaGalleryRouteName,
   MessageResultsScreenRouteName,
   MessageSearchRouteName,
   EmojiThreadAvatarCreationRouteName,
   CommunityRolesScreenRouteName,
 ];
diff --git a/native/profile/profile-screen.react.js b/native/profile/profile-screen.react.js
index 378b3da5b..c50609a32 100644
--- a/native/profile/profile-screen.react.js
+++ b/native/profile/profile-screen.react.js
@@ -1,451 +1,467 @@
 // @flow
 
 import * as React from 'react';
 import { View, Text, Platform, ScrollView } from 'react-native';
 
 import { logOutActionTypes, logOut } from 'lib/actions/user-actions.js';
 import { useStringForUser } from 'lib/hooks/ens-cache.js';
 import { preRequestUserStateSelector } from 'lib/selectors/account-selectors.js';
 import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
 import { accountHasPassword } from 'lib/shared/account-utils.js';
 import type { LogOutResult } from 'lib/types/account-types.js';
 import { type PreRequestUserState } from 'lib/types/session-types.js';
 import { type CurrentUserInfo } from 'lib/types/user-types.js';
 import {
   type DispatchActionPromise,
   useDispatchActionPromise,
   useServerCall,
 } from 'lib/utils/action-utils.js';
 
 import type { ProfileNavigationProp } from './profile.react.js';
 import { deleteNativeCredentialsFor } from '../account/native-credentials.js';
 import EditUserAvatar from '../avatars/edit-user-avatar.react.js';
 import Action from '../components/action-row.react.js';
 import Button from '../components/button.react.js';
 import EditSettingButton from '../components/edit-setting-button.react.js';
 import SingleLine from '../components/single-line.react.js';
 import type { NavigationRoute } from '../navigation/route-names.js';
 import {
   EditPasswordRouteName,
   DeleteAccountRouteName,
   BuildInfoRouteName,
   DevToolsRouteName,
   AppearancePreferencesRouteName,
   FriendListRouteName,
   BlockListRouteName,
   PrivacyPreferencesRouteName,
   DefaultNotificationsPreferencesRouteName,
   LinkedDevicesRouteName,
   BackupMenuRouteName,
   KeyserverSelectionListRouteName,
+  TunnelbrokerMenuRouteName,
 } from '../navigation/route-names.js';
 import { useSelector } from '../redux/redux-utils.js';
 import { type Colors, useColors, useStyles } from '../themes/colors.js';
 import Alert from '../utils/alert.js';
 import { useStaffCanSee } from '../utils/staff-utils.js';
 
 type ProfileRowProps = {
   +content: string,
   +onPress: () => void,
   +danger?: boolean,
 };
 
 function ProfileRow(props: ProfileRowProps): React.Node {
   const { content, onPress, danger } = props;
   return (
     <Action.Row onPress={onPress}>
       <Action.Text danger={danger} content={content} />
       <Action.Icon name="ios-arrow-forward" />
     </Action.Row>
   );
 }
 
 type BaseProps = {
   +navigation: ProfileNavigationProp<'ProfileScreen'>,
   +route: NavigationRoute<'ProfileScreen'>,
 };
 type Props = {
   ...BaseProps,
   +currentUserInfo: ?CurrentUserInfo,
   +preRequestUserState: PreRequestUserState,
   +logOutLoading: boolean,
   +colors: Colors,
   +styles: typeof unboundStyles,
   +dispatchActionPromise: DispatchActionPromise,
   +logOut: (preRequestUserState: PreRequestUserState) => Promise<LogOutResult>,
   +staffCanSee: boolean,
   +stringForUser: ?string,
   +isAccountWithPassword: boolean,
 };
 
 class ProfileScreen extends React.PureComponent<Props> {
   get loggedOutOrLoggingOut() {
     return (
       !this.props.currentUserInfo ||
       this.props.currentUserInfo.anonymous ||
       this.props.logOutLoading
     );
   }
 
   render() {
-    let developerTools, defaultNotifications, keyserverSelection;
+    let developerTools,
+      defaultNotifications,
+      keyserverSelection,
+      tunnelbrokerMenu;
     const { staffCanSee, isAccountWithPassword } = this.props;
     if (staffCanSee) {
       developerTools = (
         <ProfileRow content="Developer tools" onPress={this.onPressDevTools} />
       );
 
       defaultNotifications = (
         <ProfileRow
           content="Default Notifications"
           onPress={this.onPressDefaultNotifications}
         />
       );
 
       keyserverSelection = (
         <ProfileRow
           content="Keyserver selection"
           onPress={this.onPressKeyserverSelection}
         />
       );
+
+      tunnelbrokerMenu = (
+        <ProfileRow
+          content="Tunnelbroker menu"
+          onPress={this.onPressTunnelbrokerMenu}
+        />
+      );
     }
 
     let backupMenu;
     if (staffCanSee && isAccountWithPassword) {
       backupMenu = (
         <ProfileRow content="Backup menu" onPress={this.onPressBackupMenu} />
       );
     }
 
     let passwordEditionUI;
     if (accountHasPassword(this.props.currentUserInfo)) {
       passwordEditionUI = (
         <Action.Row>
           <Text style={this.props.styles.label}>Password</Text>
           <Text
             style={[this.props.styles.content, this.props.styles.value]}
             numberOfLines={1}
           >
             ••••••••••••••••
           </Text>
           <EditSettingButton
             onPress={this.onPressEditPassword}
             canChangeSettings={true}
             style={this.props.styles.editPasswordButton}
           />
         </Action.Row>
       );
     }
 
     let linkedDevices;
     if (__DEV__) {
       linkedDevices = (
         <ProfileRow content="Linked devices" onPress={this.onPressDevices} />
       );
     }
 
     return (
       <View style={this.props.styles.container}>
         <ScrollView
           contentContainerStyle={this.props.styles.scrollViewContentContainer}
           style={this.props.styles.scrollView}
         >
           <Text style={this.props.styles.header}>USER AVATAR</Text>
           <View
             style={[this.props.styles.section, this.props.styles.avatarSection]}
           >
             <EditUserAvatar userID={this.props.currentUserInfo?.id} />
           </View>
           <Text style={this.props.styles.header}>ACCOUNT</Text>
           <View style={this.props.styles.section}>
             <Action.Row>
               <Text style={this.props.styles.loggedInLabel}>Logged in as </Text>
               <SingleLine
                 style={[this.props.styles.label, this.props.styles.username]}
               >
                 {this.props.stringForUser}
               </SingleLine>
               <Button
                 onPress={this.onPressLogOut}
                 disabled={this.loggedOutOrLoggingOut}
               >
                 <Text style={this.props.styles.logOutText}>Log out</Text>
               </Button>
             </Action.Row>
             {passwordEditionUI}
           </View>
           <View style={this.props.styles.section}>
             <ProfileRow
               content="Friend list"
               onPress={this.onPressFriendList}
             />
             <ProfileRow content="Block list" onPress={this.onPressBlockList} />
           </View>
           <Text style={this.props.styles.header}>PREFERENCES</Text>
           <View style={this.props.styles.section}>
             <ProfileRow content="Appearance" onPress={this.onPressAppearance} />
             <ProfileRow content="Privacy" onPress={this.onPressPrivacy} />
             {defaultNotifications}
             {backupMenu}
+            {tunnelbrokerMenu}
           </View>
           <View style={this.props.styles.section}>
             {linkedDevices}
             {keyserverSelection}
             <ProfileRow content="Build info" onPress={this.onPressBuildInfo} />
             {developerTools}
           </View>
           <View style={this.props.styles.unpaddedSection}>
             <ProfileRow
               content="Delete account..."
               danger
               onPress={this.onPressDeleteAccount}
             />
           </View>
         </ScrollView>
       </View>
     );
   }
 
   onPressLogOut = () => {
     if (this.loggedOutOrLoggingOut) {
       return;
     }
     if (!this.props.isAccountWithPassword) {
       Alert.alert(
         'Log out',
         'Are you sure you want to log out?',
         [
           { text: 'No', style: 'cancel' },
           {
             text: 'Yes',
             onPress: this.logOutWithoutDeletingNativeCredentialsWrapper,
             style: 'destructive',
           },
         ],
         { cancelable: true },
       );
       return;
     }
     const alertTitle =
       Platform.OS === 'ios' ? 'Keep Login Info in Keychain' : 'Keep Login Info';
     const alertDescription =
       'We will automatically fill out log-in forms with your credentials ' +
       'in the app.';
     Alert.alert(
       alertTitle,
       alertDescription,
       [
         { text: 'Cancel', style: 'cancel' },
         {
           text: 'Keep',
           onPress: this.logOutWithoutDeletingNativeCredentialsWrapper,
         },
         {
           text: 'Remove',
           onPress: this.logOutAndDeleteNativeCredentialsWrapper,
           style: 'destructive',
         },
       ],
       { cancelable: true },
     );
   };
 
   logOutWithoutDeletingNativeCredentialsWrapper = () => {
     if (this.loggedOutOrLoggingOut) {
       return;
     }
     this.logOut();
   };
 
   logOutAndDeleteNativeCredentialsWrapper = async () => {
     if (this.loggedOutOrLoggingOut) {
       return;
     }
     await this.deleteNativeCredentials();
     this.logOut();
   };
 
   logOut() {
     this.props.dispatchActionPromise(
       logOutActionTypes,
       this.props.logOut(this.props.preRequestUserState),
     );
   }
 
   async deleteNativeCredentials() {
     await deleteNativeCredentialsFor();
   }
 
   navigateIfActive(name) {
     this.props.navigation.navigate({ name });
   }
 
   onPressEditPassword = () => {
     this.navigateIfActive(EditPasswordRouteName);
   };
 
   onPressDeleteAccount = () => {
     this.navigateIfActive(DeleteAccountRouteName);
   };
 
   onPressDevices = () => {
     this.navigateIfActive(LinkedDevicesRouteName);
   };
 
   onPressBuildInfo = () => {
     this.navigateIfActive(BuildInfoRouteName);
   };
 
   onPressDevTools = () => {
     this.navigateIfActive(DevToolsRouteName);
   };
 
   onPressAppearance = () => {
     this.navigateIfActive(AppearancePreferencesRouteName);
   };
 
   onPressPrivacy = () => {
     this.navigateIfActive(PrivacyPreferencesRouteName);
   };
 
   onPressDefaultNotifications = () => {
     this.navigateIfActive(DefaultNotificationsPreferencesRouteName);
   };
 
   onPressFriendList = () => {
     this.navigateIfActive(FriendListRouteName);
   };
 
   onPressBlockList = () => {
     this.navigateIfActive(BlockListRouteName);
   };
 
   onPressBackupMenu = () => {
     this.navigateIfActive(BackupMenuRouteName);
   };
 
+  onPressTunnelbrokerMenu = () => {
+    this.navigateIfActive(TunnelbrokerMenuRouteName);
+  };
+
   onPressKeyserverSelection = () => {
     this.navigateIfActive(KeyserverSelectionListRouteName);
   };
 }
 
 const unboundStyles = {
   avatarSection: {
     alignItems: 'center',
     paddingVertical: 16,
   },
   container: {
     flex: 1,
   },
   content: {
     flex: 1,
   },
   deleteAccountButton: {
     paddingHorizontal: 24,
     paddingVertical: 12,
   },
   editPasswordButton: {
     paddingTop: Platform.OS === 'android' ? 3 : 2,
   },
   header: {
     color: 'panelBackgroundLabel',
     fontSize: 12,
     fontWeight: '400',
     paddingBottom: 3,
     paddingHorizontal: 24,
   },
   label: {
     color: 'panelForegroundTertiaryLabel',
     fontSize: 16,
     paddingRight: 12,
   },
   loggedInLabel: {
     color: 'panelForegroundTertiaryLabel',
     fontSize: 16,
   },
   logOutText: {
     color: 'link',
     fontSize: 16,
     paddingLeft: 6,
   },
   row: {
     flex: 1,
     flexDirection: 'row',
     justifyContent: 'space-between',
   },
   scrollView: {
     backgroundColor: 'panelBackground',
   },
   scrollViewContentContainer: {
     paddingTop: 24,
   },
   paddedRow: {
     flex: 1,
     flexDirection: 'row',
     justifyContent: 'space-between',
     paddingHorizontal: 24,
     paddingVertical: 10,
   },
   section: {
     backgroundColor: 'panelForeground',
     borderBottomWidth: 1,
     borderColor: 'panelForegroundBorder',
     borderTopWidth: 1,
     marginBottom: 24,
     paddingVertical: 1,
   },
   unpaddedSection: {
     backgroundColor: 'panelForeground',
     borderBottomWidth: 1,
     borderColor: 'panelForegroundBorder',
     borderTopWidth: 1,
     marginBottom: 24,
   },
   username: {
     color: 'panelForegroundLabel',
     flex: 1,
   },
   value: {
     color: 'panelForegroundLabel',
     fontSize: 16,
     textAlign: 'right',
   },
 };
 
 const logOutLoadingStatusSelector =
   createLoadingStatusSelector(logOutActionTypes);
 
 const ConnectedProfileScreen: React.ComponentType<BaseProps> =
   React.memo<BaseProps>(function ConnectedProfileScreen(props: BaseProps) {
     const currentUserInfo = useSelector(state => state.currentUserInfo);
     const preRequestUserState = useSelector(preRequestUserStateSelector);
     const logOutLoading =
       useSelector(logOutLoadingStatusSelector) === 'loading';
     const colors = useColors();
     const styles = useStyles(unboundStyles);
     const callLogOut = useServerCall(logOut);
     const dispatchActionPromise = useDispatchActionPromise();
     const staffCanSee = useStaffCanSee();
     const stringForUser = useStringForUser(currentUserInfo);
     const isAccountWithPassword = useSelector(state =>
       accountHasPassword(state.currentUserInfo),
     );
 
     return (
       <ProfileScreen
         {...props}
         currentUserInfo={currentUserInfo}
         preRequestUserState={preRequestUserState}
         logOutLoading={logOutLoading}
         colors={colors}
         styles={styles}
         logOut={callLogOut}
         dispatchActionPromise={dispatchActionPromise}
         staffCanSee={staffCanSee}
         stringForUser={stringForUser}
         isAccountWithPassword={isAccountWithPassword}
       />
     );
   });
 
 export default ConnectedProfileScreen;
diff --git a/native/profile/profile.react.js b/native/profile/profile.react.js
index 0afefb250..26b8cb5ee 100644
--- a/native/profile/profile.react.js
+++ b/native/profile/profile.react.js
@@ -1,236 +1,245 @@
 // @flow
 
 import {
   createStackNavigator,
   type StackNavigationProp,
   type StackNavigationHelpers,
   type StackHeaderProps,
 } from '@react-navigation/stack';
 import * as React from 'react';
 import { View, useWindowDimensions } from 'react-native';
 
 import AddKeyserver from './add-keyserver.react.js';
 import AppearancePreferences from './appearance-preferences.react.js';
 import BackupMenu from './backup-menu.react.js';
 import BuildInfo from './build-info.react.js';
 import DefaultNotificationsPreferences from './default-notifications-preferences.react.js';
 import DeleteAccount from './delete-account.react.js';
 import DevTools from './dev-tools.react.js';
 import EditPassword from './edit-password.react.js';
 import EmojiUserAvatarCreation from './emoji-user-avatar-creation.react.js';
 import KeyserverSelectionListHeaderRightButton from './keyserver-selection-list-header-right-button.react.js';
 import KeyserverSelectionList from './keyserver-selection-list.react.js';
 import LinkedDevicesHeaderRightButton from './linked-devices-header-right-button.react.js';
 import LinkedDevices from './linked-devices.react.js';
 import PrivacyPreferences from './privacy-preferences.react.js';
 import ProfileHeader from './profile-header.react.js';
 import ProfileScreen from './profile-screen.react.js';
 import RelationshipList from './relationship-list.react.js';
 import SecondaryDeviceQRCodeScanner from './secondary-device-qr-code-scanner.react.js';
+import TunnelbrokerMenu from './tunnelbroker-menu.react.js';
 import KeyboardAvoidingView from '../components/keyboard-avoiding-view.react.js';
 import CommunityDrawerButton from '../navigation/community-drawer-button.react.js';
 import type { CommunityDrawerNavigationProp } from '../navigation/community-drawer-navigator.react.js';
 import HeaderBackButton from '../navigation/header-back-button.react.js';
 import {
   ProfileScreenRouteName,
   EditPasswordRouteName,
   DeleteAccountRouteName,
   EmojiUserAvatarCreationRouteName,
   BuildInfoRouteName,
   DevToolsRouteName,
   AppearancePreferencesRouteName,
   PrivacyPreferencesRouteName,
   FriendListRouteName,
   DefaultNotificationsPreferencesRouteName,
   BlockListRouteName,
   LinkedDevicesRouteName,
   SecondaryDeviceQRCodeScannerRouteName,
   BackupMenuRouteName,
   KeyserverSelectionListRouteName,
   AddKeyserverRouteName,
   type ScreenParamList,
   type ProfileParamList,
+  TunnelbrokerMenuRouteName,
 } from '../navigation/route-names.js';
 import { useStyles, useColors } from '../themes/colors.js';
 
 const header = (props: StackHeaderProps) => <ProfileHeader {...props} />;
 const profileScreenOptions = { headerTitle: 'Profile' };
 const emojiAvatarCreationOptions = {
   headerTitle: 'Emoji avatar selection',
   headerBackTitleVisible: false,
 };
 const editPasswordOptions = { headerTitle: 'Change password' };
 const deleteAccountOptions = { headerTitle: 'Delete account' };
 const linkedDevicesOptions = {
   headerTitle: 'Linked devices',
   // eslint-disable-next-line react/display-name
   headerRight: () => <LinkedDevicesHeaderRightButton />,
 };
 const keyserverSelectionListOptions = {
   headerTitle: 'Keyservers',
   // eslint-disable-next-line react/display-name
   headerRight: () => <KeyserverSelectionListHeaderRightButton />,
 };
 const addKeyserverOptions = { headerTitle: 'Add keyserver' };
 const backupMenuOptions = { headerTitle: 'Backup menu' };
+const tunnelbrokerMenuOptions = { headerTitle: 'Tunnelbroker menu' };
 const secondaryDeviceQRCodeScannerOptions = {
   headerTitle: '',
   headerBackTitleVisible: false,
 };
 const buildInfoOptions = { headerTitle: 'Build info' };
 const devToolsOptions = { headerTitle: 'Developer tools' };
 const appearanceOptions = { headerTitle: 'Appearance' };
 const privacyOptions = { headerTitle: 'Privacy' };
 const friendListOptions = { headerTitle: 'Friend list' };
 const blockListOptions = { headerTitle: 'Block list' };
 const defaultNotificationsOptions = { headerTitle: 'Default Notifications' };
 
 export type ProfileNavigationProp<
   RouteName: $Keys<ProfileParamList> = $Keys<ProfileParamList>,
 > = StackNavigationProp<ScreenParamList, RouteName>;
 
 const Profile = createStackNavigator<
   ScreenParamList,
   ProfileParamList,
   StackNavigationHelpers<ScreenParamList>,
 >();
 type Props = {
   +navigation: CommunityDrawerNavigationProp<'TabNavigator'>,
   ...
 };
+
 function ProfileComponent(props: Props): React.Node {
   const styles = useStyles(unboundStyles);
   const colors = useColors();
 
   const headerLeftButton = React.useCallback(
     headerProps =>
       headerProps.canGoBack ? (
         <HeaderBackButton {...headerProps} />
       ) : (
         <CommunityDrawerButton navigation={props.navigation} />
       ),
     [props.navigation],
   );
 
   const { width: screenWidth } = useWindowDimensions();
   const screenOptions = React.useMemo(
     () => ({
       header,
       headerLeft: headerLeftButton,
       headerStyle: {
         backgroundColor: colors.tabBarBackground,
         shadowOpacity: 0,
       },
       gestureEnabled: true,
       gestureResponseDistance: screenWidth,
     }),
     [colors.tabBarBackground, headerLeftButton, screenWidth],
   );
 
   return (
     <View style={styles.view}>
       <KeyboardAvoidingView
         behavior="padding"
         style={styles.keyboardAvoidingView}
       >
         <Profile.Navigator
           screenOptions={screenOptions}
           detachInactiveScreens={false}
         >
           <Profile.Screen
             name={ProfileScreenRouteName}
             component={ProfileScreen}
             options={profileScreenOptions}
           />
           <Profile.Screen
             name={EmojiUserAvatarCreationRouteName}
             component={EmojiUserAvatarCreation}
             options={emojiAvatarCreationOptions}
           />
           <Profile.Screen
             name={EditPasswordRouteName}
             component={EditPassword}
             options={editPasswordOptions}
           />
           <Profile.Screen
             name={DeleteAccountRouteName}
             component={DeleteAccount}
             options={deleteAccountOptions}
           />
           <Profile.Screen
             name={LinkedDevicesRouteName}
             component={LinkedDevices}
             options={linkedDevicesOptions}
           />
           <Profile.Screen
             name={KeyserverSelectionListRouteName}
             component={KeyserverSelectionList}
             options={keyserverSelectionListOptions}
           />
           <Profile.Screen
             name={AddKeyserverRouteName}
             component={AddKeyserver}
             options={addKeyserverOptions}
           />
           <Profile.Screen
             name={BackupMenuRouteName}
             component={BackupMenu}
             options={backupMenuOptions}
           />
+          <Profile.Screen
+            name={TunnelbrokerMenuRouteName}
+            component={TunnelbrokerMenu}
+            options={tunnelbrokerMenuOptions}
+          />
           <Profile.Screen
             name={SecondaryDeviceQRCodeScannerRouteName}
             component={SecondaryDeviceQRCodeScanner}
             options={secondaryDeviceQRCodeScannerOptions}
           />
           <Profile.Screen
             name={BuildInfoRouteName}
             component={BuildInfo}
             options={buildInfoOptions}
           />
           <Profile.Screen
             name={DevToolsRouteName}
             component={DevTools}
             options={devToolsOptions}
           />
           <Profile.Screen
             name={AppearancePreferencesRouteName}
             component={AppearancePreferences}
             options={appearanceOptions}
           />
           <Profile.Screen
             name={PrivacyPreferencesRouteName}
             component={PrivacyPreferences}
             options={privacyOptions}
           />
           <Profile.Screen
             name={DefaultNotificationsPreferencesRouteName}
             component={DefaultNotificationsPreferences}
             options={defaultNotificationsOptions}
           />
           <Profile.Screen
             name={FriendListRouteName}
             component={RelationshipList}
             options={friendListOptions}
           />
           <Profile.Screen
             name={BlockListRouteName}
             component={RelationshipList}
             options={blockListOptions}
           />
         </Profile.Navigator>
       </KeyboardAvoidingView>
     </View>
   );
 }
 
 const unboundStyles = {
   keyboardAvoidingView: {
     flex: 1,
   },
   view: {
     flex: 1,
     backgroundColor: 'panelBackground',
   },
 };
 
 export default ProfileComponent;
diff --git a/native/profile/tunnelbroker-menu.react.js b/native/profile/tunnelbroker-menu.react.js
new file mode 100644
index 000000000..0bc731545
--- /dev/null
+++ b/native/profile/tunnelbroker-menu.react.js
@@ -0,0 +1,150 @@
+// @flow
+
+import * as React from 'react';
+import { useState } from 'react';
+import { Text, View } from 'react-native';
+import { ScrollView } from 'react-native-gesture-handler';
+
+import { useTunnelbroker } from 'lib/tunnelbroker/tunnelbroker-context.js';
+import type { TunnelbrokerMessage } from 'lib/types/tunnelbroker/messages.js';
+
+import Button from '../components/button.react.js';
+import TextInput from '../components/text-input.react.js';
+import { useColors, useStyles } from '../themes/colors.js';
+
+// eslint-disable-next-line no-unused-vars
+function TunnelbrokerMenu(props: { ... }): React.Node {
+  const styles = useStyles(unboundStyles);
+  const colors = useColors();
+
+  const { connected, addListener, sendMessage, removeListener } =
+    useTunnelbroker();
+  const [messages, setMessages] = useState<TunnelbrokerMessage[]>([]);
+  const [recipient, setRecipient] = useState('');
+
+  const [message, setMessage] = useState('');
+
+  const listener = React.useCallback((msg: TunnelbrokerMessage) => {
+    setMessages(prev => [...prev, msg]);
+  }, []);
+
+  React.useEffect(() => {
+    addListener(listener);
+    return () => removeListener(listener);
+  }, [addListener, listener, removeListener]);
+
+  const onSubmit = React.useCallback(async () => {
+    try {
+      await sendMessage({ deviceID: recipient, payload: message });
+    } catch (e) {
+      console.error(e.message);
+    }
+  }, [message, recipient, sendMessage]);
+
+  return (
+    <ScrollView
+      contentContainerStyle={styles.scrollViewContentContainer}
+      style={styles.scrollView}
+    >
+      <Text style={styles.header}>INFO</Text>
+      <View style={styles.section}>
+        <View style={styles.submenuButton}>
+          <Text style={styles.submenuText}>Connected</Text>
+          <Text style={styles.text}>{connected.toString()}</Text>
+        </View>
+      </View>
+
+      <Text style={styles.header}>SEND MESSAGE</Text>
+
+      <View style={styles.section}>
+        <View style={styles.submenuButton}>
+          <Text style={styles.submenuText}>Recipient</Text>
+          <TextInput
+            style={styles.textInput}
+            value={recipient}
+            onChangeText={setRecipient}
+          />
+        </View>
+        <View style={styles.submenuButton}>
+          <Text style={styles.submenuText}>Message</Text>
+          <TextInput
+            style={styles.textInput}
+            value={message}
+            onChangeText={setMessage}
+          />
+        </View>
+        <Button
+          onPress={onSubmit}
+          style={styles.row}
+          iosFormat="highlight"
+          iosHighlightUnderlayColor={colors.panelIosHighlightUnderlay}
+          iosActiveOpacity={0.85}
+        >
+          <Text style={styles.submenuText}>Send Message</Text>
+        </Button>
+      </View>
+
+      <Text style={styles.header}>MESSAGES</Text>
+      {messages.map(msg => (
+        <View key={msg.messageID} style={styles.section}>
+          <Text style={styles.submenuText}>{JSON.stringify(msg)}</Text>
+        </View>
+      ))}
+    </ScrollView>
+  );
+}
+
+const unboundStyles = {
+  scrollViewContentContainer: {
+    paddingTop: 24,
+  },
+  scrollView: {
+    backgroundColor: 'panelBackground',
+  },
+  section: {
+    backgroundColor: 'panelForeground',
+    borderBottomWidth: 1,
+    borderColor: 'panelForegroundBorder',
+    borderTopWidth: 1,
+    marginBottom: 24,
+    marginVertical: 2,
+  },
+  header: {
+    color: 'panelBackgroundLabel',
+    fontSize: 12,
+    fontWeight: '400',
+    paddingBottom: 3,
+    paddingHorizontal: 24,
+  },
+  submenuButton: {
+    flexDirection: 'row',
+    paddingHorizontal: 24,
+    paddingVertical: 10,
+    alignItems: 'center',
+  },
+  submenuText: {
+    color: 'panelForegroundLabel',
+    flex: 1,
+    fontSize: 16,
+  },
+  text: {
+    color: 'panelForegroundLabel',
+    fontSize: 16,
+  },
+  row: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    paddingHorizontal: 24,
+    paddingVertical: 14,
+  },
+  textInput: {
+    color: 'modalBackgroundLabel',
+    flex: 1,
+    fontSize: 16,
+    margin: 0,
+    padding: 0,
+    borderBottomColor: 'transparent',
+  },
+};
+
+export default TunnelbrokerMenu;