From ee86c2c4422eec32acd2fe2a68c35fa4cbf6dfca Mon Sep 17 00:00:00 2001 From: Jakub Butkiewicz Date: Tue, 6 Feb 2024 10:42:49 +0100 Subject: [PATCH 1/3] ref: move react-native-safe-area-context mock to TS --- __mocks__/react-native-safe-area-context.js | 52 --------------- __mocks__/react-native-safe-area-context.tsx | 66 ++++++++++++++++++++ 2 files changed, 66 insertions(+), 52 deletions(-) delete mode 100644 __mocks__/react-native-safe-area-context.js create mode 100644 __mocks__/react-native-safe-area-context.tsx diff --git a/__mocks__/react-native-safe-area-context.js b/__mocks__/react-native-safe-area-context.js deleted file mode 100644 index b31ed670b81c..000000000000 --- a/__mocks__/react-native-safe-area-context.js +++ /dev/null @@ -1,52 +0,0 @@ -import React, {forwardRef} from 'react'; -import {View} from 'react-native'; - -const insets = { - top: 0, - right: 0, - bottom: 0, - left: 0, -}; - -function withSafeAreaInsets(WrappedComponent) { - function WithSafeAreaInsets(props) { - return ( - - ); - } - - const WithSafeAreaInsetsWithRef = forwardRef((props, ref) => ( - - )); - - WithSafeAreaInsetsWithRef.displayName = 'WithSafeAreaInsetsWithRef'; - - return WithSafeAreaInsetsWithRef; -} - -const SafeAreaView = View; -const SafeAreaProvider = (props) => props.children; -const SafeAreaConsumer = (props) => props.children(insets); -const SafeAreaInsetsContext = { - Consumer: SafeAreaConsumer, -}; - -const useSafeAreaFrame = jest.fn(() => ({ - x: 0, - y: 0, - width: 390, - height: 844, -})); -const useSafeAreaInsets = jest.fn(() => insets); - -export {SafeAreaProvider, SafeAreaConsumer, SafeAreaInsetsContext, withSafeAreaInsets, SafeAreaView, useSafeAreaFrame, useSafeAreaInsets}; diff --git a/__mocks__/react-native-safe-area-context.tsx b/__mocks__/react-native-safe-area-context.tsx new file mode 100644 index 000000000000..6dd4b45af7e3 --- /dev/null +++ b/__mocks__/react-native-safe-area-context.tsx @@ -0,0 +1,66 @@ +import type {ForwardedRef, ReactNode} from 'react'; +import React, {forwardRef} from 'react'; +import {View} from 'react-native'; +import type {EdgeInsets, WithSafeAreaInsetsProps} from 'react-native-safe-area-context'; +import type ChildrenProps from '@src/types/utils/ChildrenProps'; + +type SafeAreaProviderProps = ChildrenProps; +type SafeAreaConsumerProps = { + children?: (insets: EdgeInsets) => ReactNode; +}; +type SafeAreaInsetsContextValue = { + Consumer: (props: SafeAreaConsumerProps) => ReactNode; +}; + +const insets: EdgeInsets = { + top: 0, + right: 0, + bottom: 0, + left: 0, +}; + +function withSafeAreaInsets(WrappedComponent: React.ComponentType}>) { + function WithSafeAreaInsets(props: WithSafeAreaInsetsProps & {forwardedRef: React.ForwardedRef}) { + return ( + + ); + } + + const WithSafeAreaInsetsWithRef = forwardRef((props: WithSafeAreaInsetsProps, ref: ForwardedRef) => ( + + )); + + return WithSafeAreaInsetsWithRef; +} + +const SafeAreaView: typeof View = View; +const SafeAreaProvider = (props: SafeAreaProviderProps) => props.children; +const SafeAreaConsumer = (props: SafeAreaConsumerProps) => props.children?.(insets); +const SafeAreaInsetsContext: SafeAreaInsetsContextValue = { + Consumer: SafeAreaConsumer, +}; + +const useSafeAreaFrame: jest.Mock<{ + x: number; + y: number; + width: number; + height: number; +}> = jest.fn(() => ({ + x: 0, + y: 0, + width: 390, + height: 844, +})); +const useSafeAreaInsets: jest.Mock = jest.fn(() => insets); + +export {SafeAreaProvider, SafeAreaConsumer, SafeAreaInsetsContext, withSafeAreaInsets, SafeAreaView, useSafeAreaFrame, useSafeAreaInsets}; From 782ead8203618d1205d2961c08fd8bcc929a4e3a Mon Sep 17 00:00:00 2001 From: Jakub Butkiewicz Date: Tue, 13 Feb 2024 10:45:03 +0100 Subject: [PATCH 2/3] fix: address feedback --- __mocks__/react-native-safe-area-context.tsx | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/__mocks__/react-native-safe-area-context.tsx b/__mocks__/react-native-safe-area-context.tsx index 6dd4b45af7e3..32c80926c7a9 100644 --- a/__mocks__/react-native-safe-area-context.tsx +++ b/__mocks__/react-native-safe-area-context.tsx @@ -1,7 +1,7 @@ import type {ForwardedRef, ReactNode} from 'react'; import React, {forwardRef} from 'react'; import {View} from 'react-native'; -import type {EdgeInsets, WithSafeAreaInsetsProps} from 'react-native-safe-area-context'; +import type {EdgeInsets, useSafeAreaFrame as LibUseSafeAreaFrame, WithSafeAreaInsetsProps} from 'react-native-safe-area-context'; import type ChildrenProps from '@src/types/utils/ChildrenProps'; type SafeAreaProviderProps = ChildrenProps; @@ -50,12 +50,7 @@ const SafeAreaInsetsContext: SafeAreaInsetsContextValue = { Consumer: SafeAreaConsumer, }; -const useSafeAreaFrame: jest.Mock<{ - x: number; - y: number; - width: number; - height: number; -}> = jest.fn(() => ({ +const useSafeAreaFrame: jest.Mock> = jest.fn(() => ({ x: 0, y: 0, width: 390, From 59bc0876e77c309aff24b164556880c0cff4fbb5 Mon Sep 17 00:00:00 2001 From: Jakub Butkiewicz Date: Mon, 4 Mar 2024 11:41:24 +0100 Subject: [PATCH 3/3] fix: resolve comment --- __mocks__/react-native-safe-area-context.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/__mocks__/react-native-safe-area-context.tsx b/__mocks__/react-native-safe-area-context.tsx index 32c80926c7a9..b789c90f87e8 100644 --- a/__mocks__/react-native-safe-area-context.tsx +++ b/__mocks__/react-native-safe-area-context.tsx @@ -43,7 +43,7 @@ function withSafeAreaInsets(WrappedComponent: React.ComponentType props.children; const SafeAreaConsumer = (props: SafeAreaConsumerProps) => props.children?.(insets); const SafeAreaInsetsContext: SafeAreaInsetsContextValue = {