feat: add the 'drawerPress' event (#9529)

react-navigation · Nov 27, 2022 · 46d52ca · 46d52ca
1 parent a98c5fe
commit 46d52ca
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 9 deletions.
diff --git a/packages/drawer/src/types.tsx b/packages/drawer/src/types.tsx
@@ -247,7 +247,12 @@ export type DrawerHeaderProps = {
   navigation: DrawerNavigationProp<ParamListBase>;
 };
 
-export type DrawerNavigationEventMap = {};
+export type DrawerNavigationEventMap = {
+  /**
+   * Event which fires on tapping on the item in the drawer menu.
+   */
+  drawerPress: { data: undefined; canPreventDefault: true };
+};
 
 export type DrawerNavigationHelpers = NavigationHelpers<
   ParamListBase,

diff --git a/packages/drawer/src/views/DrawerItemList.tsx b/packages/drawer/src/views/DrawerItemList.tsx
@@ -39,6 +39,24 @@ export default function DrawerItemList({
 
   return state.routes.map((route, i) => {
     const focused = i === state.index;
+
+    const onPress = () => {
+      const event = navigation.emit({
+        type: 'drawerPress',
+        target: route.key,
+        canPreventDefault: true,
+      });
+
+      if (!event.defaultPrevented) {
+        navigation.dispatch({
+          ...(focused
+            ? DrawerActions.closeDrawer()
+            : CommonActions.navigate({ name: route.name, merge: true })),
+          target: state.key,
+        });
+      }
+    };
+
     const {
       title,
       drawerLabel,
@@ -68,14 +86,7 @@ export default function DrawerItemList({
         labelStyle={drawerLabelStyle}
         style={drawerItemStyle}
         to={buildLink(route.name, route.params)}
-        onPress={() => {
-          navigation.dispatch({
-            ...(focused
-              ? DrawerActions.closeDrawer()
-              : CommonActions.navigate({ name: route.name, merge: true })),
-            target: state.key,
-          });
-        }}
+        onPress={onPress}
       />
     );
   }) as React.ReactNode as React.ReactElement;