Fix showing Modal from TopBar components in RN 62 (#6199)

When showing React Native's Modal from a TopBar component - RNN mistakingly considered Modals as yellow boxes and removed them. Apparently this error surfaced in RN62

lib/android/app/src/main/java/com/reactnativenavigation/utils/ViewUtils.java

@@ -43,7 +43,7 @@ public class ViewUtils {
         for (int i = 0; i < root.getChildCount(); i++) {
             View view = root.getChildAt(i);
             if (view instanceof ViewGroup) {
-                ret.addAll(findChildrenByClassRecursive((ViewGroup) view, clazz));
+                ret.addAll(findChildrenByClassRecursive((ViewGroup) view, clazz, matcher));
             }
             if (clazz.isAssignableFrom(view.getClass()) && matcher.match((T) view)) {
                 ret.add((T) view);

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/ChildController.java

@@ -24,7 +24,7 @@ public abstract class ChildController<T extends ViewGroup> extends ViewControlle
     }
 
     public ChildController(Activity activity, ChildControllersRegistry childRegistry, String id, Presenter presenter, Options initialOptions) {
-        super(activity, id, new NoOpYellowBoxDelegate(), initialOptions, new ViewControllerOverlay(activity));
+        super(activity, id, new NoOpYellowBoxDelegate(activity), initialOptions, new ViewControllerOverlay(activity));
         this.presenter = presenter;
         this.childRegistry = childRegistry;
     }

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/NoOpYellowBoxDelegate.java

@@ -1,10 +0,0 @@
-package com.reactnativenavigation.viewcontrollers;
-
-import android.view.View;
-
-public class NoOpYellowBoxDelegate extends YellowBoxDelegate {
-    @Override
-    public void onChildViewAdded(View parent, View child) {
-
-    }
-}

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/NoOpYellowBoxDelegate.kt

@@ -0,0 +1,8 @@
+package com.reactnativenavigation.viewcontrollers
+
+import android.content.Context
+import android.view.View
+
+class NoOpYellowBoxDelegate(context: Context) : YellowBoxDelegate(context) {
+    override fun onChildViewAdded(parent: View, child: View?) {}
+}

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/TitleBarButtonController.java

@@ -67,7 +67,7 @@ public class TitleBarButtonController extends ViewController<TitleBarReactButton
                                     Button button,
                                     TitleBarButtonCreator viewCreator,
                                     OnClickListener onClickListener) {
-        super(activity, button.id, new YellowBoxDelegate(), new Options(), new ViewControllerOverlay(activity));
+        super(activity, button.id, new YellowBoxDelegate(activity), new Options(), new ViewControllerOverlay(activity));
         this.navigationIconResolver = navigationIconResolver;
         this.presenter = presenter;
         this.button = button;

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/TitleBarReactViewController.java

@@ -20,7 +20,7 @@ public class TitleBarReactViewController extends ViewController<TitleBarReactVie
     }
 
     public TitleBarReactViewController(Activity activity, TitleBarReactViewCreator reactViewCreator, Component component) {
-        super(activity, CompatUtils.generateViewId() + "", new YellowBoxDelegate(), new Options(), new ViewControllerOverlay(activity));
+        super(activity, CompatUtils.generateViewId() + "", new YellowBoxDelegate(activity), new Options(), new ViewControllerOverlay(activity));
         this.reactViewCreator = reactViewCreator;
         this.component = component;
     }

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/YellowBoxDelegate.java

@@ -1,63 +0,0 @@
-package com.reactnativenavigation.viewcontrollers;
-
-import androidx.annotation.RestrictTo;
-import android.view.View;
-import android.view.ViewGroup;
-
-import com.reactnativenavigation.utils.UiUtils;
-
-import java.util.ArrayList;
-import java.util.List;
-
-public class YellowBoxDelegate {
-    private ViewGroup parent;
-    private YellowBoxHelper yellowBoxHelper;
-    private boolean isDestroyed;
-    private ArrayList<View> yellowBoxViews = new ArrayList<>();
-
-    public YellowBoxDelegate() {
-        this.yellowBoxHelper = new YellowBoxHelper();
-    }
-
-    YellowBoxDelegate(YellowBoxHelper yellowBoxHelper) {
-        this.yellowBoxHelper = yellowBoxHelper;
-    }
-
-    public void onChildViewAdded(View parent, View child) {
-        UiUtils.runOnPreDrawOnce(child, () -> {
-            if (yellowBoxHelper.isYellowBox(parent, child)) {
-                onYellowBoxAdded(parent);
-            }
-        });
-    }
-
-    void onYellowBoxAdded(View parent) {
-        if (isDestroyed) return;
-        this.parent = (ViewGroup) parent;
-
-        for (int i = 1; i < this.parent.getChildCount(); i++) {
-            yellowBoxViews.add(this.parent.getChildAt(i));
-            this.parent.removeView(this.parent.getChildAt(i));
-            this.parent.addView(new View(parent.getContext()), i);
-        }
-    }
-
-    public void destroy() {
-        isDestroyed = true;
-        if (!yellowBoxViews.isEmpty()) {
-            for (View view : yellowBoxViews) {
-                parent.addView(view);
-            }
-        }
-    }
-
-    @RestrictTo(RestrictTo.Scope.TESTS)
-    public ViewGroup getParent() {
-        return parent;
-    }
-
-    @RestrictTo(RestrictTo.Scope.TESTS)
-    public List<View> getYellowBoxes() {
-        return yellowBoxViews;
-    }
-}

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/YellowBoxDelegate.kt

@@ -0,0 +1,45 @@
+package com.reactnativenavigation.viewcontrollers
+
+import android.content.Context
+import android.view.View
+import android.view.ViewGroup
+import androidx.annotation.RestrictTo
+import androidx.core.view.doOnPreDraw
+import androidx.core.view.forEachIndexed
+import androidx.core.view.get
+import com.reactnativenavigation.utils.isDebug
+import java.util.*
+
+open class YellowBoxDelegate(private val context: Context, private val yellowBoxHelper: YellowBoxHelper = YellowBoxHelper()) {
+    constructor(context: Context) : this(context, YellowBoxHelper())
+
+    @get:RestrictTo(RestrictTo.Scope.TESTS)
+    var parent: ViewGroup? = null
+        private set
+    @get:RestrictTo(RestrictTo.Scope.TESTS)
+    val yellowBoxes: List<View>
+        get() = yellowBoxViews
+
+    private var isDestroyed = false
+    private val yellowBoxViews = ArrayList<View>()
+
+    open fun onChildViewAdded(parent: View, child: View?) {
+        if (!context.isDebug()) return
+        child?.doOnPreDraw { if (yellowBoxHelper.isYellowBox(parent, child)) onYellowBoxAdded(parent) }
+    }
+
+    fun onYellowBoxAdded(parent: View) {
+        if (isDestroyed) return
+        this.parent = parent as ViewGroup
+        for (i in 1 until parent.childCount) {
+            yellowBoxViews.add(parent[i])
+            parent.removeView(parent[i])
+            parent.addView(View(context), i)
+        }
+    }
+
+    fun destroy() {
+        isDestroyed = true
+        if (yellowBoxViews.isNotEmpty()) yellowBoxViews.forEach { parent?.addView(it) }
+    }
+}

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/YellowBoxHelper.java

@@ -1,24 +1,27 @@
 package com.reactnativenavigation.viewcontrollers;
 
-import androidx.annotation.NonNull;
 import android.view.View;
 import android.view.ViewGroup;
 
 import com.facebook.react.views.view.ReactViewBackgroundDrawable;
 import com.reactnativenavigation.utils.ViewUtils;
 
-class YellowBoxHelper {
+import androidx.annotation.NonNull;
+
+import static com.reactnativenavigation.utils.ViewUtils.findChildrenByClassRecursive;
+
+public class YellowBoxHelper {
     private final static int YELLOW_BOX_COLOR = -218449360;
 
     boolean isYellowBox(View parent, View child) {
         return parent instanceof ViewGroup &&
                child instanceof ViewGroup &&
                ((ViewGroup) parent).getChildCount() > 1 &&
-               !ViewUtils.findChildrenByClassRecursive((ViewGroup) child, View.class, YellowBackgroundMather((ViewGroup) child)).isEmpty();
+               !findChildrenByClassRecursive((ViewGroup) child, View.class, YellowBackgroundMather()).isEmpty();
     }
 
     @NonNull
-    private static ViewUtils.Matcher<View> YellowBackgroundMather(ViewGroup vg) {
+    private static ViewUtils.Matcher<View> YellowBackgroundMather() {
         return child1 -> child1.getBackground() instanceof ReactViewBackgroundDrawable && ((ReactViewBackgroundDrawable) child1.getBackground()).getColor() == YELLOW_BOX_COLOR;
     }
 }

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/topbar/TopBarBackgroundViewController.java

@@ -18,7 +18,7 @@ public class TopBarBackgroundViewController extends ViewController<TopBarBackgro
     private Component component;
 
     public TopBarBackgroundViewController(Activity activity, TopBarBackgroundViewCreator viewCreator) {
-        super(activity, CompatUtils.generateViewId() + "", new YellowBoxDelegate(), new Options(), new ViewControllerOverlay(activity));
+        super(activity, CompatUtils.generateViewId() + "", new YellowBoxDelegate(activity), new Options(), new ViewControllerOverlay(activity));
         this.viewCreator = viewCreator;
     }
 

lib/android/app/src/test/java/com/reactnativenavigation/TestApplication.java

@@ -2,10 +2,34 @@ package com.reactnativenavigation;
 
 import android.app.*;
 
-public class TestApplication extends Application {
+import com.facebook.react.ReactApplication;
+import com.facebook.react.ReactNativeHost;
+import com.facebook.react.ReactPackage;
+
+import java.util.Collections;
+import java.util.List;
+
+public class TestApplication extends Application implements ReactApplication {
+    private final ReactNativeHost host = new ReactNativeHost(this) {
+        @Override
+        public boolean getUseDeveloperSupport() {
+            return true;
+        }
+
+        @Override
+        protected List<ReactPackage> getPackages() {
+            return Collections.emptyList();
+        }
+    };
+
     @Override
     public void onCreate() {
         super.onCreate();
         setTheme(R.style.Theme_AppCompat);
     }
+
+    @Override
+    public ReactNativeHost getReactNativeHost() {
+        return host;
+    }
 }

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/ViewControllerTest.java

@@ -65,7 +65,7 @@ public class ViewControllerTest extends BaseTest {
     @Test
     public void canOverrideViewCreation() {
         final FrameLayout otherView = new FrameLayout(activity);
-        yellowBoxDelegate = spy(new YellowBoxDelegate());
+        yellowBoxDelegate = spy(new YellowBoxDelegate(activity));
         ViewController myController = new ViewController(activity, "vc", yellowBoxDelegate, new Options(), new ViewControllerOverlay(activity)) {
             @Override
             protected FrameLayout createView() {

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/YellowBoxDelegateTest.java

@@ -25,7 +25,7 @@ public class YellowBoxDelegateTest extends BaseTest {
         yellowBox = new View(context);
         parent = new FrameLayout(context);
         yellowBoxHelper = Mockito.mock(YellowBoxHelper.class);
-        uut = new YellowBoxDelegate(yellowBoxHelper);
+        uut = new YellowBoxDelegate(context, yellowBoxHelper);
         parent.addView(new View(context)); // We assume view at index 0 is not a yellow box
         parent.addView(yellowBox);
     }