From 037e346197a3c7f99fa93dab68b5a1a94011f1ee Mon Sep 17 00:00:00 2001 From: Evan Yeung Date: Wed, 10 Nov 2021 15:38:09 -0800 Subject: [PATCH] Add LTI annotations to xplat/js Summary: This diff runs the codemod to add type annotations to function parameters in preparation for Flow's local type inference (LTI) project. I ran the codemod over xplat/js and reverted any files that had flow errors in them. See the list of commands run to see the regeneration of various files. Changelog: [Internal][Changed] - Added type annotations Reviewed By: yungsters Differential Revision: D32075270 fbshipit-source-id: 6a9cd85aab120b4d9e690bac142a415525dbf298 --- Libraries/Animated/SpringConfig.js | 20 ++++++------ Libraries/Animated/bezier.js | 27 +++++++++++----- Libraries/Animated/createAnimatedComponent.js | 6 ++-- .../Animated/nodes/AnimatedInterpolation.js | 4 +-- Libraries/Animated/nodes/AnimatedStyle.js | 4 +-- Libraries/BugReporting/getReactData.js | 19 ++++++++--- .../DatePicker/DatePickerIOS.ios.js | 18 ++++++++++- .../Keyboard/KeyboardAvoidingView.js | 4 +-- .../Keyboard/__tests__/Keyboard-test.js | 13 ++++++-- .../ScrollView/ScrollViewStickyHeader.js | 2 +- Libraries/Core/ReactNativeVersionCheck.js | 11 ++++++- Libraries/Core/setUpBatchedBridge.js | 16 ++++++++-- Libraries/Core/setUpErrorHandling.js | 2 +- Libraries/Core/setUpTimers.js | 12 ++++++- Libraries/Inspector/Inspector.js | 2 +- .../__tests__/VirtualizedSectionList-test.js | 4 ++- Libraries/LogBox/LogBox.js | 6 ++-- Libraries/LogBox/UI/LogBoxInspector.js | 4 ++- .../LogBox/UI/LogBoxInspectorReactFrames.js | 2 +- .../LogBox/UI/LogBoxInspectorStackFrame.js | 2 +- .../LogBox/UI/LogBoxInspectorStackFrames.js | 4 ++- Libraries/LogBox/UI/LogBoxMessage.js | 8 +++-- Libraries/Performance/Systrace.js | 9 +++++- .../getCachedComponentWithDebugName.js | 4 ++- Libraries/StyleSheet/processTransform.js | 21 +++++++++++- .../Utilities/__tests__/useRefEffect-test.js | 15 ++++++++- .../deepFreezeAndThrowOnMutationInDev.js | 4 +-- Libraries/Utilities/useWindowDimensions.js | 6 +++- .../verifyComponentAttributeEquivalence.js | 2 +- .../cli/combine/combine-js-to-schema-cli.js | 2 +- .../src/generators/components/JavaHelpers.js | 12 ++++++- .../header/serializeConstantsStruct.js | 2 +- .../modules/GenerateModuleObjCpp/index.js | 3 +- .../src/parsers/flow/components/commands.js | 2 +- .../src/parsers/flow/components/index.js | 8 ++++- .../src/parsers/flow/components/props.js | 17 ++++++---- .../src/parsers/flow/modules/errors.js | 2 +- .../js/components/RNTesterExampleFilter.js | 8 +++-- .../js/components/RNTesterModuleContainer.js | 7 ++-- .../js/components/RNTesterModuleList.js | 4 +-- .../rn-tester/js/components/RNTesterNavbar.js | 32 +++++++++++++++++-- .../Accessibility/AccessibilityExample.js | 4 ++- .../js/examples/Alert/AlertIOSExample.js | 4 +-- .../js/examples/Animated/ComposingExample.js | 21 +++++++++--- .../AnimatedGratuitousApp/AnExBobble.js | 2 +- .../AnimatedGratuitousApp/AnExChained.js | 5 ++- .../js/examples/AppState/AppStateExample.js | 4 ++- .../examples/FlatList/BaseFlatListExample.js | 3 +- .../js/examples/FlatList/FlatList-basic.js | 16 ++++++++-- .../examples/FlatList/FlatList-multiColumn.js | 8 +++-- .../ScrollViewPressableStickyHeaderExample.js | 2 +- .../examples/XHR/XHRExampleAbortController.js | 2 +- .../js/examples/XHR/XHRExampleDownload.js | 2 +- 53 files changed, 320 insertions(+), 103 deletions(-) diff --git a/Libraries/Animated/SpringConfig.js b/Libraries/Animated/SpringConfig.js index 5dd212ca110073..a1a00ec0c1a6e8 100644 --- a/Libraries/Animated/SpringConfig.js +++ b/Libraries/Animated/SpringConfig.js @@ -16,11 +16,11 @@ type SpringConfigType = { ... }; -function stiffnessFromOrigamiValue(oValue) { +function stiffnessFromOrigamiValue(oValue: number) { return (oValue - 30) * 3.62 + 194; } -function dampingFromOrigamiValue(oValue) { +function dampingFromOrigamiValue(oValue: number) { return (oValue - 8) * 3 + 25; } @@ -38,31 +38,31 @@ function fromBouncinessAndSpeed( bounciness: number, speed: number, ): SpringConfigType { - function normalize(value, startValue, endValue) { + function normalize(value: number, startValue: number, endValue: number) { return (value - startValue) / (endValue - startValue); } - function projectNormal(n, start, end) { + function projectNormal(n: number, start: number, end: number) { return start + n * (end - start); } - function linearInterpolation(t, start, end) { + function linearInterpolation(t: number, start: number, end: number) { return t * end + (1 - t) * start; } - function quadraticOutInterpolation(t, start, end) { + function quadraticOutInterpolation(t: number, start: number, end: number) { return linearInterpolation(2 * t - t * t, start, end); } - function b3Friction1(x) { + function b3Friction1(x: number) { return 0.0007 * Math.pow(x, 3) - 0.031 * Math.pow(x, 2) + 0.64 * x + 1.28; } - function b3Friction2(x) { + function b3Friction2(x: number) { return 0.000044 * Math.pow(x, 3) - 0.006 * Math.pow(x, 2) + 0.36 * x + 2; } - function b3Friction3(x) { + function b3Friction3(x: number) { return ( 0.00000045 * Math.pow(x, 3) - 0.000332 * Math.pow(x, 2) + @@ -71,7 +71,7 @@ function fromBouncinessAndSpeed( ); } - function b3Nobounce(tension) { + function b3Nobounce(tension: number) { if (tension <= 18) { return b3Friction1(tension); } else if (tension > 18 && tension <= 44) { diff --git a/Libraries/Animated/bezier.js b/Libraries/Animated/bezier.js index 0a53a33c744829..26c15718693fa1 100644 --- a/Libraries/Animated/bezier.js +++ b/Libraries/Animated/bezier.js @@ -27,27 +27,33 @@ const kSampleStepSize = 1.0 / (kSplineTableSize - 1.0); const float32ArraySupported = typeof Float32Array === 'function'; -function A(aA1, aA2) { +function A(aA1: number, aA2: number) { return 1.0 - 3.0 * aA2 + 3.0 * aA1; } -function B(aA1, aA2) { +function B(aA1: number, aA2: number) { return 3.0 * aA2 - 6.0 * aA1; } -function C(aA1) { +function C(aA1: number) { return 3.0 * aA1; } // Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2. -function calcBezier(aT, aA1, aA2) { +function calcBezier(aT: number, aA1: number, aA2: number) { return ((A(aA1, aA2) * aT + B(aA1, aA2)) * aT + C(aA1)) * aT; } // Returns dx/dt given t, x1, and x2, or dy/dt given t, y1, and y2. -function getSlope(aT, aA1, aA2) { +function getSlope(aT: number, aA1: number, aA2: number) { return 3.0 * A(aA1, aA2) * aT * aT + 2.0 * B(aA1, aA2) * aT + C(aA1); } -function binarySubdivide(aX, _aA, _aB, mX1, mX2) { +function binarySubdivide( + aX: number, + _aA: number, + _aB: number, + mX1: number, + mX2: number, +) { let currentX, currentT, i = 0, @@ -68,7 +74,12 @@ function binarySubdivide(aX, _aA, _aB, mX1, mX2) { return currentT; } -function newtonRaphsonIterate(aX, _aGuessT, mX1, mX2) { +function newtonRaphsonIterate( + aX: number, + _aGuessT: number, + mX1: number, + mX2: number, +) { let aGuessT = _aGuessT; for (let i = 0; i < NEWTON_ITERATIONS; ++i) { const currentSlope = getSlope(aGuessT, mX1, mX2); @@ -101,7 +112,7 @@ module.exports = function bezier( } } - function getTForX(aX) { + function getTForX(aX: number) { let intervalStart = 0.0; let currentSample = 1; const lastSample = kSplineTableSize - 1; diff --git a/Libraries/Animated/createAnimatedComponent.js b/Libraries/Animated/createAnimatedComponent.js index 5ab4073d02b31d..25fd72fb269196 100644 --- a/Libraries/Animated/createAnimatedComponent.js +++ b/Libraries/Animated/createAnimatedComponent.js @@ -168,7 +168,7 @@ function createAnimatedComponent( } }; - _attachProps(nextProps) { + _attachProps(nextProps: any) { const oldPropsAnimated = this._propsAnimated; this._propsAnimated = new AnimatedProps( @@ -234,12 +234,12 @@ function createAnimatedComponent( this._markUpdateComplete(); } - UNSAFE_componentWillReceiveProps(newProps) { + UNSAFE_componentWillReceiveProps(newProps: any) { this._waitForUpdate(); this._attachProps(newProps); } - componentDidUpdate(prevProps) { + componentDidUpdate(prevProps: any) { if (this._component !== this._prevComponent) { this._propsAnimated.setNativeView(this._component); } diff --git a/Libraries/Animated/nodes/AnimatedInterpolation.js b/Libraries/Animated/nodes/AnimatedInterpolation.js index ce06272b5c6d79..00a872c950aed8 100644 --- a/Libraries/Animated/nodes/AnimatedInterpolation.js +++ b/Libraries/Animated/nodes/AnimatedInterpolation.js @@ -30,7 +30,7 @@ export type InterpolationConfigType = { extrapolateRight?: ExtrapolateType, }; -const linear = t => t; +const linear = (t: number) => t; /** * Very handy helper to map input ranges to output ranges with an easing @@ -248,7 +248,7 @@ function createInterpolationFromStringOutputRange( }; } -function isRgbOrRgba(range) { +function isRgbOrRgba(range: string) { return typeof range === 'string' && range.startsWith('rgb'); } diff --git a/Libraries/Animated/nodes/AnimatedStyle.js b/Libraries/Animated/nodes/AnimatedStyle.js index 6ccd56263a799d..3db07f98179c1c 100644 --- a/Libraries/Animated/nodes/AnimatedStyle.js +++ b/Libraries/Animated/nodes/AnimatedStyle.js @@ -33,7 +33,7 @@ class AnimatedStyle extends AnimatedWithChildren { } // Recursively get values for nested styles (like iOS's shadowOffset) - _walkStyleAndGetValues(style) { + _walkStyleAndGetValues(style: any) { const updatedStyle = {}; for (const key in style) { const value = style[key]; @@ -58,7 +58,7 @@ class AnimatedStyle extends AnimatedWithChildren { } // Recursively get animated values for nested styles (like iOS's shadowOffset) - _walkStyleAndGetAnimatedValues(style) { + _walkStyleAndGetAnimatedValues(style: any) { const updatedStyle = {}; for (const key in style) { const value = style[key]; diff --git a/Libraries/BugReporting/getReactData.js b/Libraries/BugReporting/getReactData.js index c851f76f993f6a..7555422be91613 100644 --- a/Libraries/BugReporting/getReactData.js +++ b/Libraries/BugReporting/getReactData.js @@ -121,7 +121,11 @@ function getData(element: Object): Object { }; } -function setInProps(internalInst, path: Array, value: any) { +function setInProps( + internalInst: any, + path: Array, + value: any, +) { const element = internalInst._currentElement; internalInst._currentElement = { ...element, @@ -130,12 +134,12 @@ function setInProps(internalInst, path: Array, value: any) { internalInst._instance.forceUpdate(); } -function setInState(inst, path: Array, value: any) { +function setInState(inst: any, path: Array, value: any) { setIn(inst.state, path, value); inst.forceUpdate(); } -function setInContext(inst, path: Array, value: any) { +function setInContext(inst: any, path: Array, value: any) { setIn(inst.context, path, value); inst.forceUpdate(); } @@ -148,7 +152,7 @@ function setIn(obj: Object, path: Array, value: any) { } } -function childrenList(children) { +function childrenList(children: any) { const res = []; for (const name in children) { res.push(children[name]); @@ -156,7 +160,12 @@ function childrenList(children) { return res; } -function copyWithSetImpl(obj, path, idx, value) { +function copyWithSetImpl( + obj: any | Array, + path: Array, + idx: number, + value: any, +) { if (idx >= path.length) { return value; } diff --git a/Libraries/Components/DatePicker/DatePickerIOS.ios.js b/Libraries/Components/DatePicker/DatePickerIOS.ios.js index 8295e3aeded250..337ed8a77c7da4 100644 --- a/Libraries/Components/DatePicker/DatePickerIOS.ios.js +++ b/Libraries/Components/DatePicker/DatePickerIOS.ios.js @@ -205,7 +205,23 @@ const styles = StyleSheet.create({ }, }); -function getHeight(pickerStyle, mode) { +function getHeight( + pickerStyle: ?( + | 'compact' + | 'inline' + | 'spinner' + | $TEMPORARY$string<'compact'> + | $TEMPORARY$string<'inline'> + | $TEMPORARY$string<'spinner'> + ), + mode: + | 'date' + | 'datetime' + | 'time' + | $TEMPORARY$string<'date'> + | $TEMPORARY$string<'datetime'> + | $TEMPORARY$string<'time'>, +) { if (pickerStyle === 'compact') { return styles.datePickerIOSCompact; } diff --git a/Libraries/Components/Keyboard/KeyboardAvoidingView.js b/Libraries/Components/Keyboard/KeyboardAvoidingView.js index 26897f1632da1e..3de920aa843a5e 100644 --- a/Libraries/Components/Keyboard/KeyboardAvoidingView.js +++ b/Libraries/Components/Keyboard/KeyboardAvoidingView.js @@ -22,7 +22,7 @@ import type { ViewLayout, ViewLayoutEvent, } from '../View/ViewPropTypes'; -import type {KeyboardEvent} from './Keyboard'; +import type {KeyboardEvent, KeyboardEventCoordinates} from './Keyboard'; type Props = $ReadOnly<{| ...ViewProps, @@ -71,7 +71,7 @@ class KeyboardAvoidingView extends React.Component { this.viewRef = React.createRef(); } - _relativeKeyboardHeight(keyboardFrame): number { + _relativeKeyboardHeight(keyboardFrame: KeyboardEventCoordinates): number { const frame = this._frame; if (!frame || !keyboardFrame) { return 0; diff --git a/Libraries/Components/Keyboard/__tests__/Keyboard-test.js b/Libraries/Components/Keyboard/__tests__/Keyboard-test.js index 2c7befec418355..c0ce474cdea44c 100644 --- a/Libraries/Components/Keyboard/__tests__/Keyboard-test.js +++ b/Libraries/Components/Keyboard/__tests__/Keyboard-test.js @@ -27,7 +27,14 @@ describe('Keyboard', () => { }); describe('scheduling layout animation', () => { - const scheduleLayoutAnimation = (duration, easing): void => + const scheduleLayoutAnimation = ( + duration: null | number, + easing: + | null + | $TEMPORARY$string<'linear'> + | $TEMPORARY$string<'some-unknown-animation-type'> + | $TEMPORARY$string<'spring'>, + ): void => // $FlowFixMe[incompatible-call] Keyboard.scheduleLayoutAnimation({duration, easing}); @@ -53,7 +60,9 @@ describe('Keyboard', () => { }); describe('animation update type', () => { - const assertAnimationUpdateType = type => + const assertAnimationUpdateType = ( + type: $TEMPORARY$string<'keyboard'> | $TEMPORARY$string<'linear'>, + ) => expect(LayoutAnimation.configureNext).toHaveBeenCalledWith( expect.objectContaining({ duration: expect.anything(), diff --git a/Libraries/Components/ScrollView/ScrollViewStickyHeader.js b/Libraries/Components/ScrollView/ScrollViewStickyHeader.js index ea21ce221b757e..e56412b600e71a 100644 --- a/Libraries/Components/ScrollView/ScrollViewStickyHeader.js +++ b/Libraries/Components/ScrollView/ScrollViewStickyHeader.js @@ -149,7 +149,7 @@ class ScrollViewStickyHeader extends React.Component { ); } - _onLayout = event => { + _onLayout = (event: any) => { const layoutY = event.nativeEvent.layout.y; const layoutHeight = event.nativeEvent.layout.height; const measured = true; diff --git a/Libraries/Core/ReactNativeVersionCheck.js b/Libraries/Core/ReactNativeVersionCheck.js index 9536899f7dd25f..41ea4a16723f8c 100644 --- a/Libraries/Core/ReactNativeVersionCheck.js +++ b/Libraries/Core/ReactNativeVersionCheck.js @@ -38,7 +38,16 @@ exports.checkVersions = function checkVersions(): void { } }; -function _formatVersion(version): string { +function _formatVersion( + version: + | {major: number, minor: number, patch: number, prerelease: ?number} + | $TEMPORARY$object<{ + major: number, + minor: number, + patch: number, + prerelease: null, + }>, +): string { return ( `${version.major}.${version.minor}.${version.patch}` + // eslint-disable-next-line eqeqeq diff --git a/Libraries/Core/setUpBatchedBridge.js b/Libraries/Core/setUpBatchedBridge.js index 0f16dd84e74c54..b6d1ad38462198 100644 --- a/Libraries/Core/setUpBatchedBridge.js +++ b/Libraries/Core/setUpBatchedBridge.js @@ -15,8 +15,20 @@ if (global.RN$Bridgeless === true && global.RN$registerCallableModule) { registerModule = global.RN$registerCallableModule; } else { const BatchedBridge = require('../BatchedBridge/BatchedBridge'); - registerModule = (moduleName, factory) => - BatchedBridge.registerLazyCallableModule(moduleName, factory); + registerModule = ( + moduleName: + | $TEMPORARY$string<'GlobalPerformanceLogger'> + | $TEMPORARY$string<'HMRClient'> + | $TEMPORARY$string<'HeapCapture'> + | $TEMPORARY$string<'JSDevSupportModule'> + | $TEMPORARY$string<'JSTimers'> + | $TEMPORARY$string<'RCTDeviceEventEmitter'> + | $TEMPORARY$string<'RCTLog'> + | $TEMPORARY$string<'RCTNativeAppEventEmitter'> + | $TEMPORARY$string<'SamplingProfiler'> + | $TEMPORARY$string<'Systrace'>, + factory, + ) => BatchedBridge.registerLazyCallableModule(moduleName, factory); } registerModule('Systrace', () => require('../Performance/Systrace')); diff --git a/Libraries/Core/setUpErrorHandling.js b/Libraries/Core/setUpErrorHandling.js index 3ac9be0f878eec..70620c8a91f8a4 100644 --- a/Libraries/Core/setUpErrorHandling.js +++ b/Libraries/Core/setUpErrorHandling.js @@ -19,7 +19,7 @@ ExceptionsManager.installConsoleErrorReporter(); // Set up error handler if (!global.__fbDisableExceptionsManager) { - const handleError = (e, isFatal) => { + const handleError = (e: mixed, isFatal: boolean) => { try { ExceptionsManager.handleException(e, isFatal); } catch (ee) { diff --git a/Libraries/Core/setUpTimers.js b/Libraries/Core/setUpTimers.js index 7048b32c4fdf50..7efe8982e19ba5 100644 --- a/Libraries/Core/setUpTimers.js +++ b/Libraries/Core/setUpTimers.js @@ -33,7 +33,17 @@ if (global.RN$Bridgeless !== true) { * Set up timers. * You can use this module directly, or just require InitializeCore. */ - const defineLazyTimer = name => { + const defineLazyTimer = ( + name: + | $TEMPORARY$string<'cancelAnimationFrame'> + | $TEMPORARY$string<'cancelIdleCallback'> + | $TEMPORARY$string<'clearInterval'> + | $TEMPORARY$string<'clearTimeout'> + | $TEMPORARY$string<'requestAnimationFrame'> + | $TEMPORARY$string<'requestIdleCallback'> + | $TEMPORARY$string<'setInterval'> + | $TEMPORARY$string<'setTimeout'>, + ) => { polyfillGlobal(name, () => require('./Timers/JSTimers')[name]); }; defineLazyTimer('setTimeout'); diff --git a/Libraries/Inspector/Inspector.js b/Libraries/Inspector/Inspector.js index 3ed92c07e6eabe..fba75e0c9ed72f 100644 --- a/Libraries/Inspector/Inspector.js +++ b/Libraries/Inspector/Inspector.js @@ -167,7 +167,7 @@ class Inspector extends React.Component< }, 100); }; - _onAgentShowNativeHighlight = node => { + _onAgentShowNativeHighlight = (node: any) => { clearTimeout(this._hideTimeoutID); // Shape of `node` is different in Fabric. diff --git a/Libraries/Lists/__tests__/VirtualizedSectionList-test.js b/Libraries/Lists/__tests__/VirtualizedSectionList-test.js index f4760ec5563fd7..7a0d122d74126f 100644 --- a/Libraries/Lists/__tests__/VirtualizedSectionList-test.js +++ b/Libraries/Lists/__tests__/VirtualizedSectionList-test.js @@ -169,7 +169,9 @@ describe('VirtualizedSectionList', () => { describe('scrollToLocation', () => { const ITEM_HEIGHT = 100; - const createVirtualizedSectionList = props => { + const createVirtualizedSectionList = ( + props: void | $TEMPORARY$object<{stickySectionHeadersEnabled: boolean}>, + ) => { const component = ReactTestRenderer.create( { + const isRCTLogAdviceWarning = (...args: Array) => { // RCTLogAdvice is a native logging function designed to show users // a message in the console, but not show it to them in Logbox. return typeof args[0] === 'string' && args[0].startsWith('(ADVICE)'); }; - const isWarningModuleWarning = (...args) => { + const isWarningModuleWarning = (...args: any) => { return typeof args[0] === 'string' && args[0].startsWith('Warning: '); }; - const registerWarning = (...args): void => { + const registerWarning = (...args: Array): void => { // Let warnings within LogBox itself fall through. if (LogBoxData.isLogBoxErrorMessage(String(args[0]))) { originalConsoleError(...args); diff --git a/Libraries/LogBox/UI/LogBoxInspector.js b/Libraries/LogBox/UI/LogBoxInspector.js index d67a25ee3f61c3..cd5e0b90987589 100644 --- a/Libraries/LogBox/UI/LogBoxInspector.js +++ b/Libraries/LogBox/UI/LogBoxInspector.js @@ -92,7 +92,9 @@ const headerTitleMap = { component: 'Render Error', }; -function LogBoxInspectorBody(props) { +function LogBoxInspectorBody( + props: $TEMPORARY$object<{log: LogBoxLog, onRetry: () => void}>, +) { const [collapsed, setCollapsed] = React.useState(true); React.useEffect(() => { diff --git a/Libraries/LogBox/UI/LogBoxInspectorReactFrames.js b/Libraries/LogBox/UI/LogBoxInspectorReactFrames.js index dd47dda5ea0160..1bf4efc3fbb0d3 100644 --- a/Libraries/LogBox/UI/LogBoxInspectorReactFrames.js +++ b/Libraries/LogBox/UI/LogBoxInspectorReactFrames.js @@ -26,7 +26,7 @@ type Props = $ReadOnly<{| const BEFORE_SLASH_RE = /^(.*)[\\/]/; // Taken from React https://github.com/facebook/react/blob/206d61f72214e8ae5b935f0bf8628491cb7f0797/packages/react-devtools-shared/src/backend/describeComponentFrame.js#L27-L41 -function getPrettyFileName(path) { +function getPrettyFileName(path: string) { let fileName = path.replace(BEFORE_SLASH_RE, ''); // In DEV, include code for a common special case: diff --git a/Libraries/LogBox/UI/LogBoxInspectorStackFrame.js b/Libraries/LogBox/UI/LogBoxInspectorStackFrame.js index dc6208930b6743..f7fbd162ac0368 100644 --- a/Libraries/LogBox/UI/LogBoxInspectorStackFrame.js +++ b/Libraries/LogBox/UI/LogBoxInspectorStackFrame.js @@ -57,7 +57,7 @@ function LogBoxInspectorStackFrame(props: Props): React.Node { ); } -function getFileName(file) { +function getFileName(file: ?string) { if (file == null) { return ''; } diff --git a/Libraries/LogBox/UI/LogBoxInspectorStackFrames.js b/Libraries/LogBox/UI/LogBoxInspectorStackFrames.js index 9827a1c58b1948..88301894d36aa0 100644 --- a/Libraries/LogBox/UI/LogBoxInspectorStackFrames.js +++ b/Libraries/LogBox/UI/LogBoxInspectorStackFrames.js @@ -132,7 +132,9 @@ function StackFrameList(props) { ); } -function StackFrameFooter(props) { +function StackFrameFooter( + props: $TEMPORARY$object<{message: string, onPress: () => void}>, +) { return ( +const cleanContent = (content: string) => content.replace(/^(TransformError |Warning: (Warning: )?|Error: )/g, ''); function LogBoxMessage(props: Props): React.Node { @@ -36,7 +36,11 @@ function LogBoxMessage(props: Props): React.Node { const substitutionStyle: TextStyleProp = props.style; const elements = []; let length = 0; - const createUnderLength = (key, message, style) => { + const createUnderLength = ( + key: string | $TEMPORARY$string<'-1'>, + message: string, + style: void | TextStyleProp, + ) => { let cleanMessage = cleanContent(message); if (props.maxLength != null) { diff --git a/Libraries/Performance/Systrace.js b/Libraries/Performance/Systrace.js index 6089016521b862..d6b6128f0e4cb8 100644 --- a/Libraries/Performance/Systrace.js +++ b/Libraries/Performance/Systrace.js @@ -87,7 +87,14 @@ const userTimingPolyfill = __DEV__ } : null; -function installPerformanceHooks(polyfill) { +function installPerformanceHooks( + polyfill: null | $TEMPORARY$object<{ + clearMarks(markName: string): void, + clearMeasures(): void, + mark(markName: string): void, + measure(measureName: string, startMark: ?string, endMark: ?string): void, + }>, +) { if (polyfill) { if (global.performance === undefined) { global.performance = {}; diff --git a/Libraries/ReactNative/getCachedComponentWithDebugName.js b/Libraries/ReactNative/getCachedComponentWithDebugName.js index 7e5e116399adf7..1feb6f84566fc5 100644 --- a/Libraries/ReactNative/getCachedComponentWithDebugName.js +++ b/Libraries/ReactNative/getCachedComponentWithDebugName.js @@ -23,7 +23,9 @@ export default function getCachedComponentWithDisplayName( let ComponentWithDisplayName = cache.get(displayName); if (!ComponentWithDisplayName) { - ComponentWithDisplayName = ({children}) => children; + ComponentWithDisplayName = ({ + children, + }: $TEMPORARY$object<{children: Node}>) => children; ComponentWithDisplayName.displayName = displayName; cache.set(displayName, ComponentWithDisplayName); } diff --git a/Libraries/StyleSheet/processTransform.js b/Libraries/StyleSheet/processTransform.js index a3715dae9ba63d..f55e9c1e03164d 100644 --- a/Libraries/StyleSheet/processTransform.js +++ b/Libraries/StyleSheet/processTransform.js @@ -150,7 +150,26 @@ function _validateTransforms(transform: Array): void { }); } -function _validateTransform(key, value, transformation) { +function _validateTransform( + key: + | string + | $TEMPORARY$string<'matrix'> + | $TEMPORARY$string<'perspective'> + | $TEMPORARY$string<'rotate'> + | $TEMPORARY$string<'rotateX'> + | $TEMPORARY$string<'rotateY'> + | $TEMPORARY$string<'rotateZ'> + | $TEMPORARY$string<'scale'> + | $TEMPORARY$string<'scaleX'> + | $TEMPORARY$string<'scaleY'> + | $TEMPORARY$string<'skewX'> + | $TEMPORARY$string<'skewY'> + | $TEMPORARY$string<'translate'> + | $TEMPORARY$string<'translateX'> + | $TEMPORARY$string<'translateY'>, + value: any | number | string, + transformation: any, +) { invariant( !value.getValue, 'You passed an Animated.Value to a normal component. ' + diff --git a/Libraries/Utilities/__tests__/useRefEffect-test.js b/Libraries/Utilities/__tests__/useRefEffect-test.js index 8204289e71ab86..12f0953799a6fc 100644 --- a/Libraries/Utilities/__tests__/useRefEffect-test.js +++ b/Libraries/Utilities/__tests__/useRefEffect-test.js @@ -17,7 +17,20 @@ import {act, create} from 'react-test-renderer'; /** * TestView provide a component execution environment to test hooks. */ -function TestView({childKey = null, effect}) { +function TestView({ + childKey = null, + effect, +}: + | $FlowFixMe + | $TEMPORARY$object<{ + childKey: $TEMPORARY$string<'bar'>, + effect: () => () => void, + }> + | $TEMPORARY$object<{childKey: $TEMPORARY$string<'foo'>, effect: () => void}> + | $TEMPORARY$object<{ + childKey: $TEMPORARY$string<'foo'>, + effect: () => () => void, + }>) { const ref = useRefEffect(effect); return ; } diff --git a/Libraries/Utilities/deepFreezeAndThrowOnMutationInDev.js b/Libraries/Utilities/deepFreezeAndThrowOnMutationInDev.js index 54be3c4c03805b..51350776c4178b 100644 --- a/Libraries/Utilities/deepFreezeAndThrowOnMutationInDev.js +++ b/Libraries/Utilities/deepFreezeAndThrowOnMutationInDev.js @@ -70,7 +70,7 @@ function deepFreezeAndThrowOnMutationInDev>( return object; } -function throwOnImmutableMutation(key, value) { +function throwOnImmutableMutation(key: empty, value) { throw Error( 'You attempted to set the key `' + key + @@ -81,7 +81,7 @@ function throwOnImmutableMutation(key, value) { ); } -function identity(value) { +function identity(value: mixed) { return value; } diff --git a/Libraries/Utilities/useWindowDimensions.js b/Libraries/Utilities/useWindowDimensions.js index 18ca4a442012c3..2e79f955222599 100644 --- a/Libraries/Utilities/useWindowDimensions.js +++ b/Libraries/Utilities/useWindowDimensions.js @@ -20,7 +20,11 @@ export default function useWindowDimensions(): | DisplayMetricsAndroid { const [dimensions, setDimensions] = useState(() => Dimensions.get('window')); useEffect(() => { - function handleChange({window}) { + function handleChange({ + window, + }: + | $FlowFixMe + | $TEMPORARY$object<{window: DisplayMetrics | DisplayMetricsAndroid}>) { if ( dimensions.width !== window.width || dimensions.height !== window.height || diff --git a/Libraries/Utilities/verifyComponentAttributeEquivalence.js b/Libraries/Utilities/verifyComponentAttributeEquivalence.js index 489a6ca4aef258..75b2d240d27714 100644 --- a/Libraries/Utilities/verifyComponentAttributeEquivalence.js +++ b/Libraries/Utilities/verifyComponentAttributeEquivalence.js @@ -63,7 +63,7 @@ export default function verifyComponentAttributeEquivalence( export function lefthandObjectDiff(leftObj: Object, rightObj: Object): Object { const differentKeys = {}; - function compare(leftItem, rightItem, key) { + function compare(leftItem: any, rightItem: any, key: string) { if (typeof leftItem !== typeof rightItem && leftItem != null) { differentKeys[key] = rightItem; return; diff --git a/packages/react-native-codegen/src/cli/combine/combine-js-to-schema-cli.js b/packages/react-native-codegen/src/cli/combine/combine-js-to-schema-cli.js index 8f5a19e4cb8a9f..0e7dccfaa4f07e 100644 --- a/packages/react-native-codegen/src/cli/combine/combine-js-to-schema-cli.js +++ b/packages/react-native-codegen/src/cli/combine/combine-js-to-schema-cli.js @@ -18,7 +18,7 @@ const path = require('path'); const [outfile, ...fileList] = process.argv.slice(2); -function filterJSFile(file) { +function filterJSFile(file: string) { return ( /^(Native.+|.+NativeComponent)/.test(path.basename(file)) && // NativeUIManager will be deprecated by Fabric UIManager. diff --git a/packages/react-native-codegen/src/generators/components/JavaHelpers.js b/packages/react-native-codegen/src/generators/components/JavaHelpers.js index e59fe7df4f8571..9a6e02c81dcfe7 100644 --- a/packages/react-native-codegen/src/generators/components/JavaHelpers.js +++ b/packages/react-native-codegen/src/generators/components/JavaHelpers.js @@ -60,7 +60,17 @@ function getImports( } }); - function addImportsForNativeName(name) { + function addImportsForNativeName( + name: + | 'ColorPrimitive' + | 'EdgeInsetsPrimitive' + | 'ImageSourcePrimitive' + | 'PointPrimitive' + | $TEMPORARY$string<'ColorPrimitive'> + | $TEMPORARY$string<'EdgeInsetsPrimitive'> + | $TEMPORARY$string<'ImageSourcePrimitive'> + | $TEMPORARY$string<'PointPrimitive'>, + ) { switch (name) { case 'ColorPrimitive': if (type === 'delegate') { diff --git a/packages/react-native-codegen/src/generators/modules/GenerateModuleObjCpp/header/serializeConstantsStruct.js b/packages/react-native-codegen/src/generators/modules/GenerateModuleObjCpp/header/serializeConstantsStruct.js index d11a5a8c23d88c..638f33b1fa94de 100644 --- a/packages/react-native-codegen/src/generators/modules/GenerateModuleObjCpp/header/serializeConstantsStruct.js +++ b/packages/react-native-codegen/src/generators/modules/GenerateModuleObjCpp/header/serializeConstantsStruct.js @@ -188,7 +188,7 @@ function toObjCValue( depth + 1, ); - const RCTConvertVecToArray = transformer => { + const RCTConvertVecToArray = (transformer: string) => { return `RCTConvert${ !isRequired ? 'Optional' : '' }VecToArray(${value}, ${transformer})`; diff --git a/packages/react-native-codegen/src/generators/modules/GenerateModuleObjCpp/index.js b/packages/react-native-codegen/src/generators/modules/GenerateModuleObjCpp/index.js index 59a2ca93501ed8..c3d00d033630ec 100644 --- a/packages/react-native-codegen/src/generators/modules/GenerateModuleObjCpp/index.js +++ b/packages/react-native-codegen/src/generators/modules/GenerateModuleObjCpp/index.js @@ -9,6 +9,7 @@ */ 'use strict'; +import type {NativeModulePropertyShape} from '../../../CodegenSchema'; import type {SchemaType} from '../../../CodegenSchema'; import type {MethodSerializationOutput} from './serializeMethod'; @@ -142,7 +143,7 @@ module.exports = { const structCollector = new StructCollector(); const methodSerializations: Array = []; - const serializeProperty = property => { + const serializeProperty = (property: NativeModulePropertyShape) => { methodSerializations.push( ...serializeMethod( hasteModuleName, diff --git a/packages/react-native-codegen/src/parsers/flow/components/commands.js b/packages/react-native-codegen/src/parsers/flow/components/commands.js index c967645211f605..48756da897a77e 100644 --- a/packages/react-native-codegen/src/parsers/flow/components/commands.js +++ b/packages/react-native-codegen/src/parsers/flow/components/commands.js @@ -20,7 +20,7 @@ const {getValueFromTypes} = require('../utils.js'); type EventTypeAST = Object; -function buildCommandSchema(property, types: TypeDeclarationMap) { +function buildCommandSchema(property: EventTypeAST, types: TypeDeclarationMap) { const name = property.key.name; const optional = property.optional; const value = getValueFromTypes(property.value, types); diff --git a/packages/react-native-codegen/src/parsers/flow/components/index.js b/packages/react-native-codegen/src/parsers/flow/components/index.js index 34b8233c07e570..e49d40b98465e3 100644 --- a/packages/react-native-codegen/src/parsers/flow/components/index.js +++ b/packages/react-native-codegen/src/parsers/flow/components/index.js @@ -9,6 +9,8 @@ */ 'use strict'; +import type {CommandOptions} from './options'; +import type {TypeDeclarationMap} from '../utils'; import type {ComponentSchemaBuilderConfig} from './schema.js'; const {getCommands} = require('./commands'); @@ -119,7 +121,11 @@ function findComponentConfig(ast) { }; } -function getCommandProperties(commandTypeName, types, commandOptions) { +function getCommandProperties( + commandTypeName, + types: TypeDeclarationMap, + commandOptions: ?CommandOptions, +) { if (commandTypeName == null) { return []; } diff --git a/packages/react-native-codegen/src/parsers/flow/components/props.js b/packages/react-native-codegen/src/parsers/flow/components/props.js index 536606f1a1d952..aad5402450045e 100644 --- a/packages/react-native-codegen/src/parsers/flow/components/props.js +++ b/packages/react-native-codegen/src/parsers/flow/components/props.js @@ -29,7 +29,12 @@ function getPropProperties( } } -function getTypeAnnotationForArray(name, typeAnnotation, defaultValue, types) { +function getTypeAnnotationForArray( + name: string, + typeAnnotation: $FlowFixMe, + defaultValue: $FlowFixMe | null, + types: TypeDeclarationMap, +) { const extractedTypeAnnotation = getValueFromTypes(typeAnnotation, types); if (extractedTypeAnnotation.type === 'NullableTypeAnnotation') { throw new Error( @@ -171,11 +176,11 @@ function getTypeAnnotationForArray(name, typeAnnotation, defaultValue, types) { } function getTypeAnnotation( - name, + name: string, annotation, - defaultValue, - withNullDefault, - types, + defaultValue: $FlowFixMe | null, + withNullDefault: boolean, + types: TypeDeclarationMap, ) { const typeAnnotation = getValueFromTypes(annotation, types); @@ -325,7 +330,7 @@ function getTypeAnnotation( } function buildPropSchema( - property, + property: PropAST, types: TypeDeclarationMap, ): ?NamedShape { const name = property.key.name; diff --git a/packages/react-native-codegen/src/parsers/flow/modules/errors.js b/packages/react-native-codegen/src/parsers/flow/modules/errors.js index 370262cfcb7448..ea35c9ef66c7eb 100644 --- a/packages/react-native-codegen/src/parsers/flow/modules/errors.js +++ b/packages/react-native-codegen/src/parsers/flow/modules/errors.js @@ -41,7 +41,7 @@ class MoreThanOneModuleFlowInterfaceParserError extends ParserError { ) { const finalName = names[names.length - 1]; const allButLastName = names.slice(0, -1); - const quote = x => `'${x}'`; + const quote = (x: string) => `'${x}'`; const nameStr = allButLastName.map(quote).join(', ') + ', and ' + quote(finalName); diff --git a/packages/rn-tester/js/components/RNTesterExampleFilter.js b/packages/rn-tester/js/components/RNTesterExampleFilter.js index f799e89dd36fc5..40f64217de327a 100644 --- a/packages/rn-tester/js/components/RNTesterExampleFilter.js +++ b/packages/rn-tester/js/components/RNTesterExampleFilter.js @@ -52,7 +52,7 @@ class RNTesterExampleFilter extends React.Component, State> { ); } - const filter = example => { + const filter = (example: T) => { const category = this.state.category; return ( this.props.disableSearch || @@ -79,7 +79,11 @@ class RNTesterExampleFilter extends React.Component, State> { ); } - _renderFilteredSections(filteredSections): ?React.Element { + _renderFilteredSections( + filteredSections: Array< + $TEMPORARY$object<{data: Array, key: string, title: string}>, + >, + ): ?React.Element { if (this.props.page === 'examples_page') { return ( mixed, }; -function getExampleTitle(title, platform) { +function getExampleTitle(title: $FlowFixMe, platform: $FlowFixMe) { return platform != null ? `${title} (${platform} only)` : title; } export default function RNTesterModuleContainer(props: Props): React.Node { const {module, example, onExampleCardPress} = props; const theme = React.useContext(RNTesterThemeContext); - const renderExample = (e, i) => { + const renderExample = (e: $FlowFixMe, i: $FlowFixMe) => { // Filter platform-specific es const {title, description, platform, render: ExampleComponent} = e; if (platform != null && Platform.OS !== platform) { @@ -73,7 +73,8 @@ export default function RNTesterModuleContainer(props: Props): React.Node { ); } - const filter = ({example: e, filterRegex}) => filterRegex.test(e.title); + const filter = ({example: e, filterRegex}: $FlowFixMe) => + filterRegex.test(e.title); const sections = [ { diff --git a/packages/rn-tester/js/components/RNTesterModuleList.js b/packages/rn-tester/js/components/RNTesterModuleList.js index 6666c30b595dd0..148343387b1399 100644 --- a/packages/rn-tester/js/components/RNTesterModuleList.js +++ b/packages/rn-tester/js/components/RNTesterModuleList.js @@ -97,7 +97,7 @@ const ExampleModuleRow = ({ ); }; -const renderSectionHeader = ({section}) => ( +const renderSectionHeader = ({section}: {section: any, ...}) => ( {theme => { return ( @@ -118,7 +118,7 @@ const renderSectionHeader = ({section}) => ( const RNTesterModuleList: React$AbstractComponent = React.memo( ({sections, toggleBookmark, handleModuleCardPress}) => { - const filter = ({example, filterRegex, category}) => + const filter = ({example, filterRegex, category}: any) => filterRegex.test(example.module.title) && (!category || example.category === category) && (!Platform.isTV || example.supportsTVOS); diff --git a/packages/rn-tester/js/components/RNTesterNavbar.js b/packages/rn-tester/js/components/RNTesterNavbar.js index c3360581e8db6d..669299ac7ab3d9 100644 --- a/packages/rn-tester/js/components/RNTesterNavbar.js +++ b/packages/rn-tester/js/components/RNTesterNavbar.js @@ -8,12 +8,22 @@ * @flow */ +import type {RNTesterTheme} from './RNTesterTheme'; + import * as React from 'react'; import {Text, View, StyleSheet, Image, Pressable} from 'react-native'; import {RNTesterThemeContext} from './RNTesterTheme'; -const BookmarkTab = ({handleNavBarPress, isBookmarkActive, theme}) => ( +const BookmarkTab = ({ + handleNavBarPress, + isBookmarkActive, + theme, +}: $TEMPORARY$object<{ + handleNavBarPress: (data: {screen: string}) => void, + isBookmarkActive: boolean, + theme: RNTesterTheme, +}>) => ( ); -const ComponentTab = ({isComponentActive, handleNavBarPress, theme}) => ( +const ComponentTab = ({ + isComponentActive, + handleNavBarPress, + theme, +}: $TEMPORARY$object<{ + handleNavBarPress: (data: {screen: string}) => void, + isComponentActive: boolean, + theme: RNTesterTheme, +}>) => ( ( /> ); -const APITab = ({isAPIActive, handleNavBarPress, theme}) => ( +const APITab = ({ + isAPIActive, + handleNavBarPress, + theme, +}: $TEMPORARY$object<{ + handleNavBarPress: (data: {screen: string}) => void, + isAPIActive: boolean, + theme: RNTesterTheme, +}>) => ( { + _handleToggled = (isEnabled: void | PressEvent | boolean) => { if (!this.state.isEnabled) { this.setState({isEnabled: true}); } else { diff --git a/packages/rn-tester/js/examples/Alert/AlertIOSExample.js b/packages/rn-tester/js/examples/Alert/AlertIOSExample.js index 5b4926d1293223..aab89e109cd5d8 100644 --- a/packages/rn-tester/js/examples/Alert/AlertIOSExample.js +++ b/packages/rn-tester/js/examples/Alert/AlertIOSExample.js @@ -29,7 +29,7 @@ type State = {|promptValue: ?string|}; class PromptOptions extends React.Component { customButtons: Array; - constructor(props) { + constructor(props: void | Props) { super(props); /* $FlowFixMe[cannot-write] this seems to be a Flow bug, `saveResponse` is @@ -137,7 +137,7 @@ class PromptOptions extends React.Component { ); } - saveResponse(promptValue) { + saveResponse(promptValue: any) { this.setState({promptValue: JSON.stringify(promptValue)}); } } diff --git a/packages/rn-tester/js/examples/Animated/ComposingExample.js b/packages/rn-tester/js/examples/Animated/ComposingExample.js index c262d55d22dd4e..a2a476ed3cd90b 100644 --- a/packages/rn-tester/js/examples/Animated/ComposingExample.js +++ b/packages/rn-tester/js/examples/Animated/ComposingExample.js @@ -10,6 +10,7 @@ import type {RNTesterModuleExample} from '../../types/RNTesterTypes'; import type {CompositeAnimation} from 'react-native/Libraries/Animated/AnimatedMock'; +import type AnimatedValue from 'react-native/Libraries/Animated/nodes/AnimatedValue'; import * as React from 'react'; import RNTesterButton from '../../components/RNTesterButton'; import ToggleNativeDriver from './utils/ToggleNativeDriver'; @@ -39,7 +40,10 @@ const items = [ { title: 'Parallel', description: 'Starts a number of animations at the same time', - compositeAnimation: (values, useNativeDriver) => + compositeAnimation: ( + values: Array, + useNativeDriver: boolean, + ) => Animated.sequence([ Animated.parallel( values.map(value => @@ -57,7 +61,10 @@ const items = [ title: 'Sequence', description: 'Starts the animations in order, waiting for each to complete before starting the next', - compositeAnimation: (values, useNativeDriver) => + compositeAnimation: ( + values: Array, + useNativeDriver: boolean, + ) => Animated.sequence([ Animated.sequence( values.map(value => @@ -75,7 +82,10 @@ const items = [ title: 'Stagger', description: 'Starts animations in order and in parallel, but with successive delays', - compositeAnimation: (values, useNativeDriver) => + compositeAnimation: ( + values: Array, + useNativeDriver: boolean, + ) => Animated.sequence([ Animated.stagger( 150, @@ -94,7 +104,10 @@ const items = [ { title: 'Delay', description: 'Starts an animation after a given delay', - compositeAnimation: (values, useNativeDriver) => + compositeAnimation: ( + values: Array, + useNativeDriver: boolean, + ) => Animated.sequence([ Animated.delay(2000), Animated.parallel( diff --git a/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExBobble.js b/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExBobble.js index f845a4739bcce5..c50adb19a74b84 100644 --- a/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExBobble.js +++ b/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExBobble.js @@ -35,7 +35,7 @@ class AnExBobble extends React.Component { return new Animated.ValueXY(); }); this.state.selectedBobble = null; - const bobblePanListener = (e, gestureState) => { + const bobblePanListener = (e: any, gestureState: any) => { // async events => change selection const newSelected = computeNewSelected(gestureState); if (this.state.selectedBobble !== newSelected) { diff --git a/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExChained.js b/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExChained.js index cd4117700476d4..fcd23c4aaeb671 100644 --- a/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExChained.js +++ b/packages/rn-tester/js/examples/AnimatedGratuitousApp/AnExChained.js @@ -10,6 +10,9 @@ 'use strict'; +import type {PressEvent} from 'react-native/Libraries/Types/CoreEventTypes'; +import type {GestureState} from 'react-native/Libraries/Interaction/PanResponder'; + const React = require('react'); const {Animated, PanResponder, StyleSheet, View} = require('react-native'); @@ -34,7 +37,7 @@ class AnExChained extends React.Component { }).start(); this.state.stickers.push(sticker); // push on the followers } - const releaseChain = (e, gestureState) => { + const releaseChain = (e: PressEvent, gestureState: GestureState) => { this.state.stickers[0].flattenOffset(); // merges offset into value and resets Animated.sequence([ // spring to start after decay finishes diff --git a/packages/rn-tester/js/examples/AppState/AppStateExample.js b/packages/rn-tester/js/examples/AppState/AppStateExample.js index ddb2d8c9808980..b9ab7621e655f6 100644 --- a/packages/rn-tester/js/examples/AppState/AppStateExample.js +++ b/packages/rn-tester/js/examples/AppState/AppStateExample.js @@ -10,6 +10,8 @@ 'use strict'; +import type {AppStateValues} from 'react-native/Libraries/AppState/AppState'; + const React = require('react'); import {type EventSubscription} from 'react-native/Libraries/vendor/emitter/EventEmitter'; @@ -65,7 +67,7 @@ class AppStateSubscription extends React.Component< this.setState({eventsDetected}); }; - _handleAppStateChange = appState => { + _handleAppStateChange = (appState: AppStateValues) => { const previousAppStates = this.state.previousAppStates.slice(); previousAppStates.push(this.state.appState); this.setState({ diff --git a/packages/rn-tester/js/examples/FlatList/BaseFlatListExample.js b/packages/rn-tester/js/examples/FlatList/BaseFlatListExample.js index c9a0645fb261d7..65311e30058eda 100644 --- a/packages/rn-tester/js/examples/FlatList/BaseFlatListExample.js +++ b/packages/rn-tester/js/examples/FlatList/BaseFlatListExample.js @@ -8,6 +8,7 @@ * @format */ +import type {RenderItemProps} from 'react-native/Libraries/Lists/VirtualizedList'; import { Pressable, Button, @@ -33,7 +34,7 @@ const DATA = [ 'Ice Cream', ]; -const Item = ({item, separators}) => { +const Item = ({item, separators}: RenderItemProps) => { return ( { diff --git a/packages/rn-tester/js/examples/FlatList/FlatList-basic.js b/packages/rn-tester/js/examples/FlatList/FlatList-basic.js index 7d55e4ea6d4ed1..8ed4afd4faba23 100644 --- a/packages/rn-tester/js/examples/FlatList/FlatList-basic.js +++ b/packages/rn-tester/js/examples/FlatList/FlatList-basic.js @@ -10,6 +10,9 @@ 'use strict'; +import type {AnimatedComponentType} from 'react-native/Libraries/Animated/createAnimatedComponent'; +import typeof FlatListType from 'react-native/Libraries/Lists/FlatList'; + import type {RNTesterModuleExample} from '../../types/RNTesterTypes'; import * as React from 'react'; import { @@ -83,7 +86,7 @@ class FlatListExample extends React.PureComponent { this.setState({filterText}); }; - _onChangeScrollToIndex = text => { + _onChangeScrollToIndex = (text: mixed) => { this._listRef.scrollToIndex({viewPosition: 0.5, index: Number(text)}); }; @@ -106,7 +109,7 @@ class FlatListExample extends React.PureComponent { render(): React.Node { const filterRegex = new RegExp(String(this.state.filterText), 'i'); - const filter = item => + const filter = (item: Item) => filterRegex.test(item.text) || filterRegex.test(item.title); const filteredData = this.state.data.filter(filter); const flatListItemRendererProps = this._renderItemComponent(); @@ -235,7 +238,14 @@ class FlatListExample extends React.PureComponent { ); } - _captureRef = ref => { + _captureRef = ( + ref: React.ElementRef< + AnimatedComponentType< + React.ElementConfig, + React.ElementRef, + >, + >, + ) => { this._listRef = ref; }; _getItemLayout = (data: any, index: number) => { diff --git a/packages/rn-tester/js/examples/FlatList/FlatList-multiColumn.js b/packages/rn-tester/js/examples/FlatList/FlatList-multiColumn.js index fe53a7a628f855..a9e87422266fa9 100644 --- a/packages/rn-tester/js/examples/FlatList/FlatList-multiColumn.js +++ b/packages/rn-tester/js/examples/FlatList/FlatList-multiColumn.js @@ -9,6 +9,8 @@ */ 'use strict'; + +import type {RenderItemProps} from 'react-native/Libraries/Lists/VirtualizedList'; import type {RNTesterModuleExample} from '../../types/RNTesterTypes'; const RNTesterPage = require('../../components/RNTesterPage'); const React = require('react'); @@ -54,7 +56,7 @@ class MultiColumnExample extends React.PureComponent< _onChangeFilterText = filterText => { this.setState(() => ({filterText})); }; - _onChangeNumColumns = numColumns => { + _onChangeNumColumns = (numColumns: mixed) => { this.setState(() => ({numColumns: Number(numColumns)})); }; @@ -63,7 +65,7 @@ class MultiColumnExample extends React.PureComponent< render(): React.Node { const filterRegex = new RegExp(String(this.state.filterText), 'i'); - const filter = item => + const filter = (item: any | Item) => filterRegex.test(item.text) || filterRegex.test(item.title); const filteredData = this.state.data.filter(filter); return ( @@ -138,7 +140,7 @@ class MultiColumnExample extends React.PureComponent< getItemLayout(data, index).length + 2 * (CARD_MARGIN + BORDER_WIDTH); return {length, offset: length * index, index}; } - _renderItemComponent = ({item}) => { + _renderItemComponent = ({item}: RenderItemProps) => { return ( { _timeout: any; - _submit(abortDelay) { + _submit(abortDelay: number) { clearTimeout(this._timeout); const abortController = new global.AbortController(); fetch('https://reactnative.dev/', { diff --git a/packages/rn-tester/js/examples/XHR/XHRExampleDownload.js b/packages/rn-tester/js/examples/XHR/XHRExampleDownload.js index 107dc453490e5f..bfd092e527701f 100644 --- a/packages/rn-tester/js/examples/XHR/XHRExampleDownload.js +++ b/packages/rn-tester/js/examples/XHR/XHRExampleDownload.js @@ -71,7 +71,7 @@ class XHRExampleDownload extends React.Component<{...}, Object> { }); } }; - const onprogress = event => { + const onprogress = (event: ProgressEvent) => { this.setState({ progressTotal: event.total, progressLoaded: event.loaded,