react-native-navigation 8.1.0-alpha01 → 8.1.0-rc01-snapshot.1685

package/autolink/postlink/__snapshots__/appDelegateLinker.test.js.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`appDelegateLinker should work for RN 0.68 1`] = `
-"#import \\"AppDelegate.h\\"
+"#import "AppDelegate.h"
 #import <ReactNativeNavigation/ReactNativeNavigation.h>
 
 #import <React/RCTBridge.h>
@@ -40,7 +40,7 @@ exports[`appDelegateLinker should work for RN 0.68 1`] = `
 #if RCT_NEW_ARCH_ENABLED
   _contextContainer = std::make_shared<facebook::react::ContextContainer const>();
   _reactNativeConfig = std::make_shared<facebook::react::EmptyReactNativeConfig const>();
-  _contextContainer->insert(\\"ReactNativeConfig\\", _reactNativeConfig);
+  _contextContainer->insert("ReactNativeConfig", _reactNativeConfig);
   _bridgeAdapter = [[RCTSurfacePresenterBridgeAdapter alloc] initWithBridge:bridge contextContainer:_contextContainer];
   bridge.surfacePresenter = _bridgeAdapter.surfacePresenter;
 #endif
@@ -55,9 +55,9 @@ exports[`appDelegateLinker should work for RN 0.68 1`] = `
 - (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
 {
 #if DEBUG
-  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@\\"index\\"];
+  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
 #else
-  return [[NSBundle mainBundle] URLForResource:@\\"main\\" withExtension:@\\"jsbundle\\"];
+  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
 #endif
 }
 
@@ -105,7 +105,7 @@ exports[`appDelegateLinker should work for RN 0.68 1`] = `
 `;
 
 exports[`appDelegateLinker should work for RN 0.69 1`] = `
-"#import \\"AppDelegate.h\\"
+"#import "AppDelegate.h"
 #import <ReactNativeNavigation/ReactNativeNavigation.h>
 
 #import <React/RCTBridge.h>
@@ -123,7 +123,7 @@ exports[`appDelegateLinker should work for RN 0.69 1`] = `
 
 #import <react/config/ReactNativeConfig.h>
 
-static NSString *const kRNConcurrentRoot = @\\"concurrentRoot\\";
+static NSString *const kRNConcurrentRoot = @"concurrentRoot";
 
 @interface AppDelegate () <RCTCxxBridgeDelegate, RCTTurboModuleManagerDelegate> {
   RCTTurboModuleManager *_turboModuleManager;
@@ -146,7 +146,7 @@ static NSString *const kRNConcurrentRoot = @\\"concurrentRoot\\";
 #if RCT_NEW_ARCH_ENABLED
   _contextContainer = std::make_shared<facebook::react::ContextContainer const>();
   _reactNativeConfig = std::make_shared<facebook::react::EmptyReactNativeConfig const>();
-  _contextContainer->insert(\\"ReactNativeConfig\\", _reactNativeConfig);
+  _contextContainer->insert("ReactNativeConfig", _reactNativeConfig);
   _bridgeAdapter = [[RCTSurfacePresenterBridgeAdapter alloc] initWithBridge:bridge contextContainer:_contextContainer];
   bridge.surfacePresenter = _bridgeAdapter.surfacePresenter;
 #endif
@@ -183,9 +183,9 @@ static NSString *const kRNConcurrentRoot = @\\"concurrentRoot\\";
 - (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
 {
 #if DEBUG
-  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@\\"index\\"];
+  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
 #else
-  return [[NSBundle mainBundle] URLForResource:@\\"main\\" withExtension:@\\"jsbundle\\"];
+  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
 #endif
 }
 
@@ -233,7 +233,7 @@ static NSString *const kRNConcurrentRoot = @\\"concurrentRoot\\";
 `;
 
 exports[`appDelegateLinker should work for RN 0.71 1`] = `
-"#import \\"AppDelegate.h\\"
+"#import "AppDelegate.h"
 #import <ReactNativeNavigation/ReactNativeNavigation.h>
 
 #import <React/RCTBundleURLProvider.h>
@@ -249,9 +249,9 @@ exports[`appDelegateLinker should work for RN 0.71 1`] = `
 - (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
 {
 #if DEBUG
-  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@\\"index\\"];
+  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
 #else
-  return [[NSBundle mainBundle] URLForResource:@\\"main\\" withExtension:@\\"jsbundle\\"];
+  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
 #endif
 }
 

