diff --git a/native/navigation/community-drawer-content.react.js b/native/navigation/community-drawer-content.react.js
index 2a0008daa3..224598d3dd 100644
--- a/native/navigation/community-drawer-content.react.js
+++ b/native/navigation/community-drawer-content.react.js
@@ -25,6 +25,7 @@ import { useResolvedThreadInfos } from 'lib/utils/entity-helpers.js';
import { useDispatchActionPromise } from 'lib/utils/redux-promise-utils.js';
import CommunityDrawerItem from './community-drawer-item.react.js';
+import { showCommunityDirectory } from './root-navigator.react.js';
import { CommunityCreationRouteName } from './route-names.js';
import { useNavigateToThread } from '../chat/message-list-types.js';
import SWMansionIcon from '../components/swmansion-icon.react.js';
@@ -169,6 +170,24 @@ function CommunityDrawerContent(): React.Node {
);
+ let exploreCommunitiesButton;
+ if (showCommunityDirectory) {
+ exploreCommunitiesButton = (
+
+
+
+
+
+ Explore communities
+
+
+ );
+ }
+
const flattenedDrawerItemsData = React.useMemo(
() => flattenDrawerItemsData(drawerItemsData, [...expanded.values()]),
[drawerItemsData, expanded],
@@ -182,6 +201,7 @@ function CommunityDrawerContent(): React.Node {
initialNumToRender={30}
/>
{communityCreationButton}
+ {exploreCommunitiesButton}
);
}
@@ -195,7 +215,7 @@ const unboundStyles = {
},
communityCreationContainer: {
flexDirection: 'row',
- padding: 24,
+ padding: 16,
alignItems: 'center',
borderTopWidth: 1,
borderColor: 'panelSeparator',
@@ -218,6 +238,30 @@ const unboundStyles = {
communityCreationIcon: {
color: 'panelForegroundLabel',
},
+ exploreCommunitiesContainer: {
+ flexDirection: 'row',
+ paddingTop: 0,
+ padding: 16,
+ alignItems: 'center',
+ },
+ exploreCommunitiesText: {
+ color: 'panelForegroundLabel',
+ fontSize: 16,
+ lineHeight: 24,
+ fontWeight: '500',
+ },
+ exploreCommunitiesIconContainer: {
+ height: 28,
+ width: 28,
+ justifyContent: 'center',
+ alignItems: 'center',
+ borderRadius: 16,
+ marginRight: 12,
+ backgroundColor: 'panelSecondaryForeground',
+ },
+ exploreCommunitiesIcon: {
+ color: 'panelForegroundLabel',
+ },
};
const labelUnboundStyles = {
level0Label: {
diff --git a/native/navigation/root-navigator.react.js b/native/navigation/root-navigator.react.js
index d1a2b1792e..e03f63c654 100644
--- a/native/navigation/root-navigator.react.js
+++ b/native/navigation/root-navigator.react.js
@@ -82,6 +82,8 @@ import LinkedDevicesBottomSheet from '../profile/linked-devices-bottom-sheet.rea
import RolesNavigator from '../roles/roles-navigator.react.js';
import UserProfileBottomSheetNavigator from '../user-profile/user-profile-bottom-sheet-navigator.react.js';
+export const showCommunityDirectory = __DEV__;
+
enableScreens();
export type RootNavigationHelpers = {