From ef7370b21585193bfc02ef03eddbf43f8c291151 Mon Sep 17 00:00:00 2001
From: Satyajit Sahoo <satyajit.happy@gmail.com>
Date: Sun, 4 Apr 2021 06:52:31 +0200
Subject: [PATCH] chore: configure reanimated 2

---
 example/babel.config.js                  | 1 +
 packages/drawer/src/types.tsx            | 6 +++++-
 packages/drawer/src/views/DrawerView.tsx | 8 ++++++--
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/example/babel.config.js b/example/babel.config.js
index 9d89e131..d872de3f 100644
--- a/example/babel.config.js
+++ b/example/babel.config.js
@@ -2,5 +2,6 @@ module.exports = function (api) {
   api.cache(true);
   return {
     presets: ['babel-preset-expo'],
+    plugins: ['react-native-reanimated/plugin'],
   };
 };
diff --git a/packages/drawer/src/types.tsx b/packages/drawer/src/types.tsx
index 507ecb7b..36249aba 100644
--- a/packages/drawer/src/types.tsx
+++ b/packages/drawer/src/types.tsx
@@ -40,7 +40,11 @@ export type DrawerNavigationConfig = {
    * The new implementation based on Reanimated 2 will perform better,
    * but you need additional configuration and need to use Hermes with Flipper to debug.
    *
-   * Defaults to `false` if Reanimated 2 is configured in the project, otherwise `true`.
+   * This defaults to `true` in following cases:
+   * - Reanimated 2 is not configured
+   * - App is connected to Chrome debugger (Reanimated 2 cannot be used with Chrome debugger)
+   *
+   * Otherwise, it defaults to `false`
    */
   useLegacyImplementation?: boolean;
 };
diff --git a/packages/drawer/src/views/DrawerView.tsx b/packages/drawer/src/views/DrawerView.tsx
index 56680727..869a1eda 100644
--- a/packages/drawer/src/views/DrawerView.tsx
+++ b/packages/drawer/src/views/DrawerView.tsx
@@ -77,8 +77,12 @@ function DrawerViewBase({
     <DrawerContent {...props} />
   ),
   detachInactiveScreens = true,
-  // @ts-expect-error: the type definitions are incomplete
-  useLegacyImplementation = !Animated.isConfigured?.(),
+  // Running in chrome debugger
+  // @ts-expect-error
+  useLegacyImplementation = !global.nativeCallSyncHook ||
+    // Reanimated 2 is not configured
+    // @ts-expect-error: the type definitions are incomplete
+    !Animated.isConfigured?.(),
 }: Props) {
   const Drawer: React.ComponentType<DrawerProps> = useLegacyImplementation
     ? require('./legacy/Drawer').default