diff --git a/native/bottom-sheets/user-profile-bottom-sheet.react.js b/native/bottom-sheets/user-profile-bottom-sheet.react.js
new file mode 100644
--- /dev/null
+++ b/native/bottom-sheets/user-profile-bottom-sheet.react.js
@@ -0,0 +1,52 @@
+// @flow
+
+import * as React from 'react';
+
+import type { AccountUserInfo } from 'lib/types/user-types.js';
+
+import BottomSheet from './bottom-sheet.react.js';
+import UserProfile from '../components/user-profile.react.js';
+import type { RootNavigationProp } from '../navigation/root-navigator.react.js';
+import type { NavigationRoute } from '../navigation/route-names.js';
+
+export type UserProfileBottomSheetParams = {
+ +userInfo: AccountUserInfo,
+};
+
+type Props = {
+ +navigation: RootNavigationProp<'UserProfileBottomSheet'>,
+ +route: NavigationRoute<'UserProfileBottomSheet'>,
+};
+
+function UserProfileBottomSheet(props: Props): React.Node {
+ const {
+ navigation,
+ route: {
+ params: { userInfo },
+ },
+ } = props;
+
+ const { goBackOnce } = navigation;
+
+ const bottomSheetRef = React.useRef();
+
+ React.useEffect(() => {
+ if (!bottomSheetRef.current) {
+ return;
+ }
+
+ bottomSheetRef.current.present();
+ }, []);
+
+ const onClosed = React.useCallback(() => {
+ goBackOnce();
+ }, [goBackOnce]);
+
+ return (
+
+
+
+ );
+}
+
+export default UserProfileBottomSheet;
diff --git a/native/navigation/root-navigator.react.js b/native/navigation/root-navigator.react.js
--- a/native/navigation/root-navigator.react.js
+++ b/native/navigation/root-navigator.react.js
@@ -45,10 +45,12 @@
CommunityCreationRouteName,
RolesNavigatorRouteName,
QRCodeSignInNavigatorRouteName,
+ UserProfileBottomSheetRouteName,
} from './route-names.js';
import LoggedOutModal from '../account/logged-out-modal.react.js';
import RegistrationNavigator from '../account/registration/registration-navigator.react.js';
import TermsAndPrivacyModal from '../account/terms-and-privacy-modal.react.js';
+import UserProfileBottomSheet from '../bottom-sheets/user-profile-bottom-sheet.react.js';
import ThreadPickerModal from '../calendar/thread-picker-modal.react.js';
import ImagePasteModal from '../chat/image-paste-modal.react.js';
import MessageReactionsModal from '../chat/message-reactions-modal.react.js';
@@ -278,6 +280,10 @@
options={modalOverlayScreenOptions}
/>
+
);
}
diff --git a/native/navigation/route-names.js b/native/navigation/route-names.js
--- a/native/navigation/route-names.js
+++ b/native/navigation/route-names.js
@@ -13,6 +13,7 @@
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 { UserProfileBottomSheetParams } from '../bottom-sheets/user-profile-bottom-sheet.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';
@@ -133,6 +134,7 @@
export const CreateRolesScreenRouteName = 'CreateRolesScreen';
export const QRCodeSignInNavigatorRouteName = 'QRCodeSignInNavigator';
export const QRCodeScreenRouteName = 'QRCodeScreen';
+export const UserProfileBottomSheetRouteName = 'UserProfileBottomSheet';
export type RootParamList = {
+LoggedOutModal: void,
@@ -153,6 +155,7 @@
+InviteLinkNavigator: void,
+RolesNavigator: void,
+QRCodeSignInNavigator: void,
+ +UserProfileBottomSheet: UserProfileBottomSheetParams,
};
export type MessageTooltipRouteNames =
@@ -261,6 +264,10 @@
+QRCodeScreen: void,
};
+export type BottomSheetParamList = {
+ +UserProfileBottomSheet: UserProfileBottomSheetParams,
+};
+
export type ScreenParamList = {
...RootParamList,
...OverlayParamList,
@@ -274,6 +281,7 @@
...CommunityCreationParamList,
...RolesParamList,
...QRCodeSignInParamList,
+ ...BottomSheetParamList,
};
export type NavigationRoute> =