Merge pull request #2629 from EdgeApp/william/enable-hooks

Add Flow type wrappers for the React hooks

src/modules/UI/components/Slider/Slider.js

@@ -1,7 +1,6 @@
 // @flow
 
-// $FlowFixMe
-import React, { useEffect, useState } from 'react'
+import * as React from 'react'
 import { ActivityIndicator, Image, StyleSheet, View } from 'react-native'
 import { PanGestureHandler } from 'react-native-gesture-handler'
 import Animated, { Easing, runOnJS, useAnimatedGestureHandler, useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated'
@@ -10,6 +9,7 @@ import leftArrowImg from '../../../../assets/images/slider/keyboard-arrow-left.p
 import { type Theme, type ThemeProps, cacheStyles, withTheme } from '../../../../components/services/ThemeContext.js'
 import { EdgeText } from '../../../../components/themed/EdgeText'
 import s from '../../../../locales/strings.js'
+import { useEffect, useState } from '../../../../util/hooks.js'
 
 const COMPLETE_POINT: number = 3
 

src/util/hooks.js

@@ -0,0 +1,60 @@
+// @flow
+
+import * as React from 'react'
+
+type SetState<S> = (value: S | ((state: S) => S)) => void
+
+type UseCallback = <T: (...args: any[]) => any>(callback: T, deps: any[]) => T
+
+type UseContext = <T>(context: React.Context<T>) => T
+
+type UseDebugValue = <T>(value: T, format?: (value: T) => any) => void
+
+type UseEffect = (effect: () => void | (() => void), deps?: any[]) => void
+
+type UseImperativeHandle = (ref: any, init: () => any, deps?: any[]) => void
+
+type UseMemo = <T>(init: () => T, deps?: any[]) => T
+
+type UseReducer = {
+  // Normal version:
+  <State, Action>(reducer: (state: State | void, action: Action) => State, init: State | void): [State, (action: Action) => void],
+
+  // Initializer version:
+  <State, Action, Init>(
+    reducer: (state: State | void, action: Action) => State,
+    init: Init,
+    initializer: (init: Init) => State
+  ): [State, (action: Action) => void]
+}
+
+type UseRef = {
+  // Component ref:
+  <ElementType: React$ElementType>(): { current: null | React$ElementRef<ElementType> },
+
+  // Value container:
+  <T>(init: T): { current: T }
+}
+
+type UseState = <S>(init: S | (() => S)) => [S, SetState<S>]
+
+// $FlowFixMe
+export const useCallback: UseCallback = React.useCallback
+// $FlowFixMe
+export const useContext: UseContext = React.useContext
+// $FlowFixMe
+export const useDebugValue: UseDebugValue = React.useDebugValue
+// $FlowFixMe
+export const useEffect: UseEffect = React.useEffect
+// $FlowFixMe
+export const useImperativeHandle: UseImperativeHandle = React.useImperativeHandle
+// $FlowFixMe
+export const useLayoutEffect: UseEffect = React.useLayoutEffect
+// $FlowFixMe
+export const useMemo: UseMemo = React.useMemo
+// $FlowFixMe
+export const useReducer: UseReducer = React.useReducer
+// $FlowFixMe
+export const useRef: UseRef = React.useRef
+// $FlowFixMe
+export const useState: UseState = React.useState