package/index.e2e.js

@@ -1,4 +1,5 @@
+import "setimmediate";
 import { LogBox } from 'react-native';
-LogBox.ignoreAllLogs();
 
+LogBox.ignoreAllLogs();
 require('./playground/index');

package/lib/Mock/Components/ComponentScreen.tsx

@@ -25,7 +25,8 @@ export const ComponentScreen = connect(
     }
 
     isVisible(): boolean {
-      return LayoutStore.isVisibleLayout(this.props.layoutNode);
+      const isVisible = LayoutStore.isVisibleLayout(this.props.layoutNode);
+      return isVisible;
     }
 
     renderTabBar() {

package/lib/Mock/Components/LayoutComponent.tsx

@@ -4,6 +4,7 @@ import { BottomTabs } from './BottomTabs';
 import { ComponentProps } from '../ComponentProps';
 import { ComponentScreen } from './ComponentScreen';
 import { Stack } from './Stack';
+import { SideMenuRoot, SideMenuCenter, SideMenuLeft, SideMenuRight } from './SideMenu';
 
 export const LayoutComponent = class extends Component<ComponentProps> {
   render() {
@@ -14,6 +15,14 @@ export const LayoutComponent = class extends Component<ComponentProps> {
         return <Stack layoutNode={this.props.layoutNode} />;
       case 'Component':
         return <ComponentScreen layoutNode={this.props.layoutNode} />;
+      case 'SideMenuRoot':
+        return <SideMenuRoot layoutNode={this.props.layoutNode} />;
+      case 'SideMenuLeft':
+        return <SideMenuLeft layoutNode={this.props.layoutNode} />;
+      case 'SideMenuCenter':
+        return <SideMenuCenter layoutNode={this.props.layoutNode} />;
+      case 'SideMenuRight':
+        return <SideMenuRight layoutNode={this.props.layoutNode} />;
     }
 
     return <View />;

package/lib/Mock/Components/SideMenu.tsx

@@ -0,0 +1,27 @@
+import React, { Component } from 'react';
+import { connect } from '../connect';
+import { ComponentProps } from '../ComponentProps';
+import { LayoutComponent } from './LayoutComponent';
+import ParentNode from '../Layouts/ParentNode';
+
+export const SideMenuRoot = connect(
+  class extends Component<ComponentProps> {
+    render() {
+      const children = this.props.layoutNode.children;
+      return children.map((child: ParentNode) => {
+        return <LayoutComponent key={child.nodeId} layoutNode={child} />;
+      });
+    }
+  }
+);
+
+class SideMenuComponent extends Component<ComponentProps> {
+  render() {
+    const children = this.props.layoutNode.children;
+    const component = children[0];
+    return <LayoutComponent key={component.nodeId} layoutNode={component} />;
+  }
+}
+export const SideMenuLeft = connect(SideMenuComponent);
+export const SideMenuCenter = connect(SideMenuComponent);
+export const SideMenuRight = connect(SideMenuComponent);

package/lib/Mock/Layouts/BottomTabsNode.ts

@@ -10,8 +10,10 @@ export default class BottomTabsNode extends ParentNode {
     this.selectedIndex = layout.data?.options?.bottomTabs?.currentTabIndex || 0;
   }
 
-  mergeOptions(options: Options) {
-    super.mergeOptions(options);
+  mergeOptions(_options: Options) {
+    super.mergeOptions(_options);
+
+    const { options } = this.data;
     if (options.bottomTabs?.currentTabIndex) {
       this.selectedIndex = options.bottomTabs?.currentTabIndex;
       switchTabByIndex(this, this.selectedIndex);

package/lib/Mock/Layouts/LayoutNodeFactory.ts

@@ -2,6 +2,11 @@ import BottomTabs from './BottomTabsNode';
 import ComponentNode from './ComponentNode';
 import Stack from './StackNode';
 import ParentNode from './ParentNode';
+import SideMenuRootNode, {
+  SideMenuLeftNode,
+  SideMenuRightNode,
+  SideMenuCenterNode,
+} from './SideMenu';
 
 export default class LayoutNodeFactory {
   static create(layout: any, parentNode?: ParentNode) {
@@ -10,7 +15,15 @@ export default class LayoutNodeFactory {
         return new ComponentNode(layout, parentNode);
       case 'Stack':
         return new Stack(layout, parentNode);
-      default:
+      case 'SideMenuRoot':
+        return new SideMenuRootNode(layout, parentNode);
+      case 'SideMenuLeft':
+        return new SideMenuLeftNode(layout, parentNode);
+      case 'SideMenuCenter':
+        return new SideMenuCenterNode(layout, parentNode);
+      case 'SideMenuRight':
+        return new SideMenuRightNode(layout, parentNode);
+      default: // TODO Undo
       case 'BottomTabs':
         return new BottomTabs(layout, parentNode);
     }

package/lib/Mock/Layouts/ParentNode.ts

@@ -35,6 +35,10 @@ export default class ParentNode extends Node {
     return this;
   }
 
+  applyOptions(_options: Options) {
+    this.parentNode?.applyOptions(_options);
+  }
+
   mergeOptions(options: Options) {
     this.data.options = _.mergeWith(this.data.options, options, (objValue, srcValue, key) => {
       if (_.isArray(objValue)) {

package/lib/Mock/Layouts/SideMenu.ts

@@ -0,0 +1,87 @@
+import ParentNode from './ParentNode';
+import ComponentNode from './ComponentNode';
+import { Options } from '../../src/index';
+import * as layoutActions from '../actions/layoutActions';
+import { NodeType } from './Node';
+
+const isCenterChild = (child: ParentNode) => child.type === 'SideMenuCenter';
+const isLeftChild = (child: ParentNode) => child.type === 'SideMenuLeft';
+const isRightChild = (child: ParentNode) => child.type === 'SideMenuRight';
+
+export default class SideMenuRootNode extends ParentNode {
+  visibleChild: ParentNode;
+
+  constructor(layout: any, parentNode?: ParentNode) {
+    super(layout, 'SideMenuRoot', parentNode);
+
+    this.visibleChild = this._getCenterChild();
+    if (!this.visibleChild) {
+      throw new Error('SideMenuRootNode must have a SideMenuCenter child');
+    }
+  }
+
+  applyOptions(_options: Options) {
+    super.applyOptions(_options);
+
+    this._updateVisibility(_options);
+  }
+
+  mergeOptions(options: Options) {
+    super.mergeOptions(options);
+
+    this._updateVisibility(options);
+  }
+
+  /**
+   * @override
+   */
+  getVisibleLayout(): ComponentNode {
+    return this.visibleChild.getVisibleLayout();
+  }
+
+  _updateVisibility(options: Options) {
+    if (options.sideMenu) {
+      if (options.sideMenu.left?.visible) {
+        this.visibleChild = this._getLeftChild();
+        layoutActions.openSideMenu(this.visibleChild);
+      } else if (options.sideMenu.right?.visible) {
+        this.visibleChild = this._getRightChild();
+        layoutActions.openSideMenu(this.visibleChild);
+      } else {
+        this.visibleChild = this._getCenterChild();
+        layoutActions.closeSideMenu(this.visibleChild);
+      }
+    }
+  }
+
+  _getCenterChild = () => this.children.find(isCenterChild) as ParentNode;
+  _getLeftChild = () => this.children.find(isLeftChild) as ParentNode;
+  _getRightChild = () => this.children.find(isRightChild) as ParentNode;
+}
+
+export class SideMenuNode extends ParentNode {
+  constructor(layout: any, type: NodeType, parentNode?: ParentNode) {
+    super(layout, type, parentNode);
+  }
+
+  getVisibleLayout() {
+    return this.children[0].getVisibleLayout();
+  }
+}
+
+export class SideMenuLeftNode extends SideMenuNode {
+  constructor(layout: any, parentNode?: ParentNode) {
+    super(layout, 'SideMenuLeft', parentNode);
+  }
+}
+export class SideMenuRightNode extends SideMenuNode {
+  constructor(layout: any, parentNode?: ParentNode) {
+    super(layout, 'SideMenuRight', parentNode);
+  }
+}
+
+export class SideMenuCenterNode extends SideMenuNode {
+  constructor(layout: any, parentNode?: ParentNode) {
+    super(layout, 'SideMenuCenter', parentNode);
+  }
+}

package/lib/Mock/Stores/LayoutStore.ts

@@ -2,8 +2,9 @@ import _ from 'lodash';
 import BottomTabsNode from '../Layouts/BottomTabsNode';
 import ParentNode from '../Layouts/ParentNode';
 import LayoutNodeFactory from '../Layouts/LayoutNodeFactory';
-import { Options } from '../../src/interfaces/Options';
+import { SideMenuNode } from '../Layouts/SideMenu';
 import StackNode from '../Layouts/StackNode';
+import { Options } from '../../src/interfaces/Options';
 
 const remx = require('remx');
 
@@ -11,6 +12,7 @@ const state = remx.state({
   root: {},
   modals: [],
   overlays: [],
+  sideMenu: undefined,
 });
 
 const setters = remx.setters({
@@ -75,6 +77,23 @@ const setters = remx.setters({
   selectTabIndex(layout: BottomTabsNode, index: number) {
     getters.getLayoutById(layout.nodeId).selectedIndex = index;
   },
+  openSideMenu(layout: SideMenuNode) {
+    if (state.sideMenu) {
+      throw new Error(
+        'A side-menu is already open; Mocked-testing of multiple side-menu scenarios is not supported yet.' +
+          ' You can submit a request in https://github.com/wix/react-native-navigation/issues/new/choose.'
+      );
+    }
+    state.sideMenu = layout;
+  },
+  closeSideMenu(_layout: SideMenuNode) {
+    state.sideMenu = undefined;
+  },
+  applyOptions(componentId: string, options: Options) {
+    const layout = getters.getLayoutById(componentId);
+    if (layout) layout.applyOptions(options);
+    else console.warn(`[RNN error] Merge options failure: cannot find layout for: ${componentId}`);
+  },
   mergeOptions(componentId: string, options: Options) {
     const layout = getters.getLayoutById(componentId);
     if (layout) layout.mergeOptions(options);
@@ -87,12 +106,26 @@ const getters = remx.getters({
     return state.root;
   },
   getVisibleLayout() {
+    let layout: ParentNode | undefined;
     if (state.modals.length > 0) {
-      return _.last<ParentNode>(state.modals)!.getVisibleLayout();
-    } else if (!_.isEqual(state.root, {})) return state.root.getVisibleLayout();
+      layout = _.last<ParentNode>(state.modals)!;
+    } else if (!_.isEqual(state.root, {})) {
+      layout = state.root;
+    }
+
+    // Note: While this logic should be fair for all use cases (i.e. even multiple side-menus across tabs),
+    // there is no current test case that justifies it. Nevertheless, it's required to pass the tests,
+    // because otherwise getVisibleLayout() would not be revisited whenever side-menus are opened/closed.
+    if (layout && state.sideMenu && findNode(state.sideMenu.nodeId, layout!)) {
+      layout = state.sideMenu.parentNode;
+    }
+
+    return layout?.getVisibleLayout();
   },
   isVisibleLayout(layout: ParentNode) {
-    return getters.getVisibleLayout() && getters.getVisibleLayout().nodeId === layout.nodeId;
+    const nodeId = layout.nodeId;
+    const visibleLayout = getters.getVisibleLayout();
+    return visibleLayout?.nodeId === nodeId;
   },
   getModals() {
     return state.modals;
@@ -101,13 +134,12 @@ const getters = remx.getters({
     return state.overlays;
   },
   getLayoutById(layoutId: string) {
-    if (getters.getModalById(layoutId))
-      return findParentNode(layoutId, getters.getModalById(layoutId));
+    if (getters.getModalById(layoutId)) return findNode(layoutId, getters.getModalById(layoutId));
 
-    return findParentNode(layoutId, state.root);
+    return findNode(layoutId, state.root);
   },
   getModalById(layoutId: string) {
-    return _.find(state.modals, (layout) => findParentNode(layoutId, layout));
+    return _.find(state.modals, (layout) => findNode(layoutId, layout));
   },
   getLayoutChildren(layoutId: string) {
     return getters.getLayoutById(layoutId).children;
@@ -120,13 +152,13 @@ const getters = remx.getters({
   },
 });
 
-function findParentNode(layoutId: string, layout: ParentNode): any | ParentNode {
+function findNode(layoutId: string, layout: ParentNode): any | ParentNode {
   if (layoutId === layout.nodeId) {
     return layout;
   } else if (layout.children) {
     for (let i = 0; i < layout.children.length; i += 1) {
       const child = layout.children[i];
-      const result = findParentNode(layoutId, child);
+      const result = findNode(layoutId, child);
 
       if (result !== false) {
         return result;

package/lib/Mock/actions/layoutActions.ts

@@ -1,4 +1,5 @@
 import ParentNode from '../Layouts/ParentNode';
+import { SideMenuNode } from '../Layouts/SideMenu';
 import { LayoutStore } from '../Stores/LayoutStore';
 
 export const switchTabByIndex = (bottomTabs: ParentNode | undefined, index: number) => {
@@ -8,3 +9,13 @@ export const switchTabByIndex = (bottomTabs: ParentNode | undefined, index: numb
     LayoutStore.getVisibleLayout().componentDidAppear();
   }
 };
+
+export const openSideMenu = (sideMenu: SideMenuNode) => {
+  LayoutStore.openSideMenu(sideMenu);
+  LayoutStore.getVisibleLayout().componentDidAppear();
+};
+
+export const closeSideMenu = (layout: SideMenuNode) => {
+  LayoutStore.getVisibleLayout().componentDidDisappear();
+  LayoutStore.closeSideMenu(layout);
+};

package/lib/Mock/mocks/NativeCommandsSender.tsx

@@ -39,6 +39,7 @@ export class NativeCommandsSender {
       const layoutNode = LayoutNodeFactory.create(layout, stack);
       stack.getVisibleLayout().componentDidDisappear();
       LayoutStore.push(layoutNode, stack);
+      LayoutStore.applyOptions(layoutNode.nodeId, layoutNode.data.options);
       stack.getVisibleLayout().componentDidAppear();
       resolve(stack.getVisibleLayout().nodeId);
       this.reportCommandCompletion(CommandName.Push, commandId);

package/lib/android/app/build.gradle

@@ -3,28 +3,39 @@ import org.gradle.api.tasks.testing.logging.TestExceptionFormat
 
 apply plugin: 'com.android.library'
 apply plugin: 'kotlin-android'
+apply plugin: "com.facebook.react"
+
+
+react {
+    jsRootDir = file("../../src/")
+    libraryName = "rnnavigation"
+    codegenJavaPackageName = "com.reactnativenavigation.react"
+}
+
 
 def safeExtGet(prop, fallback) {
     rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback
 }
 
 def safeExtGetFallbackLowerBound(prop, fallback) {
-    Math.max(safeExtGet(prop,fallback),fallback)
+    Math.max(safeExtGet(prop, fallback), fallback)
 }
 
-def DEFAULT_COMPILE_SDK_VERSION = 33
-def DEFAULT_MIN_SDK_VERSION = 21
-def DEFAULT_TARGET_SDK_VERSION = 33
+def DEFAULT_COMPILE_SDK_VERSION = 35
+def DEFAULT_MIN_SDK_VERSION = 24
+def DEFAULT_TARGET_SDK_VERSION = 35
 def DEFAULT_KOTLIN_VERSION = "1.5.31"
 def DEFAULT_KOTLIN_STDLIB = 'kotlin-stdlib-jdk8'
+def DEFAULT_BUILD_TOOLS_VERSION = "35.0.0"
 def kotlinVersion = safeExtGet("RNNKotlinVersion", DEFAULT_KOTLIN_VERSION)
-def kotlinStdlib = safeExtGet('RNNKotlinStdlib',DEFAULT_KOTLIN_STDLIB )
+def kotlinStdlib = safeExtGet('RNNKotlinStdlib', DEFAULT_KOTLIN_STDLIB)
 def kotlinCoroutinesCore = safeExtGet('RNNKotlinCoroutinesCore', '1.5.2')
+def _buildToolsVersion = safeExtGet('buildToolsVersion', DEFAULT_BUILD_TOOLS_VERSION)
 
 android {
     namespace 'com.reactnativenavigation'
     compileSdkVersion safeExtGetFallbackLowerBound('compileSdkVersion', DEFAULT_COMPILE_SDK_VERSION)
-    buildToolsVersion = "34.0.0"
+    buildToolsVersion = _buildToolsVersion
     defaultConfig {
         minSdkVersion safeExtGetFallbackLowerBound('minSdkVersion', DEFAULT_MIN_SDK_VERSION)
         targetSdkVersion safeExtGetFallbackLowerBound('targetSdkVersion', DEFAULT_TARGET_SDK_VERSION)
@@ -64,126 +75,12 @@ android {
         }
     }
     compileOptions {
-        if (reactNativeMinorVersion() >= 73) {
-            sourceCompatibility JavaVersion.VERSION_17
-            targetCompatibility JavaVersion.VERSION_17
-        } else {
-            sourceCompatibility JavaVersion.VERSION_1_8
-            targetCompatibility JavaVersion.VERSION_1_8
-        }
+        sourceCompatibility JavaVersion.VERSION_17
+        targetCompatibility JavaVersion.VERSION_17
     }
     kotlinOptions {
-        if (reactNativeMinorVersion() >= 73) {
-            jvmTarget = JavaVersion.VERSION_17
-        } else {
-            jvmTarget = JavaVersion.VERSION_11
-        }
+        jvmTarget = JavaVersion.VERSION_17
     }
-
-    flavorDimensions "RNN.reactNativeVersion"
-    productFlavors {
-        reactNative51 {
-            dimension "RNN.reactNativeVersion"
-            buildConfigField("int", "REACT_NATVE_VERSION_MINOR", "51")
-        }
-        reactNative55 {
-            dimension "RNN.reactNativeVersion"
-            buildConfigField("int", "REACT_NATVE_VERSION_MINOR", "55")
-        }
-        reactNative56 {
-            dimension "RNN.reactNativeVersion"
-            buildConfigField("int", "REACT_NATVE_VERSION_MINOR", "56")
-        }
-        reactNative57 {
-            dimension "RNN.reactNativeVersion"
-            buildConfigField("int", "REACT_NATVE_VERSION_MINOR", "57")
-        }
-        reactNative57_5 {
-            dimension "RNN.reactNativeVersion"
-            buildConfigField("int", "REACT_NATVE_VERSION_MINOR", "57")
-        }
-        reactNative60 {
-            dimension "RNN.reactNativeVersion"
-            buildConfigField("int", "REACT_NATVE_VERSION_MINOR", "60")
-        }
-        reactNative62 {
-            dimension "RNN.reactNativeVersion"
-            buildConfigField("int", "REACT_NATVE_VERSION_MINOR", "62")
-        }
-        reactNative63 {
-            dimension "RNN.reactNativeVersion"
-            buildConfigField("int", "REACT_NATVE_VERSION_MINOR", "63")
-        }
-        reactNative68 {
-            dimension "RNN.reactNativeVersion"
-            buildConfigField("int", "REACT_NATVE_VERSION_MINOR", "68")
-        }
-        reactNative71 {
-            dimension "RNN.reactNativeVersion"
-            buildConfigField("int", "REACT_NATVE_VERSION_MINOR", "71")
-        }
-    }
-
-    def flavor = resolveFlavor()
-    variantFilter { variant ->
-        def names = variant.flavors*.name
-        if (!names.contains(flavor)) {
-            setIgnore(true)
-        }
-    }
-}
-
-int reactNativeMinorVersion() {
-    List reactNativeVersionComponents = reactNativeVersionComponents(findReactNativePackageJson())
-    reactNativeVersionComponents[1].toInteger()
-}
-
-String resolveFlavor() {
-    List reactNativeVersionComponents = reactNativeVersionComponents(findReactNativePackageJson())
-    Integer reactNativeMinorComponent = reactNativeVersionComponents[1].toInteger()
-    Integer reactNativePatchComponent = reactNativeVersionComponents[2].toInteger()
-
-    if (reactNativeMinorComponent >= 71) {
-        return "reactNative71"
-    } else if (reactNativeMinorComponent >= 68) {
-        return "reactNative68"
-    } else if (reactNativeMinorComponent >= 63) {
-        return "reactNative63"
-    } else if (reactNativeMinorComponent >= 62) {
-        return "reactNative62"
-    } else if (reactNativeMinorComponent >= 60) {
-        return "reactNative60"
-    } else if (reactNativeMinorComponent >= 57 && reactNativePatchComponent >= 5) {
-        return "reactNative57_5"
-    } else if (reactNativeMinorComponent >= 57) {
-        return "reactNative57"
-    } else if (reactNativeMinorComponent >= 56) {
-        return "reactNative56"
-    } else if (reactNativeMinorComponent >= 55) {
-        return "reactNative55"
-    } else if (reactNativeMinorComponent >= 51) {
-        return "reactNative51"
-    }
-}
-
-
-Object findReactNativePackageJson() {
-    def searchPath = 'node_modules/react-native/package.json'
-    def projectDir = project.projectDir.toString() + '/'
-    def rnPackageJsonFile = new File(projectDir + searchPath)
-    while (!rnPackageJsonFile.exists()) {
-        searchPath = '../' + searchPath
-        rnPackageJsonFile = new File(projectDir + searchPath)
-    }
-    return rnPackageJsonFile
-}
-
-List reactNativeVersionComponents(rnPackageJsonFile) {
-    def packageSlurper = new JsonSlurper()
-    def reactNativePackageJson = packageSlurper.parseText(rnPackageJsonFile.text)
-    def reactNativeVersion = reactNativePackageJson.version
-
-    return reactNativeVersion.tokenize('-')[0].tokenize('.')
 }
 
 dependencies {
@@ -193,7 +90,7 @@ dependencies {
     implementation "org.jetbrains.kotlinx:kotlinx-coroutines-android:$kotlinCoroutinesCore"
     implementation "androidx.constraintlayout:constraintlayout:2.0.4"
 
-    implementation 'androidx.appcompat:appcompat:1.3.1'
+    implementation 'androidx.appcompat:appcompat:1.7.0'
     implementation 'androidx.annotation:annotation:1.2.0'
     implementation 'com.google.android.material:material:1.2.0-alpha03'
 
@@ -205,7 +102,7 @@ dependencies {
     //noinspection GradleDynamicVersion
     implementation 'com.facebook.react:react-native:+'
 
-    if("Playground".toLowerCase() == rootProject.name.toLowerCase()){
+    if ("Playground".toLowerCase() == rootProject.name.toLowerCase()) {
         // tests only for our playground
         testImplementation 'junit:junit:4.13.2'
         testImplementation "org.robolectric:robolectric:4.7.2"

package/lib/android/app/src/main/java/com/reactnativenavigation/FeatureToggles.kt

@@ -3,11 +3,13 @@ package com.reactnativenavigation
 import androidx.annotation.VisibleForTesting
 
 enum class RNNToggles {
-    TOP_BAR_COLOR_ANIMATION,
+    TOP_BAR_COLOR_ANIMATION__PUSH,
+    TOP_BAR_COLOR_ANIMATION__TABS,
 }
 
 private val ToggleDefaults = mapOf(
-    RNNToggles.TOP_BAR_COLOR_ANIMATION to false
+    RNNToggles.TOP_BAR_COLOR_ANIMATION__PUSH to false,
+    RNNToggles.TOP_BAR_COLOR_ANIMATION__TABS to false,
 )
 
 object RNNFeatureToggles {

package/lib/android/app/src/main/java/com/reactnativenavigation/NavigationActivity.java

@@ -3,7 +3,6 @@ package com.reactnativenavigation;
 import android.annotation.TargetApi;
 import android.content.Intent;
 import android.content.res.Configuration;
-import android.graphics.Color;
 import android.os.Build;
 import android.os.Bundle;
 import android.view.KeyEvent;
@@ -12,8 +11,8 @@ import android.view.View;
 import com.facebook.react.modules.core.DefaultHardwareBackBtnHandler;
 import com.facebook.react.modules.core.PermissionAwareActivity;
 import com.facebook.react.modules.core.PermissionListener;
-import com.reactnativenavigation.options.Options;
 import com.reactnativenavigation.viewcontrollers.overlay.OverlayManager;
+import com.reactnativenavigation.viewcontrollers.statusbar.StatusBarPresenter;
 import com.reactnativenavigation.viewcontrollers.viewcontroller.RootPresenter;
 import com.reactnativenavigation.react.JsDevReloadHandler;
 import com.reactnativenavigation.react.ReactGateway;
@@ -51,6 +50,7 @@ public class NavigationActivity extends AppCompatActivity implements DefaultHard
         navigator.bindViews();
         getReactGateway().onActivityCreated(this);
         setBackPressedCallback();
+        StatusBarPresenter.Companion.init(this);
     }
 
     @Override