diff --git a/jestSetup.js b/jestSetup.js index 236d7f67e62..01ce11c5fc0 100644 --- a/jestSetup.js +++ b/jestSetup.js @@ -1,4 +1,5 @@ import { jest } from '@jest/globals' +import mockSafeAreaContext from 'react-native-safe-area-context/jest/mock' jest.useFakeTimers() @@ -81,6 +82,8 @@ jest.mock('edge-login-ui-rn', () => ({ } })) +jest.mock('react-native-safe-area-context', () => mockSafeAreaContext) + jest.mock('react-native-share', () => 'RNShare') jest.mock( diff --git a/package.json b/package.json index 17e8d4cd460..d1bfdecbff8 100644 --- a/package.json +++ b/package.json @@ -75,7 +75,6 @@ "process-nextick-args": "2.0.0", "randombytes": "2.1.0", "react-native-material-textfield": "0.16.1", - "react-native-safe-area-view": "0.14.9", "regenerator-runtime": "0.13.2", "ripemd160": "2.0.2", "ripple-binary-codec": "0.2.3", @@ -137,7 +136,6 @@ "react-native-contacts": "^7.0.4", "react-native-custom-tabs": "https://github.com/adminphoeniixx/react-native-custom-tabs#develop", "react-native-device-info": "^8.7.1", - "react-native-extra-dimensions-android": "^1.2.5", "react-native-fast-image": "^8.5.11", "react-native-flipper": "^0.143.0", "react-native-fs": "^2.19.0", @@ -157,7 +155,6 @@ "react-native-reanimated": "^2.8.0", "react-native-safari-view": "^2.1.0", "react-native-safe-area-context": "^4.5.0", - "react-native-safe-area-view": "0.14.9", "react-native-screens": "^3.19.0", "react-native-share": "^7.1.2", "react-native-smart-splash-screen": "^2.3.5", @@ -200,7 +197,6 @@ "@types/prompts": "^2.0.14", "@types/react-native": "0.67.1", "@types/react-native-custom-tabs": "^0.1.2", - "@types/react-native-extra-dimensions-android": "^1.2.0", "@types/react-native-material-textfield": "^0.16.5", "@types/react-native-safari-view": "^2.0.5", "@types/react-native-vector-icons": "^6.4.12", diff --git a/patches/react-native-safe-area-view+0.14.9.patch b/patches/react-native-safe-area-view+0.14.9.patch deleted file mode 100644 index f37bdc1d847..00000000000 --- a/patches/react-native-safe-area-view+0.14.9.patch +++ /dev/null @@ -1,70 +0,0 @@ -diff --git a/node_modules/react-native-safe-area-view/index.d.ts b/node_modules/react-native-safe-area-view/index.d.ts -index 4f689fb..9219d08 100644 ---- a/node_modules/react-native-safe-area-view/index.d.ts -+++ b/node_modules/react-native-safe-area-view/index.d.ts -@@ -1,6 +1,7 @@ - import { ComponentClass } from 'react'; - import { ViewProperties } from 'react-native'; - -+ - export type SafeAreaViewForceInsetValue = 'always' | 'never'; - - export interface SafeAreaViewProps extends ViewProperties { -@@ -29,4 +30,6 @@ export const withSafeArea:

( - Component: React.ComponentType

- ) => React.ComponentType

; - -+export const isIPhoneX = boolean; -+ - export default SafeAreaView; -diff --git a/node_modules/react-native-safe-area-view/index.js b/node_modules/react-native-safe-area-view/index.js -index a21ff41..96f97e9 100644 ---- a/node_modules/react-native-safe-area-view/index.js -+++ b/node_modules/react-native-safe-area-view/index.js -@@ -15,6 +15,12 @@ const X_WIDTH = 375; - const X_HEIGHT = 812; - const XSMAX_WIDTH = 414; - const XSMAX_HEIGHT = 896; -+const IPHONE12_WIDTH = 390; -+const IPHONE12_HEIGHT = 844; -+const IPHONE12MAX_WIDTH = 428; -+const IPHONE12MAX_HEIGHT = 926; -+const IPHONE12MINI_WIDTH = 360; -+const IPHONE12MINI_HEIGHT = 780; - const PAD_WIDTH = 768; - const PAD_HEIGHT = 1024; - const IPADPRO11_WIDTH = 834; -@@ -33,7 +39,7 @@ const { height: D_HEIGHT, width: D_WIDTH } = getResolvedDimensions(); - const PlatformConstants = Platform.constants || {}; - const { minor = 0 } = PlatformConstants.reactNativeVersion || {}; - --const isIPhoneX = (() => { -+export const isIPhoneX = (() => { - if (Platform.OS === 'web') return false; - - return ( -@@ -41,7 +47,13 @@ const isIPhoneX = (() => { - ((D_HEIGHT === X_HEIGHT && D_WIDTH === X_WIDTH) || - (D_HEIGHT === X_WIDTH && D_WIDTH === X_HEIGHT))) || - ((D_HEIGHT === XSMAX_HEIGHT && D_WIDTH === XSMAX_WIDTH) || -- (D_HEIGHT === XSMAX_WIDTH && D_WIDTH === XSMAX_HEIGHT)) -+ (D_HEIGHT === XSMAX_WIDTH && D_WIDTH === XSMAX_HEIGHT)) || -+ ((D_HEIGHT === IPHONE12_HEIGHT && D_WIDTH === IPHONE12_WIDTH) || -+ (D_HEIGHT === IPHONE12_WIDTH && D_WIDTH === IPHONE12_HEIGHT)) || -+ ((D_HEIGHT === IPHONE12MAX_HEIGHT && D_WIDTH === IPHONE12MAX_WIDTH) || -+ (D_HEIGHT === IPHONE12MAX_WIDTH && D_WIDTH === IPHONE12MAX_HEIGHT)) || -+ ((D_HEIGHT === IPHONE12MINI_HEIGHT && D_WIDTH === IPHONE12MINI_WIDTH) || -+ (D_HEIGHT === IPHONE12MINI_WIDTH && D_WIDTH === IPHONE12MINI_HEIGHT)) - ); - })(); - -diff --git a/node_modules/react-native-safe-area-view/index.js.flow b/node_modules/react-native-safe-area-view/index.js.flow -index 4c59929..a3274a2 100644 ---- a/node_modules/react-native-safe-area-view/index.js.flow -+++ b/node_modules/react-native-safe-area-view/index.js.flow -@@ -27,3 +27,5 @@ declare export function getInset( - value: 'horizontal' | 'right' | 'left' | 'vertical' | 'top' | 'bottom', - isLandscape: boolean - ): number -+ -+declare export var isIPhoneX: boolean; diff --git a/src/__tests__/components/BuyCrypto.test.tsx b/src/__tests__/components/BuyCrypto.test.tsx index 4c9498a1a10..e171aa235f5 100644 --- a/src/__tests__/components/BuyCrypto.test.tsx +++ b/src/__tests__/components/BuyCrypto.test.tsx @@ -1,22 +1,19 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import renderer from 'react-test-renderer' -import { createStore } from 'redux' import { BuyCrypto } from '../../components/themed/BuyCrypto' -import { rootReducer } from '../../reducers/RootReducer' import { fakeNavigation } from '../../util/fake/fakeNavigation' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('BuyCrypto', () => { - const mockState: any = { + const mockState: FakeState = { ui: { settings: { defaultIsoFiat: 'iso:DOLLA' } } } - const store = createStore(rootReducer, mockState) it('should render with some props', () => { const fakeWallet: any = { @@ -25,9 +22,9 @@ describe('BuyCrypto', () => { } const actual = renderer.create( - + - + ) expect(actual).toMatchSnapshot() diff --git a/src/__tests__/components/CreateWalletSelectCryptoRow.test.tsx b/src/__tests__/components/CreateWalletSelectCryptoRow.test.tsx index 08a80bae375..d96f6d81ac1 100644 --- a/src/__tests__/components/CreateWalletSelectCryptoRow.test.tsx +++ b/src/__tests__/components/CreateWalletSelectCryptoRow.test.tsx @@ -1,15 +1,13 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' import IonIcon from 'react-native-vector-icons/Ionicons' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { CreateWalletSelectCryptoRow } from '../../components/themed/CreateWalletSelectCryptoRow' -import { rootReducer } from '../../reducers/RootReducer' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('WalletListRow', () => { - const mockState: any = { + const mockState: FakeState = { core: { account: { currencyConfig: { @@ -23,7 +21,6 @@ describe('WalletListRow', () => { } } } - const store = createStore(rootReducer, mockState) it('should render with loading props', () => { const pluginId = 'bitcoin' @@ -32,9 +29,9 @@ describe('WalletListRow', () => { const rightSide = const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/components/CurrencyIcon.test.tsx b/src/__tests__/components/CurrencyIcon.test.tsx index 3839ebcb458..9201fe785e6 100644 --- a/src/__tests__/components/CurrencyIcon.test.tsx +++ b/src/__tests__/components/CurrencyIcon.test.tsx @@ -1,32 +1,28 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { CryptoIcon } from '../../components/icons/CryptoIcon' -import { rootReducer } from '../../reducers/RootReducer' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('CryptoIcon', () => { - const mockState: any = { + const mockState: FakeState = { core: { account: { currencyWallets: { '332s0ds39f': { - pluginId: 'bitcoin', watch: () => {} } } } } } - const store = createStore(rootReducer, mockState) it('should render with loading props', () => { const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/components/MenuTabs.test.tsx b/src/__tests__/components/MenuTabs.test.tsx index 23112770513..753a791965a 100644 --- a/src/__tests__/components/MenuTabs.test.tsx +++ b/src/__tests__/components/MenuTabs.test.tsx @@ -1,19 +1,23 @@ import { describe, expect, it } from '@jest/globals' -import { BottomTabBarProps } from '@react-navigation/bottom-tabs' import * as React from 'react' -import { createRenderer } from 'react-test-renderer/shallow' +import TestRenderer from 'react-test-renderer' import { MenuTabs } from '../../components/themed/MenuTabs' import { fakeNavigation } from '../../util/fake/fakeNavigation' +import { FakeProviders } from '../../util/fake/FakeProviders' describe('MenuTabs', () => { it('should render with loading props', () => { - const renderer = createRenderer() - - const props: BottomTabBarProps = { navigation: fakeNavigation, state: { index: 0, routes: [] } } as any - - const actual = renderer.render() - - expect(actual).toMatchSnapshot() + const renderer = TestRenderer.create( + + + + ) + expect(renderer.toJSON()).toMatchSnapshot() }) }) diff --git a/src/__tests__/components/PromoCard.test.tsx b/src/__tests__/components/PromoCard.test.tsx index de64a409ac4..ccb2b12acd0 100644 --- a/src/__tests__/components/PromoCard.test.tsx +++ b/src/__tests__/components/PromoCard.test.tsx @@ -1,13 +1,11 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import renderer from 'react-test-renderer' -import { createStore } from 'redux' import { PromoCard } from '../../components/cards/PromoCard' -import { rootReducer } from '../../reducers/RootReducer' import { MessageTweak } from '../../types/TweakTypes' import { fakeNavigation } from '../../util/fake/fakeNavigation' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('PromoCard', () => { const fakeMessage: MessageTweak = { @@ -16,27 +14,26 @@ describe('PromoCard', () => { durationDays: 1 } - const mockState: any = { + const mockState: FakeState = { account: { accountReferral: { installerId: 'string', currencyCodes: ['BTC'], promotions: [], ignoreAccountSwap: true, - hiddenAccountMessages: ['messageId'] + hiddenAccountMessages: { messageId: true } }, referralCache: { accountMessages: [fakeMessage] } } } - const store = createStore(rootReducer, mockState) it('should render', () => { const actual = renderer.create( - + - + ) expect(actual).toMatchSnapshot() diff --git a/src/__tests__/components/TransactionListRow.test.tsx b/src/__tests__/components/TransactionListRow.test.tsx index 84a1fd90e18..2a06b75db53 100644 --- a/src/__tests__/components/TransactionListRow.test.tsx +++ b/src/__tests__/components/TransactionListRow.test.tsx @@ -1,12 +1,10 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { TransactionListRow } from '../../components/themed/TransactionListRow' -import { rootReducer } from '../../reducers/RootReducer' import { fakeNavigation } from '../../util/fake/fakeNavigation' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('TransactionListRow', () => { it('should render with loading props', () => { @@ -30,22 +28,21 @@ describe('TransactionListRow', () => { fiatCurrencyCode: 'iso:USD' } - const mockStore: any = { + const mockStore: FakeState = { core: { account: { currencyConfig: { bitcoin: { - allTokens: [], + allTokens: {}, currencyInfo } } } } } - const store = createStore(rootReducer, mockStore) const renderer = TestRenderer.create( - + { ourReceiveAddresses: [] }} /> - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/components/TransactionListTop.test.tsx b/src/__tests__/components/TransactionListTop.test.tsx index ef4b6383e27..64b65f8e049 100644 --- a/src/__tests__/components/TransactionListTop.test.tsx +++ b/src/__tests__/components/TransactionListTop.test.tsx @@ -1,14 +1,11 @@ import { describe, expect, it } from '@jest/globals' import { EdgeCurrencyInfo } from 'edge-core-js' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { applyMiddleware, createStore } from 'redux' -import thunk from 'redux-thunk' import { TransactionListTop } from '../../components/themed/TransactionListTop' -import { rootReducer } from '../../reducers/RootReducer' import { fakeNavigation } from '../../util/fake/fakeNavigation' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('TransactionListTop', () => { const currencyInfo: EdgeCurrencyInfo = { @@ -51,7 +48,7 @@ describe('TransactionListTop', () => { watch() {} } - const fakeState: any = { + const fakeState: FakeState = { core: { account: { currencyWallets: { '123': fakeWallet }, @@ -60,11 +57,9 @@ describe('TransactionListTop', () => { } } - const store = createStore(rootReducer, fakeState, applyMiddleware(thunk)) - it('should render', () => { const renderer = TestRenderer.create( - + { onChangeSortingState={() => undefined} onSearchTransaction={() => undefined} /> - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/components/WalletListFooter.test.tsx b/src/__tests__/components/WalletListFooter.test.tsx index 688bd4d1e19..b6bf859772c 100644 --- a/src/__tests__/components/WalletListFooter.test.tsx +++ b/src/__tests__/components/WalletListFooter.test.tsx @@ -1,21 +1,17 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { WalletListFooter } from '../../components/themed/WalletListFooter' -import { rootReducer } from '../../reducers/RootReducer' import { fakeNavigation } from '../../util/fake/fakeNavigation' +import { FakeProviders } from '../../util/fake/FakeProviders' describe('WalletListFooter', () => { it('should render with loading props', () => { - const store = createStore(rootReducer) - const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/components/__snapshots__/MenuTabs.test.tsx.snap b/src/__tests__/components/__snapshots__/MenuTabs.test.tsx.snap index 087cc4a0867..752b98f89ae 100644 --- a/src/__tests__/components/__snapshots__/MenuTabs.test.tsx.snap +++ b/src/__tests__/components/__snapshots__/MenuTabs.test.tsx.snap @@ -2,28 +2,56 @@ exports[`MenuTabs should render with loading props 1`] = ` - - { - const store = createStore(rootReducer) - it('should render with loading props', () => { const renderer = TestRenderer.create( - + { txid: '' }} /> - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/modals/CategoryModal.test.tsx b/src/__tests__/modals/CategoryModal.test.tsx index 4e17ee55973..9ee7df6825e 100644 --- a/src/__tests__/modals/CategoryModal.test.tsx +++ b/src/__tests__/modals/CategoryModal.test.tsx @@ -1,16 +1,14 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { CategoryModal } from '../../components/modals/CategoryModal' -import { rootReducer } from '../../reducers/RootReducer' import { defaultCategories } from '../../util/categories' import { fakeAirshipBridge } from '../../util/fake/fakeAirshipBridge' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('CategoryModal', () => { - const fakeState: any = { + const fakeState: FakeState = { ui: { scenes: { transactionDetails: { @@ -19,13 +17,12 @@ describe('CategoryModal', () => { } } } - const store = createStore(rootReducer, fakeState) it('should render with an empty subcategory', () => { const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() @@ -33,9 +30,9 @@ describe('CategoryModal', () => { it('should render with a subcategory', () => { const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/modals/WalletListModal.test.tsx b/src/__tests__/modals/WalletListModal.test.tsx index d9f5ddd751e..93457cda545 100644 --- a/src/__tests__/modals/WalletListModal.test.tsx +++ b/src/__tests__/modals/WalletListModal.test.tsx @@ -1,23 +1,19 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { upgradeCurrencyCodes, WalletListModal } from '../../components/modals/WalletListModal' -import { rootReducer } from '../../reducers/RootReducer' import { EdgeTokenId } from '../../types/types' import { fakeAirshipBridge } from '../../util/fake/fakeAirshipBridge' import { fakeNavigation } from '../../util/fake/fakeNavigation' +import { FakeProviders } from '../../util/fake/FakeProviders' describe('WalletListModal', () => { it('should render with loading props', () => { - const store = createStore(rootReducer) - const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/scenes/CreateWalletImportScene.test.tsx b/src/__tests__/scenes/CreateWalletImportScene.test.tsx index be810728aeb..ae365f19457 100644 --- a/src/__tests__/scenes/CreateWalletImportScene.test.tsx +++ b/src/__tests__/scenes/CreateWalletImportScene.test.tsx @@ -1,14 +1,12 @@ import { describe, expect, it, jest } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { CreateWalletImportScene } from '../../components/scenes/CreateWalletImportScene' -import { rootReducer } from '../../reducers/RootReducer' import { RouteProp } from '../../types/routerTypes' import { fakeNavigation } from '../../util/fake/fakeNavigation' import { fakeNonce } from '../../util/fake/fakeNonce' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' jest.mock('react-native-keyboard-aware-scroll-view', () => { const KeyboardAwareScrollView = (blob: { children: React.ReactNode }) => blob.children @@ -20,7 +18,7 @@ jest.mock('../../assets/images/import-key-icon.svg', () => 'ImportKeySvg') describe('CreateWalletImportScene', () => { const nonce = fakeNonce(0) - const mockState: any = { + const mockState: FakeState = { core: { account: { currencyConfig: { @@ -31,7 +29,6 @@ describe('CreateWalletImportScene', () => { } } } - const store = createStore(rootReducer, mockState) it('should render with loading props', () => { const navigation = fakeNavigation @@ -54,9 +51,9 @@ describe('CreateWalletImportScene', () => { } const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/scenes/CreateWalletSelectCryptoScene.test.tsx b/src/__tests__/scenes/CreateWalletSelectCryptoScene.test.tsx index b7117277601..f02a9788ab1 100644 --- a/src/__tests__/scenes/CreateWalletSelectCryptoScene.test.tsx +++ b/src/__tests__/scenes/CreateWalletSelectCryptoScene.test.tsx @@ -1,18 +1,16 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { CreateWalletSelectCryptoScene } from '../../components/scenes/CreateWalletSelectCryptoScene' -import { rootReducer } from '../../reducers/RootReducer' import { RouteProp } from '../../types/routerTypes' import { fakeNavigation } from '../../util/fake/fakeNavigation' import { fakeNonce } from '../../util/fake/fakeNonce' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('CreateWalletSelectCrypto', () => { const nonce = fakeNonce(0) - const mockState: any = { + const mockState: FakeState = { core: { account: { currencyConfig: { @@ -62,7 +60,6 @@ describe('CreateWalletSelectCrypto', () => { } } } - const store = createStore(rootReducer, mockState) it('should render with loading props', () => { const navigation = fakeNavigation @@ -73,9 +70,9 @@ describe('CreateWalletSelectCrypto', () => { } const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/scenes/CreateWalletSelectFiatScene.test.tsx b/src/__tests__/scenes/CreateWalletSelectFiatScene.test.tsx index 505875875b3..709e03b648a 100644 --- a/src/__tests__/scenes/CreateWalletSelectFiatScene.test.tsx +++ b/src/__tests__/scenes/CreateWalletSelectFiatScene.test.tsx @@ -1,18 +1,16 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { CreateWalletSelectFiatScene } from '../../components/scenes/CreateWalletSelectFiatScene' -import { rootReducer } from '../../reducers/RootReducer' import { RouteProp } from '../../types/routerTypes' import { fakeNavigation } from '../../util/fake/fakeNavigation' import { fakeNonce } from '../../util/fake/fakeNonce' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('CreateWalletSelectFiatComponent', () => { const nonce = fakeNonce(0) - const mockState: any = { + const mockState: FakeState = { ui: { settings: { defaultIsoFiat: 'USD' @@ -48,7 +46,6 @@ describe('CreateWalletSelectFiatComponent', () => { } } } - const store = createStore(rootReducer, mockState) it('should render with loading props', () => { const navigation = fakeNavigation @@ -77,9 +74,9 @@ describe('CreateWalletSelectFiatComponent', () => { } } const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/scenes/CurrencyNotificationScene.test.tsx b/src/__tests__/scenes/CurrencyNotificationScene.test.tsx index 957f27a983b..e337063b393 100644 --- a/src/__tests__/scenes/CurrencyNotificationScene.test.tsx +++ b/src/__tests__/scenes/CurrencyNotificationScene.test.tsx @@ -1,16 +1,14 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { CurrencyNotificationScene } from '../../components/scenes/CurrencyNotificationScene' -import { rootReducer } from '../../reducers/RootReducer' import { fakeNonce } from '../../util/fake/fakeNonce' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('CurrencyNotificationComponent', () => { const nonce = fakeNonce(0) - const mockStore: any = { + const mockStore: FakeState = { notificationSettings: { plugins: { bitcoin: { @@ -23,11 +21,9 @@ describe('CurrencyNotificationComponent', () => { } } - const store = createStore(rootReducer, mockStore) - it('should render with loading props', () => { const renderer = TestRenderer.create( - + { } }} /> - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/scenes/CurrencySettings.ui.test.tsx b/src/__tests__/scenes/CurrencySettings.ui.test.tsx index 3109abe2acf..1e8bdce89f3 100644 --- a/src/__tests__/scenes/CurrencySettings.ui.test.tsx +++ b/src/__tests__/scenes/CurrencySettings.ui.test.tsx @@ -1,12 +1,10 @@ import { describe, expect, it } from '@jest/globals' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { CurrencySettingsScene } from '../../components/scenes/CurrencySettingsScene' -import { rootReducer } from '../../reducers/RootReducer' import { fakeNonce } from '../../util/fake/fakeNonce' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' describe('CurrencySettings', () => { const nonce = fakeNonce(0) @@ -21,17 +19,19 @@ describe('CurrencySettings', () => { ], pluginId: 'bitcoin-gold' } - const account: any = { - currencyConfig: { - 'bitcoin-gold': { currencyInfo } + + const state: FakeState = { + core: { + account: { + currencyConfig: { + 'bitcoin-gold': { currencyInfo } + } + } } } - const state: any = { core: { account } } - const store = createStore(rootReducer, state) - const renderer = TestRenderer.create( - + { params: { currencyInfo } }} /> - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/scenes/EdgeLoginScene.test.tsx b/src/__tests__/scenes/EdgeLoginScene.test.tsx index 4a53ee9ba28..38fbd421a64 100644 --- a/src/__tests__/scenes/EdgeLoginScene.test.tsx +++ b/src/__tests__/scenes/EdgeLoginScene.test.tsx @@ -1,15 +1,13 @@ import { describe, expect, it } from '@jest/globals' import { EdgeAccount } from 'edge-core-js' import * as React from 'react' -import { Provider } from 'react-redux' -import { createRenderer } from 'react-test-renderer/shallow' -import { createStore } from 'redux' +import TestRenderer from 'react-test-renderer' import { EdgeLoginScene } from '../../components/scenes/EdgeLoginScene' -import { rootReducer } from '../../reducers/RootReducer' import { RouteProp } from '../../types/routerTypes' import { fakeNavigation } from '../../util/fake/fakeNavigation' import { fakeNonce } from '../../util/fake/fakeNonce' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' import { fakeRootState } from '../../util/fake/fakeRootState' let account: EdgeAccount | undefined @@ -17,7 +15,6 @@ let account: EdgeAccount | undefined describe('EdgeLoginScene', () => { const nonce = fakeNonce(0) it('should render with loading props', () => { - const renderer = createRenderer() const route: RouteProp<'edgeLogin'> = { key: `edgeLogin-${nonce()}`, name: 'edgeLogin', @@ -25,17 +22,14 @@ describe('EdgeLoginScene', () => { lobbyId: 'AmNsSBDVeF2837' } } - const rootState: any = fakeRootState - rootState.core = { - account - } - const store = createStore(rootReducer, rootState) - const actual = renderer.render( - + const rootState: FakeState = { ...fakeRootState, core: { account } } + + const renderer = TestRenderer.create( + - + ) - expect(actual).toMatchSnapshot() + expect(renderer.toJSON()).toMatchSnapshot() }) }) diff --git a/src/__tests__/scenes/SendScene2.ui.test.tsx b/src/__tests__/scenes/SendScene2.ui.test.tsx index bfce26a0f22..5f1ecd54bb2 100644 --- a/src/__tests__/scenes/SendScene2.ui.test.tsx +++ b/src/__tests__/scenes/SendScene2.ui.test.tsx @@ -2,12 +2,9 @@ import { afterAll, beforeAll, describe, expect, it, jest } from '@jest/globals' import { asDate, asMap, asObject, asOptional, asString, asUnknown } from 'cleaners' import { addEdgeCorePlugins, EdgeAccount, EdgeContext, EdgeCurrencyWallet, lockEdgeCorePlugins, makeFakeEdgeWorld } from 'edge-core-js' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { createStore } from 'redux' import { SendScene2 } from '../../components/scenes/SendScene2' -import { rootReducer } from '../../reducers/RootReducer' import { RouteProp } from '../../types/routerTypes' import { avaxCurrencyInfo } from '../../util/fake/fakeAvaxInfo' import { btcCurrencyInfo } from '../../util/fake/fakeBtcInfo' @@ -15,6 +12,7 @@ import { makeFakePlugin } from '../../util/fake/fakeCurrencyPlugin' import { ethCurrencyInfo } from '../../util/fake/fakeEthInfo' import { fakeNavigation } from '../../util/fake/fakeNavigation' import { fakeNonce } from '../../util/fake/fakeNonce' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' import { fakeRootState } from '../../util/fake/fakeRootState' import fakeUser from '../../util/fake/fakeUserDump.json' @@ -86,7 +84,7 @@ describe('SendScene2', () => { it('Render SendScene', () => { if (btcWallet == null) return - const rootState: any = fakeRootState + const rootState: FakeState = { ...fakeRootState, core: { account } } const navigation = fakeNavigation const route: RouteProp<'send2'> = { key: `send2-${nonce()}`, @@ -97,15 +95,10 @@ describe('SendScene2', () => { } } - rootState.core = { - account - } - const store = createStore(rootReducer, rootState) - const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() @@ -113,7 +106,7 @@ describe('SendScene2', () => { it('1 spendTarget', () => { if (btcWallet == null) return - const rootState: any = fakeRootState + const rootState: FakeState = { ...fakeRootState, core: { account } } const navigation = fakeNavigation const route: RouteProp<'send2'> = { key: `send2-${nonce()}`, @@ -127,15 +120,10 @@ describe('SendScene2', () => { } } - rootState.core = { - account - } - const store = createStore(rootReducer, rootState) - const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() @@ -143,7 +131,7 @@ describe('SendScene2', () => { it('1 spendTarget with info tiles', () => { if (btcWallet == null) return - const rootState: any = fakeRootState + const rootState: FakeState = { ...fakeRootState, core: { account } } const navigation = fakeNavigation const route: RouteProp<'send2'> = { key: `send2-${nonce()}`, @@ -161,15 +149,10 @@ describe('SendScene2', () => { } } - rootState.core = { - account - } - const store = createStore(rootReducer, rootState) - const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() @@ -177,7 +160,7 @@ describe('SendScene2', () => { it('2 spendTargets', () => { if (btcWallet == null) return - const rootState: any = fakeRootState + const rootState: FakeState = { ...fakeRootState, core: { account } } const navigation = fakeNavigation const route: RouteProp<'send2'> = { key: `send2-${nonce()}`, @@ -194,15 +177,10 @@ describe('SendScene2', () => { } } - rootState.core = { - account - } - const store = createStore(rootReducer, rootState) - const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() @@ -211,7 +189,7 @@ describe('SendScene2', () => { it('2 spendTargets hide tiles', () => { if (btcWallet == null) return - const rootState: any = fakeRootState + const rootState: FakeState = { ...fakeRootState, core: { account } } const navigation = fakeNavigation const route: RouteProp<'send2'> = { key: `send2-${nonce()}`, @@ -229,16 +207,11 @@ describe('SendScene2', () => { } } - rootState.core = { - account - } - const store = createStore(rootReducer, rootState) - // Hide Address const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() @@ -246,9 +219,9 @@ describe('SendScene2', () => { // @ts-expect-error route.params.hiddenTilesMap = { amount: true } const renderer2 = TestRenderer.create( - + - + ) expect(renderer2.toJSON()).toMatchSnapshot() @@ -256,9 +229,9 @@ describe('SendScene2', () => { // @ts-expect-error route.params.hiddenTilesMap = { amount: true, address: true } const renderer3 = TestRenderer.create( - + - + ) expect(renderer3.toJSON()).toMatchSnapshot() }) @@ -266,7 +239,7 @@ describe('SendScene2', () => { it('2 spendTargets lock tiles', () => { if (btcWallet == null) return - const rootState: any = fakeRootState + const rootState: FakeState = { ...fakeRootState, core: { account } } const navigation = fakeNavigation const route: RouteProp<'send2'> = { key: `send2-${nonce()}`, @@ -284,16 +257,11 @@ describe('SendScene2', () => { } } - rootState.core = { - account - } - const store = createStore(rootReducer, rootState) - // Lock Address const renderer = TestRenderer.create( - + - + ) expect(renderer.toJSON()).toMatchSnapshot() @@ -301,9 +269,9 @@ describe('SendScene2', () => { // @ts-expect-error route.params.lockTilesMap = { amount: true } const renderer2 = TestRenderer.create( - + - + ) expect(renderer2.toJSON()).toMatchSnapshot() @@ -311,9 +279,9 @@ describe('SendScene2', () => { // @ts-expect-error route.params.lockTilesMap = { amount: true, address: true } const renderer3 = TestRenderer.create( - + - + ) expect(renderer3.toJSON()).toMatchSnapshot() }) diff --git a/src/__tests__/scenes/SettingsScene.test.tsx b/src/__tests__/scenes/SettingsScene.test.tsx index 8d5e63869af..327e72e5ae7 100644 --- a/src/__tests__/scenes/SettingsScene.test.tsx +++ b/src/__tests__/scenes/SettingsScene.test.tsx @@ -6,6 +6,7 @@ import TestRenderer from 'react-test-renderer' import { SettingsSceneComponent } from '../../components/scenes/SettingsScene' import { config } from '../../theme/appConfig' import { fakeNavigation } from '../../util/fake/fakeNavigation' +import { FakeProviders } from '../../util/fake/FakeProviders' const typeHack: any = { currencyConfig: {}, @@ -19,33 +20,35 @@ const context: EdgeContext = typeHack describe('MyComponent', () => { it('should render UnLocked SettingsOverview', () => { const renderer = TestRenderer.create( - undefined} - handleClearLogs={() => undefined} - handleSendLogs={() => undefined} - lockSettings={() => undefined} - onTogglePinLoginEnabled={async () => undefined} - setAutoLogoutTimeInSeconds={() => undefined} - showRestoreWalletsModal={() => undefined} - showUnlockSettingsModal={() => undefined} - toggleDeveloperMode={() => undefined} - toggleSpamFilter={() => undefined} - logoutRequest={async () => undefined} - /> + + undefined} + handleClearLogs={() => undefined} + handleSendLogs={() => undefined} + lockSettings={() => undefined} + onTogglePinLoginEnabled={async () => undefined} + setAutoLogoutTimeInSeconds={() => undefined} + showRestoreWalletsModal={() => undefined} + showUnlockSettingsModal={() => undefined} + toggleDeveloperMode={() => undefined} + toggleSpamFilter={() => undefined} + logoutRequest={async () => undefined} + /> + ) expect(renderer.toJSON()).toMatchSnapshot() @@ -53,33 +56,35 @@ describe('MyComponent', () => { it('should render Locked SettingsOverview', () => { const renderer = TestRenderer.create( - undefined} - lockSettings={() => undefined} - handleClearLogs={() => undefined} - handleSendLogs={() => undefined} - onTogglePinLoginEnabled={async () => undefined} - setAutoLogoutTimeInSeconds={() => undefined} - showRestoreWalletsModal={() => undefined} - showUnlockSettingsModal={() => undefined} - toggleDeveloperMode={() => undefined} - toggleSpamFilter={() => undefined} - logoutRequest={async () => undefined} - /> + + undefined} + lockSettings={() => undefined} + handleClearLogs={() => undefined} + handleSendLogs={() => undefined} + onTogglePinLoginEnabled={async () => undefined} + setAutoLogoutTimeInSeconds={() => undefined} + showRestoreWalletsModal={() => undefined} + showUnlockSettingsModal={() => undefined} + toggleDeveloperMode={() => undefined} + toggleSpamFilter={() => undefined} + logoutRequest={async () => undefined} + /> + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/scenes/TransactionDetailsScene.test.tsx b/src/__tests__/scenes/TransactionDetailsScene.test.tsx index b0640521c65..724d660dc97 100644 --- a/src/__tests__/scenes/TransactionDetailsScene.test.tsx +++ b/src/__tests__/scenes/TransactionDetailsScene.test.tsx @@ -1,15 +1,12 @@ import { describe, expect, it } from '@jest/globals' import { EdgeCurrencyInfo } from 'edge-core-js' import * as React from 'react' -import { Provider } from 'react-redux' import TestRenderer from 'react-test-renderer' -import { applyMiddleware, createStore } from 'redux' -import thunk from 'redux-thunk' import { TransactionDetailsScene } from '../../components/scenes/TransactionDetailsScene' -import { rootReducer } from '../../reducers/RootReducer' import { fakeNavigation } from '../../util/fake/fakeNavigation' import { fakeNonce } from '../../util/fake/fakeNonce' +import { FakeProviders, FakeState } from '../../util/fake/FakeProviders' const currencyInfo: EdgeCurrencyInfo = { pluginId: 'bitcoin', @@ -53,7 +50,7 @@ const fakeCoreWallet: any = { describe('TransactionDetailsScene', () => { const nonce = fakeNonce(0) - const fakeState: any = { + const fakeState: FakeState = { core: { account: { currencyWallets: { '123': fakeCoreWallet }, @@ -62,11 +59,9 @@ describe('TransactionDetailsScene', () => { } } - const store = createStore(rootReducer, fakeState, applyMiddleware(thunk)) - it('should render', () => { const renderer = TestRenderer.create( - + { } }} /> - + ) expect(renderer.toJSON()).toMatchSnapshot() @@ -98,7 +93,7 @@ describe('TransactionDetailsScene', () => { it('should render with negative nativeAmount and fiatAmount', () => { const renderer = TestRenderer.create( - + { } }} /> - + ) expect(renderer.toJSON()).toMatchSnapshot() diff --git a/src/__tests__/scenes/__snapshots__/EdgeLoginScene.test.tsx.snap b/src/__tests__/scenes/__snapshots__/EdgeLoginScene.test.tsx.snap index 6a02336929a..ec5ca478b73 100644 --- a/src/__tests__/scenes/__snapshots__/EdgeLoginScene.test.tsx.snap +++ b/src/__tests__/scenes/__snapshots__/EdgeLoginScene.test.tsx.snap @@ -1,66 +1,432 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`EdgeLoginScene should render with loading props 1`] = ` - - + - + > + + + + + + + + + + + +  + + + Warning + + + + This application would like to create or access its wallet in your Edge account. + + It will not have access to any other wallets. + + + + + + + + Accept + + + + + + + + Cancel + + + + + `; diff --git a/src/__tests__/scenes/__snapshots__/FioAddressListScene.test.tsx.snap b/src/__tests__/scenes/__snapshots__/FioAddressListScene.test.tsx.snap index a0e689bdf0c..2a7fb612d08 100644 --- a/src/__tests__/scenes/__snapshots__/FioAddressListScene.test.tsx.snap +++ b/src/__tests__/scenes/__snapshots__/FioAddressListScene.test.tsx.snap @@ -1005,34 +1005,14 @@ exports[`FioAddressList should render with loading props 1`] = ` - - - - - + } + /> `; diff --git a/src/components/App.tsx b/src/components/App.tsx index 790d00f0507..bea5dfc5b7c 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -3,6 +3,7 @@ import '@ethersproject/shims' import * as React from 'react' import { StyleSheet } from 'react-native' import { GestureHandlerRootView } from 'react-native-gesture-handler' +import { SafeAreaProvider } from 'react-native-safe-area-context' import { CrashScene } from './scenes/CrashScene' import { EdgeCoreManager } from './services/EdgeCoreManager' @@ -16,13 +17,15 @@ function logCrash(error: { originalError: unknown }) { export function App(props: {}) { return ( - - - - - - - - + + + + + + + + + + ) } diff --git a/src/components/common/FormField.tsx b/src/components/common/FormField.tsx index 1f80c290269..f7f762ad874 100644 --- a/src/components/common/FormField.tsx +++ b/src/components/common/FormField.tsx @@ -1,9 +1,8 @@ import * as React from 'react' -import { ViewStyle } from 'react-native' +import { Dimensions, ViewStyle } from 'react-native' import { TextField, TextFieldProps } from 'react-native-material-textfield' import { THEME } from '../../theme/variables/airbitz' -import { PLATFORM } from '../../theme/variables/platform' interface Props extends TextFieldProps { autoFocus?: boolean @@ -33,7 +32,7 @@ export class FormField extends React.Component { const containerStyle: ViewStyle = { position: 'relative', - width: PLATFORM.deviceWidth / 1.52, + width: Dimensions.get('window').width / 1.52, height: 60 } diff --git a/src/components/common/FullScreenTransition.tsx b/src/components/common/FullScreenTransition.tsx deleted file mode 100644 index a33ba23001e..00000000000 --- a/src/components/common/FullScreenTransition.tsx +++ /dev/null @@ -1,91 +0,0 @@ -import * as React from 'react' -import { Animated, StyleSheet, View } from 'react-native' - -import { Gradient } from '../../modules/UI/components/Gradient/Gradient.ui' -import { THEME } from '../../theme/variables/airbitz' -import { PLATFORM } from '../../theme/variables/platform' - -interface FullScreenTransitionState { - opacity: Animated.Value -} - -interface FullScreenTransitionProps { - image: React.ReactNode - text: React.ReactNode - onDone: () => void -} - -export class FullScreenTransitionComponent extends React.Component { - constructor(props: FullScreenTransitionProps) { - super(props) - this.state = { - opacity: new Animated.Value(0) - } - } - - componentDidMount = () => { - const { onDone } = this.props - setTimeout(() => { - Animated.sequence([ - Animated.timing(this.state.opacity, { - duration: 1500, - toValue: 1, - useNativeDriver: false - }), - Animated.timing(this.state.opacity, { - duration: 1400, - toValue: 1, - useNativeDriver: false - }), - Animated.timing(this.state.opacity, { - duration: 1500, - toValue: 0, - useNativeDriver: false - }) - ]).start(() => { - onDone() - }) - }, 400) - } - - render() { - const { opacity } = this.state - const { image, text } = this.props - return ( - - - - {image} - {text} - - - ) - } -} - -const styles = StyleSheet.create({ - scene: { - flex: 1, - backgroundColor: THEME.COLORS.WHITE - }, - gradient: { - height: THEME.HEADER, - width: '100%', - position: 'absolute' - }, - view: { - position: 'relative', - top: THEME.HEADER, - paddingHorizontal: 20, - height: PLATFORM.usableHeight - } -}) diff --git a/src/components/common/LayoutContext.ts b/src/components/common/LayoutContext.ts index 70edbf07278..3400fb70f37 100644 --- a/src/components/common/LayoutContext.ts +++ b/src/components/common/LayoutContext.ts @@ -1,8 +1,6 @@ import * as React from 'react' import { Platform, StatusBar } from 'react-native' -import { getInset } from 'react-native-safe-area-view' - -import { useWindowSize } from '../../hooks/useWindowSize' +import { useSafeAreaFrame, useSafeAreaInsets } from 'react-native-safe-area-context' export interface SafeAreaGap { bottom: number @@ -23,11 +21,8 @@ interface Props { } /** - * In the future, React Native will provide this component itself: - * https://github.com/facebook/react-native/pull/20999 - * - * For now, we emulate the proposed API using the community - * react-native-safe-area-view. + * It is better to use the react-native-safe-area-context hooks, + * but if you can't yet, this makes the values available. * * On Android, the height will not subtract the soft menu bar. * Do not rely on the height being correct! Use flexbox to do layout @@ -37,19 +32,20 @@ export function LayoutContext(props: Props) { const { children } = props // Subscribe to the window size: - const { height, width } = useWindowSize() - const isLandscape = height < width + const { height, width } = useSafeAreaFrame() + const safeAreaInsets = useSafeAreaInsets() const metrics: LayoutMetrics = { // @ts-expect-error layout: { x: 0, y: 0, height, width }, - safeAreaInsets: { - bottom: isIos ? getInset('bottom', isLandscape) : 0, - left: isIos ? getInset('left', isLandscape) : 0, - right: isIos ? getInset('right', isLandscape) : 0, - // @ts-expect-error - top: isIos ? getInset('top', isLandscape) : StatusBar.currentHeight - } + safeAreaInsets: isIos + ? safeAreaInsets + : { + bottom: 0, + left: 0, + right: 0, + top: StatusBar.currentHeight ?? 0 + } } return children(metrics) diff --git a/src/components/modals/FlipInputModal.tsx b/src/components/modals/FlipInputModal.tsx index 1f6c20e9d2b..a34f1b70a10 100644 --- a/src/components/modals/FlipInputModal.tsx +++ b/src/components/modals/FlipInputModal.tsx @@ -3,19 +3,17 @@ import { div, eq } from 'biggystring' import { asMaybeNoAmountSpecifiedError, EdgeCurrencyWallet, EdgeDenomination } from 'edge-core-js' import * as React from 'react' -import { TouchableWithoutFeedback, View } from 'react-native' +import { Dimensions, TouchableWithoutFeedback, View } from 'react-native' import { AirshipBridge } from 'react-native-airship' import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome' import { sprintf } from 'sprintf-js' import { updateMaxSpend, updateTransactionAmount } from '../../actions/SendConfirmationActions' -import { MINIMUM_DEVICE_HEIGHT } from '../../constants/constantSettings' import { getSpecialCurrencyInfo } from '../../constants/WalletAndCurrencyConstants' import { formatNumber } from '../../locales/intl' import s from '../../locales/strings' import { getDisplayDenomination, getExchangeDenomination } from '../../selectors/DenominationSelectors' import { getExchangeRate } from '../../selectors/WalletSelectors' -import { deviceHeight } from '../../theme/variables/platform' import { connect } from '../../types/reactRedux' import { NavigationBase } from '../../types/routerTypes' import { GuiCurrencyInfo } from '../../types/types' @@ -251,9 +249,11 @@ export class FlipInputModalComponent extends React.PureComponent { } } +const deviceHeight = Dimensions.get('window').height + const getStyles = cacheStyles((theme: Theme) => ({ hackContainer: { - flex: deviceHeight <= MINIMUM_DEVICE_HEIGHT ? 1 : 0 + flex: deviceHeight <= 580 ? 1 : 0 }, flipInput: { justifyContent: 'flex-start' diff --git a/src/components/modals/FlipInputModal2.tsx b/src/components/modals/FlipInputModal2.tsx index 22479b88855..7f3c4ba7274 100644 --- a/src/components/modals/FlipInputModal2.tsx +++ b/src/components/modals/FlipInputModal2.tsx @@ -2,12 +2,11 @@ import { div, log10, toFixed } from 'biggystring' import { EdgeCurrencyWallet } from 'edge-core-js' import * as React from 'react' import { memo, useState } from 'react' -import { TouchableWithoutFeedback, View } from 'react-native' +import { Dimensions, TouchableWithoutFeedback, View } from 'react-native' import { AirshipBridge } from 'react-native-airship' import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome' import { sprintf } from 'sprintf-js' -import { MINIMUM_DEVICE_HEIGHT } from '../../constants/constantSettings' import { getSpecialCurrencyInfo } from '../../constants/WalletAndCurrencyConstants' import { useDisplayDenom } from '../../hooks/useDisplayDenom' import { useHandler } from '../../hooks/useHandler' @@ -15,7 +14,6 @@ import { useWalletName } from '../../hooks/useWalletName' import { useWatch } from '../../hooks/useWatch' import { formatNumber } from '../../locales/intl' import s from '../../locales/strings' -import { deviceHeight } from '../../theme/variables/platform' import { getCurrencyCode } from '../../util/CurrencyInfoHelpers' import { DECIMAL_PRECISION } from '../../util/utils' import { Card } from '../cards/Card' @@ -238,11 +236,11 @@ const FlipInputModal2Component = React.forwardRef((pro ) }) -export const FlipInputModal2 = memo(FlipInputModal2Component) +const deviceHeight = Dimensions.get('window').height const getStyles = cacheStyles((theme: Theme) => ({ hackContainer: { - flex: deviceHeight <= MINIMUM_DEVICE_HEIGHT ? 1 : 0 + flex: deviceHeight <= 580 ? 1 : 0 }, flipInput: { justifyContent: 'flex-start' @@ -300,3 +298,5 @@ const getStyles = cacheStyles((theme: Theme) => ({ marginLeft: theme.rem(0.5) } })) + +export const FlipInputModal2 = memo(FlipInputModal2Component) diff --git a/src/components/modals/HelpModal.tsx b/src/components/modals/HelpModal.tsx index c3e3586684c..545e1d6d5ed 100644 --- a/src/components/modals/HelpModal.tsx +++ b/src/components/modals/HelpModal.tsx @@ -1,5 +1,5 @@ import * as React from 'react' -import { Image, Keyboard, Linking, Platform, View } from 'react-native' +import { Dimensions, Image, Keyboard, Linking, Platform, View } from 'react-native' import { AirshipBridge } from 'react-native-airship' import { getBuildNumber, getVersion } from 'react-native-device-info' import { WebView } from 'react-native-webview' @@ -8,7 +8,6 @@ import { sprintf } from 'sprintf-js' import { Fontello } from '../../assets/vector' import s from '../../locales/strings' import { config } from '../../theme/appConfig' -import { PLATFORM } from '../../theme/variables/platform' import { Airship } from '../services/AirshipInstance' import { cacheStyles, Theme, ThemeProps, withTheme } from '../services/ThemeContext' import { EdgeText } from '../themed/EdgeText' @@ -151,6 +150,8 @@ export class HelpModalComponent extends React.Component { } } +const deviceHeight = Dimensions.get('window').height + const getStyles = cacheStyles((theme: Theme) => ({ titleContainer: { marginTop: theme.rem(0.5), @@ -162,8 +163,8 @@ const getStyles = cacheStyles((theme: Theme) => ({ height: theme.rem(2.25) }, footer: { - marginTop: PLATFORM.deviceHeight < theme.rem(42) ? 0 : theme.rem(1.5), - paddingVertical: PLATFORM.deviceHeight < theme.rem(42) ? theme.rem(0.25) : theme.rem(0.5), + marginTop: deviceHeight < theme.rem(42) ? 0 : theme.rem(1.5), + paddingVertical: deviceHeight < theme.rem(42) ? theme.rem(0.25) : theme.rem(0.5), flexDirection: 'column', justifyContent: 'center', alignItems: 'center' diff --git a/src/components/modals/QrModal.tsx b/src/components/modals/QrModal.tsx index 7a558f1752e..1d58dfd9029 100644 --- a/src/components/modals/QrModal.tsx +++ b/src/components/modals/QrModal.tsx @@ -1,9 +1,9 @@ import * as React from 'react' import { StyleSheet } from 'react-native' import { AirshipBridge, AirshipModal } from 'react-native-airship' +import { useSafeAreaFrame } from 'react-native-safe-area-context' import { BlurView } from 'rn-id-blurview' -import { useWindowSize } from '../../hooks/useWindowSize' import { useTheme } from '../services/ThemeContext' import { QrCode } from '../themed/QrCode' @@ -15,7 +15,7 @@ interface Props { export function QrModal(props: Props) { const { bridge, data } = props const theme = useTheme() - const windowSize = useWindowSize() + const windowSize = useSafeAreaFrame() const maxSize = Math.min(windowSize.width, windowSize.height) const handleCancel = () => bridge.resolve(undefined) diff --git a/src/components/modals/ScanModal.tsx b/src/components/modals/ScanModal.tsx index 53ecd748307..9e1a20bb2ff 100644 --- a/src/components/modals/ScanModal.tsx +++ b/src/components/modals/ScanModal.tsx @@ -4,11 +4,11 @@ import { AirshipBridge, AirshipModal } from 'react-native-airship' import { RNCamera } from 'react-native-camera' import { launchImageLibrary } from 'react-native-image-picker' import RNPermissions from 'react-native-permissions' +import { useSafeAreaFrame } from 'react-native-safe-area-context' import Ionicon from 'react-native-vector-icons/Ionicons' import RNQRGenerator from 'rn-qr-generator' import { useLayout } from '../../hooks/useLayout' -import { useWindowSize } from '../../hooks/useWindowSize' import s from '../../locales/strings' import { useSelector } from '../../types/reactRedux' import { triggerHaptic } from '../../util/haptic' @@ -37,7 +37,7 @@ export const ScanModal = (props: Props) => { const theme = useTheme() const styles = getStyles(theme) - const { width: windowWidth, height: windowHeight } = useWindowSize() + const { width: windowWidth, height: windowHeight } = useSafeAreaFrame() const isLandscape = windowWidth > windowHeight const cameraPermission = useSelector(state => state.permissions.camera) diff --git a/src/components/progress-indicators/FullScreenLoader.tsx b/src/components/progress-indicators/FullScreenLoader.tsx index 8a908c05488..3f6eaa797d7 100644 --- a/src/components/progress-indicators/FullScreenLoader.tsx +++ b/src/components/progress-indicators/FullScreenLoader.tsx @@ -1,12 +1,10 @@ import * as React from 'react' -import { ActivityIndicator, StyleSheet, View, ViewPropTypes } from 'react-native' +import { ActivityIndicator, StyleSheet, View, ViewStyle } from 'react-native' import { THEME } from '../../theme/variables/airbitz' -import { PLATFORM } from '../../theme/variables/platform' interface Props { - // @ts-expect-error - indicatorStyles?: ViewPropTypes.style + indicatorStyles?: ViewStyle size?: 'large' | 'small' } @@ -23,11 +21,12 @@ export class FullScreenLoader extends React.Component { const styles = StyleSheet.create({ loadingContainer: { - flex: 1, - position: 'absolute', - height: PLATFORM.deviceHeight, - width: PLATFORM.deviceWidth, backgroundColor: THEME.COLORS.OPACITY_GRAY_1, + bottom: 0, + left: 0, + position: 'absolute', + right: 0, + top: 0, zIndex: 1000 }, indicator: { diff --git a/src/components/scenes/CreateWalletAccountSetupScene.tsx b/src/components/scenes/CreateWalletAccountSetupScene.tsx index 1829bc04367..477813d0ec7 100644 --- a/src/components/scenes/CreateWalletAccountSetupScene.tsx +++ b/src/components/scenes/CreateWalletAccountSetupScene.tsx @@ -1,6 +1,6 @@ import { EdgeCurrencyConfig } from 'edge-core-js' import * as React from 'react' -import { ActivityIndicator, Image, ScrollView, StyleSheet, View } from 'react-native' +import { ActivityIndicator, Dimensions, Image, ScrollView, StyleSheet, View } from 'react-native' import { sprintf } from 'sprintf-js' import { checkHandleAvailability } from '../../actions/CreateWalletActions' @@ -14,7 +14,6 @@ import { Gradient } from '../../modules/UI/components/Gradient/Gradient.ui' import { SafeAreaViewComponent as SafeAreaView } from '../../modules/UI/components/SafeAreaView/SafeAreaView.ui' import { HandleAvailableStatus } from '../../reducers/scenes/CreateWalletReducer' import { THEME } from '../../theme/variables/airbitz' -import { PLATFORM } from '../../theme/variables/platform' import { connect } from '../../types/reactRedux' import { NavigationProp, RouteProp } from '../../types/routerTypes' import { scale } from '../../util/scaling' @@ -22,8 +21,6 @@ import { logEvent } from '../../util/tracking' import { debounce } from '../../util/utils' import { FormField, MaterialInputOnWhite } from '../common/FormField' -const deviceWidth = PLATFORM.deviceWidth - interface OwnProps { navigation: NavigationProp<'createWalletAccountSetup'> route: RouteProp<'createWalletAccountSetup'> @@ -136,7 +133,7 @@ export class CreateWalletAccountSetup extends React.Component { ...MaterialInputOnWhite.containerStyle, marginTop: scale(16), marginBottom: scale(24), - width: deviceWidth - scale(25) - scale(40) // substract padding and validation icon + width: Dimensions.get('window').width - scale(25) - scale(40) // substract padding and validation icon }} autoFocus autoCorrect={false} diff --git a/src/components/scenes/FioAddressListScene.tsx b/src/components/scenes/FioAddressListScene.tsx index e46b7eb64b2..4dbf7bb7296 100644 --- a/src/components/scenes/FioAddressListScene.tsx +++ b/src/components/scenes/FioAddressListScene.tsx @@ -8,11 +8,11 @@ import fioAddressLogo from '../../assets/images/fio/fio_logo.png' import { Fontello } from '../../assets/vector' import s from '../../locales/strings' import { FioNameRow } from '../../modules/FioAddress/components/FioName' -import { PLATFORM } from '../../theme/variables/platform' import { connect } from '../../types/reactRedux' import { NavigationProp } from '../../types/routerTypes' import { FioAddress, FioDomain } from '../../types/types' import { SceneWrapper } from '../common/SceneWrapper' +import { FullScreenLoader } from '../progress-indicators/FullScreenLoader' import { showError } from '../services/AirshipInstance' import { cacheStyles, Theme, ThemeProps, withTheme } from '../services/ThemeContext' import { ClickableText } from '../themed/ClickableText' @@ -171,11 +171,7 @@ export class FioAddressList extends React.Component { - - - - - + {!initLoading ? null : } ) } @@ -191,14 +187,6 @@ const getStyles = cacheStyles((theme: Theme) => ({ marginTop: theme.rem(2.5), alignSelf: 'center' }, - initLoadingContainer: { - flex: 1, - top: 0, - left: 0, - position: 'absolute', - width: '100%', - height: PLATFORM.deviceHeight - }, row: { flex: 1 }, diff --git a/src/components/themed/Carousel.tsx b/src/components/themed/Carousel.tsx index ea9ff8e2629..6ec431c092e 100644 --- a/src/components/themed/Carousel.tsx +++ b/src/components/themed/Carousel.tsx @@ -3,8 +3,8 @@ import { useEffect } from 'react' import { LayoutChangeEvent, Pressable, View } from 'react-native' import { Gesture, GestureDetector } from 'react-native-gesture-handler' import Animated, { runOnJS, SharedValue, useAnimatedStyle, useSharedValue, withSpring, withTiming } from 'react-native-reanimated' +import { useSafeAreaFrame } from 'react-native-safe-area-context' -import { useWindowSize } from '../../hooks/useWindowSize' import { useState } from '../../types/reactHooks' import { cacheStyles, Theme, useTheme } from '../services/ThemeContext' @@ -45,7 +45,7 @@ export function Carousel(props: Props) { } // Respond to device orientation changes: - const { width: windowWidth } = useWindowSize() + const { width: windowWidth } = useSafeAreaFrame() useEffect(() => { setItemWidth(itemWidth => itemWidth) }, [windowWidth]) diff --git a/src/components/themed/MenuTabs.tsx b/src/components/themed/MenuTabs.tsx index 2dfecfc0420..2086116b07b 100644 --- a/src/components/themed/MenuTabs.tsx +++ b/src/components/themed/MenuTabs.tsx @@ -2,7 +2,7 @@ import { BottomTabBarProps } from '@react-navigation/bottom-tabs' import * as React from 'react' import { TouchableOpacity, View } from 'react-native' import LinearGradient from 'react-native-linear-gradient' -import { isIPhoneX } from 'react-native-safe-area-view' +import { useSafeAreaInsets } from 'react-native-safe-area-context' import Foundation from 'react-native-vector-icons/Foundation' import Ionicon from 'react-native-vector-icons/Ionicons' @@ -37,6 +37,11 @@ export const MenuTabs = (props: BottomTabBarProps) => { const end = theme.tabBarBackgroundEnd let routes = state.routes + const insets = useSafeAreaInsets() + const safePadding = { + paddingBottom: theme.rem(0.75) + insets.bottom + } + const handleOnPress = useHandler((route: string) => { switch (route) { case 'coinRanking': @@ -73,7 +78,7 @@ export const MenuTabs = (props: BottomTabBarProps) => { extraTab: } return ( - handleOnPress(route.name)}> + handleOnPress(route.name)}> {icon[route.name]} {title[route.name]} @@ -93,7 +98,6 @@ const getStyles = cacheStyles((theme: Theme) => ({ content: { flex: 1, paddingTop: theme.rem(0.75), - paddingBottom: isIPhoneX ? theme.rem(2.125) : theme.rem(0.75), justifyContent: 'center', alignItems: 'center' }, diff --git a/src/constants/constantSettings.ts b/src/constants/constantSettings.ts index 948f6ad57bb..5c9b060643b 100644 --- a/src/constants/constantSettings.ts +++ b/src/constants/constantSettings.ts @@ -5,4 +5,3 @@ export const TUTORIAL = 'tutorial.json' export const SCAM_WARNING = 'scamWarning.json' export const AAVE_WELCOME = 'aaveWelcome.json' export const TOKEN_TERMS_AGREEMENT = 'ttAgreement.json' -export const MINIMUM_DEVICE_HEIGHT = 580 diff --git a/src/hooks/useWindowSize.ts b/src/hooks/useWindowSize.ts deleted file mode 100644 index b8f14e52608..00000000000 --- a/src/hooks/useWindowSize.ts +++ /dev/null @@ -1,23 +0,0 @@ -import * as React from 'react' -import { Dimensions } from 'react-native' - -interface ScaledSize { - width: number - height: number -} - -/** - * Subscribes to the window dimensions, for use in style calculations. - */ -export function useWindowSize(): ScaledSize { - const [windowSize, setWindowSize] = React.useState(() => Dimensions.get('window')) - - React.useEffect(() => { - // @ts-expect-error - const handleChange = ({ window }) => setWindowSize(window) - const listener = Dimensions.addEventListener('change', handleChange) - return () => listener.remove() - }, []) - - return windowSize -} diff --git a/src/modules/UI/components/SafeAreaView/SafeAreaView.ui.tsx b/src/modules/UI/components/SafeAreaView/SafeAreaView.ui.tsx index f9150070934..4502f48dc3f 100644 --- a/src/modules/UI/components/SafeAreaView/SafeAreaView.ui.tsx +++ b/src/modules/UI/components/SafeAreaView/SafeAreaView.ui.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { ViewStyle } from 'react-native' -import SafeAreaView from 'react-native-safe-area-view' +import { SafeAreaView } from 'react-native-safe-area-context' import { THEME } from '../../../../theme/variables/airbitz' import { Gradient } from '../../components/Gradient/Gradient.ui' diff --git a/src/theme/variables/edgeDark.ts b/src/theme/variables/edgeDark.ts index 84eedabc4e3..e3b8eb81963 100644 --- a/src/theme/variables/edgeDark.ts +++ b/src/theme/variables/edgeDark.ts @@ -1,4 +1,4 @@ -import { Platform } from 'react-native' +import { Dimensions, Platform } from 'react-native' import fioAddressLogo from '../../assets/images/details_fioAddress.png' import edgeMark from '../../assets/images/edgeLogo/Edge_logo_Icon.png' @@ -25,7 +25,6 @@ import walletListSlidingTutorial from '../../assets/images/tutorials/walletList_ import { EDGE_CONTENT_SERVER_URI } from '../../constants/CdnConstants' import { textNoShadow, Theme, themeNoShadow } from '../../types/Theme' import { scale } from '../../util/scaling' -import { PLATFORM } from './platform' const palette = { white: '#FFFFFF', @@ -68,6 +67,8 @@ const palette = { QuicksandBold: 'Quicksand-Bold' } +const deviceWidth = Dimensions.get('window').width + export const edgeDark: Theme = { rem(size: number): number { return Math.round(scale(16) * size) @@ -255,7 +256,7 @@ export const edgeDark: Theme = { confirmationSliderThumb: palette.edgeMint, confirmationSliderTextDeactivated: palette.gray, confirmationThumbDeactivated: palette.gray, - confirmationSliderWidth: PLATFORM.deviceWidth >= 340 ? 295 : PLATFORM.deviceWidth - 45, + confirmationSliderWidth: deviceWidth >= 340 ? 295 : deviceWidth - 45, confirmationSliderThumbWidth: 55, // Lines diff --git a/src/theme/variables/edgeLight.ts b/src/theme/variables/edgeLight.ts index 8e4160c6d90..8c247231787 100644 --- a/src/theme/variables/edgeLight.ts +++ b/src/theme/variables/edgeLight.ts @@ -1,4 +1,4 @@ -import { Platform } from 'react-native' +import { Dimensions, Platform } from 'react-native' import edgeMark from '../../assets/images/edgeLogo/Edge_logo_Icon.png' import edgeLogo from '../../assets/images/edgeLogo/Edge_logo_L.png' @@ -25,7 +25,6 @@ import walletListSlidingTutorial from '../../assets/images/tutorials/walletList_ import { EDGE_CONTENT_SERVER_URI } from '../../constants/CdnConstants' import { textNoShadow, Theme, themeNoShadow } from '../../types/Theme' import { scale } from '../../util/scaling' -import { PLATFORM } from './platform' const palette = { black: '#000000', @@ -65,6 +64,8 @@ const palette = { QuicksandBold: 'Quicksand-Bold' } +const deviceWidth = Dimensions.get('window').width + export const edgeLight: Theme = { rem(size: number): number { return Math.round(scale(16) * size) @@ -257,7 +258,7 @@ export const edgeLight: Theme = { confirmationSliderThumb: palette.edgeBlue, confirmationSliderTextDeactivated: palette.gray, confirmationThumbDeactivated: palette.gray, - confirmationSliderWidth: PLATFORM.deviceWidth >= 340 ? 295 : PLATFORM.deviceWidth - 45, + confirmationSliderWidth: deviceWidth >= 340 ? 295 : deviceWidth - 45, confirmationSliderThumbWidth: 55, // Lines diff --git a/src/theme/variables/platform.ts b/src/theme/variables/platform.ts deleted file mode 100644 index 5f0f668a7cc..00000000000 --- a/src/theme/variables/platform.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { Dimensions, Platform } from 'react-native' -import ExtraDimensions from 'react-native-extra-dimensions-android' -import { isIPhoneX } from 'react-native-safe-area-view' - -export const deviceWidth = Dimensions.get('window').width -export const deviceHeight = Platform.OS === 'ios' ? Dimensions.get('window').height : ExtraDimensions.get('REAL_WINDOW_HEIGHT') - -export const PLATFORM = { - // device - toolbar - footer - usableHeight: deviceHeight - (Platform.OS === 'ios' ? 44 : 62) - 69 - (isIPhoneX ? 57 : 0), - deviceWidth, - deviceHeight -} diff --git a/src/theme/variables/testDark.ts b/src/theme/variables/testDark.ts index e45ac9b1a5d..dac216c20f8 100644 --- a/src/theme/variables/testDark.ts +++ b/src/theme/variables/testDark.ts @@ -1,4 +1,4 @@ -import { Platform } from 'react-native' +import { Dimensions, Platform } from 'react-native' import backgroundImage from '../../assets/images/backgrounds/login_bg.jpg' import fioAddressLogo from '../../assets/images/details_fioAddress.png' @@ -24,7 +24,6 @@ import walletListSlidingTutorial from '../../assets/images/tutorials/walletList_ import { EDGE_CONTENT_SERVER_URI } from '../../constants/CdnConstants' import { textNoShadow, Theme, themeNoShadow } from '../../types/Theme' import { scale } from '../../util/scaling' -import { PLATFORM } from './platform' const palette = { white: '#FDF2D5', @@ -73,6 +72,8 @@ const palette = { QuicksandBold: 'Quicksand-Bold' } +const deviceWidth = Dimensions.get('window').width + export const testDark: Theme = { rem(size: number): number { return Math.round(scale(16) * size) @@ -270,7 +271,7 @@ export const testDark: Theme = { confirmationSliderThumb: palette.edgeMint, confirmationSliderTextDeactivated: palette.gray, confirmationThumbDeactivated: palette.gray, - confirmationSliderWidth: PLATFORM.deviceWidth >= 340 ? 295 : PLATFORM.deviceWidth - 45, + confirmationSliderWidth: deviceWidth >= 340 ? 295 : deviceWidth - 45, confirmationSliderThumbWidth: 55, // Lines diff --git a/src/theme/variables/testLight.ts b/src/theme/variables/testLight.ts index 245a4f9f463..5c95e6eb9fd 100644 --- a/src/theme/variables/testLight.ts +++ b/src/theme/variables/testLight.ts @@ -1,4 +1,4 @@ -import { Platform } from 'react-native' +import { Dimensions, Platform } from 'react-native' import edgeLogo from '../../assets/images/edgeLogo/Edge_logo_L.png' import guiPluginLogoBitaccess from '../../assets/images/guiPlugins/guiPluginLogoBitaccessDark.png' @@ -24,7 +24,6 @@ import walletListSlidingTutorial from '../../assets/images/tutorials/walletList_ import { EDGE_CONTENT_SERVER_URI } from '../../constants/CdnConstants' import { textNoShadow, Theme, themeNoShadow } from '../../types/Theme' import { scale } from '../../util/scaling' -import { PLATFORM } from './platform' const palette = { black: '#000000', @@ -64,6 +63,8 @@ const palette = { QuicksandBold: 'Quicksand-Bold' } +const deviceWidth = Dimensions.get('window').width + export const testLight: Theme = { rem(size: number): number { return Math.round(scale(16) * size) @@ -256,7 +257,7 @@ export const testLight: Theme = { confirmationSliderThumb: palette.edgeBlue, confirmationSliderTextDeactivated: palette.gray, confirmationThumbDeactivated: palette.gray, - confirmationSliderWidth: PLATFORM.deviceWidth >= 340 ? 295 : PLATFORM.deviceWidth - 45, + confirmationSliderWidth: deviceWidth >= 340 ? 295 : deviceWidth - 45, confirmationSliderThumbWidth: 55, // Lines diff --git a/src/util/fake/FakeProviders.tsx b/src/util/fake/FakeProviders.tsx new file mode 100644 index 00000000000..808f983a4f1 --- /dev/null +++ b/src/util/fake/FakeProviders.tsx @@ -0,0 +1,37 @@ +import * as React from 'react' +import { Metrics, SafeAreaProvider } from 'react-native-safe-area-context' +import { Provider } from 'react-redux' +import { applyMiddleware, createStore } from 'redux' +import thunk from 'redux-thunk' + +import { rootReducer, RootState } from '../../reducers/RootReducer' + +type DeepPartial = T extends object + ? { + [P in keyof T]?: DeepPartial + } + : T + +export type FakeState = DeepPartial + +interface Props { + children: React.ReactNode + initialState?: FakeState +} + +export function FakeProviders(props: Props) { + const { children, initialState = {} } = props + + const store = React.useMemo(() => createStore(rootReducer, initialState as any, applyMiddleware(thunk)), [initialState]) + return ( + + {children} + + ) +} + +// These match what our old react-native-safe-area-view library returned: +const initialMetrics: Metrics = { + frame: { height: 1334, width: 750, x: 0, y: 0 }, + insets: { bottom: 0, left: 0, right: 0, top: 20 } +} diff --git a/src/util/fake/fakeRootState.ts b/src/util/fake/fakeRootState.ts index 5c3f6cc57ca..ad07fcd3caa 100644 --- a/src/util/fake/fakeRootState.ts +++ b/src/util/fake/fakeRootState.ts @@ -1,4 +1,6 @@ -export const fakeRootState = { +import { FakeState } from './FakeProviders' + +export const fakeRootState: FakeState = { contacts: [ { jobTitle: '', diff --git a/yarn.lock b/yarn.lock index 3fc6adef52a..7761146d733 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3570,11 +3570,6 @@ resolved "https://registry.yarnpkg.com/@types/react-native-custom-tabs/-/react-native-custom-tabs-0.1.2.tgz#725e2f01721f304890c54cd1814e8d8f4ccaf129" integrity sha512-GWPd/r6voEIZb7va+3rsLxeT8j9GpUUM8FPBcBJ5RXM+kmJneFz05GANQiD+si+E4MztWmeUemCUxMeEsaYktQ== -"@types/react-native-extra-dimensions-android@^1.2.0": - version "1.2.0" - resolved "https://registry.yarnpkg.com/@types/react-native-extra-dimensions-android/-/react-native-extra-dimensions-android-1.2.0.tgz#50c7e9b252f04ce0c3bc0945ac687a403fe8ec4f" - integrity sha512-9lUeO0P/yXBPlR8KjIKttqLXy/zRS0a6tofiCooDRcT2YXWkhVAoXZv7y/5opzUdCORk6eSMkfMRLbRjs8v5Uw== - "@types/react-native-material-textfield@^0.16.5": version "0.16.5" resolved "https://registry.yarnpkg.com/@types/react-native-material-textfield/-/react-native-material-textfield-0.16.5.tgz#fe91ef6339c282668f6eae24ca09a69f0a974974" @@ -9988,11 +9983,6 @@ hmac-drbg@^1.0.1: minimalistic-assert "^1.0.0" minimalistic-crypto-utils "^1.0.1" -hoist-non-react-statics@^2.3.1: - version "2.5.5" - resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz#c5903cf409c0dfd908f388e619d86b9c1174cb47" - integrity sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw== - hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.2: version "3.3.2" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" @@ -14030,11 +14020,6 @@ react-native-device-info@^8.7.1: resolved "https://registry.yarnpkg.com/react-native-device-info/-/react-native-device-info-8.7.1.tgz#fbb06f87dbbc4423abe713874699fb2e6e99fd15" integrity sha512-cVMZztFa2Qn6qpQa601W61CtUwZQ1KXfqCOeltejAWEXmgIWivC692WGSdtGudj4upSi1UgMSaGcvKjfcpdGjg== -react-native-extra-dimensions-android@^1.2.5: - version "1.2.5" - resolved "https://registry.yarnpkg.com/react-native-extra-dimensions-android/-/react-native-extra-dimensions-android-1.2.5.tgz#8ade91029aaac7519bf305116d39019e618a60f0" - integrity sha512-eorFo9X1vEqAWUkgcZ300yKBG1wtgNeE7tdWAH2CE+P50FGTniJg5Sr6l1iPWG8ZskQOuF+KeiSTFlDa4vLfMw== - react-native-fast-image@^8.5.11: version "8.5.11" resolved "https://registry.yarnpkg.com/react-native-fast-image/-/react-native-fast-image-8.5.11.tgz#e3dc969d0e4e8df026646bf18194465aa55cbc2b" @@ -14163,13 +14148,6 @@ react-native-safe-area-context@^4.5.0: resolved "https://registry.yarnpkg.com/react-native-safe-area-context/-/react-native-safe-area-context-4.5.0.tgz#9208313236e8f49e1920ac1e2a2c975f03aed284" integrity sha512-0WORnk9SkREGUg2V7jHZbuN5x4vcxj/1B0QOcXJjdYWrzZHgLcUzYWWIUecUPJh747Mwjt/42RZDOaFn3L8kPQ== -react-native-safe-area-view@0.14.9: - version "0.14.9" - resolved "https://registry.yarnpkg.com/react-native-safe-area-view/-/react-native-safe-area-view-0.14.9.tgz#90ee8383037010d9a5055a97cf97e4c1da1f0c3d" - integrity sha512-WII/ulhpVyL/qbYb7vydq7dJAfZRBcEhg4/UWt6F6nAKpLa3gAceMOxBxI914ppwSP/TdUsandFy6lkJQE0z4A== - dependencies: - hoist-non-react-statics "^2.3.1" - react-native-screens@^3.19.0: version "3.19.0" resolved "https://registry.yarnpkg.com/react-native-screens/-/react-native-screens-3.19.0.tgz#ec68685e04b074ebce4641b3a0ae7e2571629b75"