From b7782fb57ce7d560ee64d99351ba62321bc9227d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Osadnik?= Date: Wed, 3 Jul 2019 02:09:50 -0700 Subject: [PATCH] Add codegen to AndroidDrawer Summary: Using Ricky's last changes I managed to subscribe for both new and old event name. Fixed event to proper one for codegen in native code. Reviewed By: TheSavior Differential Revision: D16065660 fbshipit-source-id: b5d3762d673a34bbdf5a8e60ff4d51617c8adb81 --- .../AndroidDrawerLayoutNativeComponent.js | 67 ++++++++----------- .../DrawerLayoutAndroid.android.js | 6 +- .../__snapshots__/DrawerAndroid-test.js.snap | 2 - .../drawer/events/DrawerClosedEvent.java | 2 +- .../drawer/events/DrawerOpenedEvent.java | 2 +- 5 files changed, 33 insertions(+), 46 deletions(-) diff --git a/Libraries/Components/DrawerAndroid/AndroidDrawerLayoutNativeComponent.js b/Libraries/Components/DrawerAndroid/AndroidDrawerLayoutNativeComponent.js index 177bec501ee..231c2051f0b 100644 --- a/Libraries/Components/DrawerAndroid/AndroidDrawerLayoutNativeComponent.js +++ b/Libraries/Components/DrawerAndroid/AndroidDrawerLayoutNativeComponent.js @@ -10,36 +10,33 @@ 'use strict'; -const requireNativeComponent = require('../../ReactNative/requireNativeComponent'); - -import type {NativeComponent} from '../../Renderer/shims/ReactNative'; -import type {SyntheticEvent} from '../../Types/CoreEventTypes'; -import type {ViewStyleProp} from '../../StyleSheet/StyleSheet'; -import type {Element, Node} from 'react'; +import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent'; +import type {ViewProps} from 'react-native/Libraries/Components/View/ViewPropTypes'; +import type { + WithDefault, + DirectEventHandler, + Int32, + Float, +} from 'react-native/Libraries/Types/CodegenTypes'; type ColorValue = null | string; -type DrawerStates = 'Idle' | 'Dragging' | 'Settling'; +type DrawerStateEvent = $ReadOnly<{| + drawerState: Int32, +|}>; -type DrawerStateEvent = SyntheticEvent< - $ReadOnly<{| - drawerState: number, - |}>, ->; - -type DrawerSlideEvent = SyntheticEvent< - $ReadOnly<{| - offset: number, - |}>, ->; +type DrawerSlideEvent = $ReadOnly<{| + offset: Float, +|}>; type NativeProps = $ReadOnly<{| + ...ViewProps, /** * Determines whether the keyboard gets dismissed in response to a drag. * - 'none' (the default), drags do not dismiss the keyboard. * - 'on-drag', the keyboard is dismissed when a drag begins. */ - keyboardDismissMode?: ?('none' | 'on-drag'), + keyboardDismissMode?: WithDefault<'none' | 'on-drag', 'none'>, /** * Specifies the background color of the drawer. The default value is white. @@ -57,13 +54,14 @@ type NativeProps = $ReadOnly<{| /** * Specifies the side of the screen from which the drawer will slide in. */ - drawerPosition: ?number, + drawerPosition: ?Int32, /** * Specifies the width of the drawer, more precisely the width of the view that be pulled in * from the edge of the window. */ - drawerWidth?: ?number, + + drawerWidth?: ?Float, /** * Specifies the lock mode of the drawer. The drawer can be locked in 3 states: @@ -72,12 +70,15 @@ type NativeProps = $ReadOnly<{| * - locked-open, meaning that the drawer will stay opened and not respond to gestures. * The drawer may still be opened and closed programmatically (`openDrawer`/`closeDrawer`). */ - drawerLockMode?: ?('unlocked' | 'locked-closed' | 'locked-open'), + drawerLockMode?: WithDefault< + 'unlocked' | 'locked-closed' | 'locked-open', + 'unlocked', + >, /** * Function called whenever there is an interaction with the navigation view. */ - onDrawerSlide?: ?(event: DrawerSlideEvent) => mixed, + onDrawerSlide?: ?DirectEventHandler, /** * Function called when the drawer state has changed. The drawer can be in 3 states: @@ -86,22 +87,17 @@ type NativeProps = $ReadOnly<{| * - Settling, meaning that there was an interaction with the navigation view, and the * navigation view is now finishing its closing or opening animation */ - onDrawerStateChanged?: ?(state: DrawerStateEvent) => mixed, + onDrawerStateChanged?: ?DirectEventHandler, /** * Function called whenever the navigation view has been opened. */ - onDrawerOpen?: ?() => mixed, + onDrawerOpen?: ?DirectEventHandler, /** * Function called whenever the navigation view has been closed. */ - onDrawerClose?: ?() => mixed, - - /** - * The navigation view that will be rendered to the side of the screen and can be pulled in. - */ - renderNavigationView: () => Element, + onDrawerClose?: ?DirectEventHandler, /** * Make the drawer take the entire screen and draw the background of the @@ -109,13 +105,6 @@ type NativeProps = $ReadOnly<{| * effect on API 21+. */ statusBarBackgroundColor?: ?ColorValue, - - children?: Node, - style?: ?ViewStyleProp, |}>; -type AndroidDrawerLayoutNativeType = Class>; - -module.exports = ((requireNativeComponent( - 'AndroidDrawerLayout', -): any): AndroidDrawerLayoutNativeType); +export default codegenNativeComponent('AndroidDrawerLayout'); diff --git a/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js b/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js index b7d2419a2ab..31dcf36dc93 100644 --- a/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js +++ b/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js @@ -22,7 +22,7 @@ const nullthrows = require('nullthrows'); const DrawerConsts = UIManager.getViewManagerConfig('AndroidDrawerLayout') .Constants; const dismissKeyboard = require('../../Utilities/dismissKeyboard'); -const AndroidDrawerLayoutNativeComponent = require('./AndroidDrawerLayoutNativeComponent'); +import AndroidDrawerLayoutNativeComponent from './AndroidDrawerLayoutNativeComponent'; const DRAWER_STATES = ['Idle', 'Dragging', 'Settling']; @@ -176,7 +176,7 @@ class DrawerLayoutAndroid extends React.Component { state = {statusBarBackgroundColor: null}; render() { - const {onDrawerStateChanged, ...props} = this.props; + const {onDrawerStateChanged, renderNavigationView, ...props} = this.props; const drawStatusBar = Platform.Version >= 21 && this.props.statusBarBackgroundColor; const drawerViewWrapper = ( @@ -189,7 +189,7 @@ class DrawerLayoutAndroid extends React.Component { }, ]} collapsable={false}> - {this.props.renderNavigationView()} + {renderNavigationView()} {drawStatusBar && } ); diff --git a/Libraries/Components/DrawerAndroid/__tests__/__snapshots__/DrawerAndroid-test.js.snap b/Libraries/Components/DrawerAndroid/__tests__/__snapshots__/DrawerAndroid-test.js.snap index 7c52a480737..f647438e3a1 100644 --- a/Libraries/Components/DrawerAndroid/__tests__/__snapshots__/DrawerAndroid-test.js.snap +++ b/Libraries/Components/DrawerAndroid/__tests__/__snapshots__/DrawerAndroid-test.js.snap @@ -9,7 +9,6 @@ exports[` should render as when moc onDrawerOpen={[Function]} onDrawerSlide={[Function]} onDrawerStateChanged={[Function]} - renderNavigationView={[Function]} style={ Array [ Object { @@ -62,7 +61,6 @@ exports[` should render as when not onDrawerOpen={[Function]} onDrawerSlide={[Function]} onDrawerStateChanged={[Function]} - renderNavigationView={[Function]} style={ Array [ Object { diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/drawer/events/DrawerClosedEvent.java b/ReactAndroid/src/main/java/com/facebook/react/views/drawer/events/DrawerClosedEvent.java index 4b02dc7bf1d..126e5ab4221 100644 --- a/ReactAndroid/src/main/java/com/facebook/react/views/drawer/events/DrawerClosedEvent.java +++ b/ReactAndroid/src/main/java/com/facebook/react/views/drawer/events/DrawerClosedEvent.java @@ -12,7 +12,7 @@ import com.facebook.react.uimanager.events.RCTEventEmitter; public class DrawerClosedEvent extends Event { - public static final String EVENT_NAME = "topDrawerClosed"; + public static final String EVENT_NAME = "topDrawerClose"; public DrawerClosedEvent(int viewId) { super(viewId); diff --git a/ReactAndroid/src/main/java/com/facebook/react/views/drawer/events/DrawerOpenedEvent.java b/ReactAndroid/src/main/java/com/facebook/react/views/drawer/events/DrawerOpenedEvent.java index 56dfbe23f29..5023117f4b5 100644 --- a/ReactAndroid/src/main/java/com/facebook/react/views/drawer/events/DrawerOpenedEvent.java +++ b/ReactAndroid/src/main/java/com/facebook/react/views/drawer/events/DrawerOpenedEvent.java @@ -12,7 +12,7 @@ import com.facebook.react.uimanager.events.RCTEventEmitter; public class DrawerOpenedEvent extends Event { - public static final String EVENT_NAME = "topDrawerOpened"; + public static final String EVENT_NAME = "topDrawerOpen"; public DrawerOpenedEvent(int viewId) { super(viewId);