Browser: new architecture (#5671)

ios/Podfile.lock

@@ -5,13 +5,13 @@ PODS:
     - React-Core
   - CocoaAsyncSocket (7.6.5)
   - DoubleConversion (1.1.6)
-  - FasterImage (1.4.3):
-    - FasterImage/Nuke (= 1.4.3)
-    - FasterImage/NukeUI (= 1.4.3)
+  - FasterImage (1.5.0):
+    - FasterImage/Nuke (= 1.5.0)
+    - FasterImage/NukeUI (= 1.5.0)
     - React-Core
-  - FasterImage/Nuke (1.4.3):
+  - FasterImage/Nuke (1.5.0):
     - React-Core
-  - FasterImage/NukeUI (1.4.3):
+  - FasterImage/NukeUI (1.5.0):
     - React-Core
   - FBLazyVector (0.72.3)
   - FBReactNativeSpec (0.72.3):
@@ -1256,7 +1256,7 @@ SPEC CHECKSUMS:
   BVLinearGradient: 880f91a7854faff2df62518f0281afb1c60d49a3
   CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99
   DoubleConversion: 5189b271737e1565bdce30deb4a08d647e3f5f54
-  FasterImage: 60d0750ddbcefff0070c4c17309c2d1d6cc650f0
+  FasterImage: 1f65cdb2966c47b2a7b83162e5fc712534e50149
   FBLazyVector: 4cce221dd782d3ff7c4172167bba09d58af67ccb
   FBReactNativeSpec: c6bd9e179757b3c0ecf815864fae8032377903ef
   Firebase: 91fefd38712feb9186ea8996af6cbdef41473442

package.json

@@ -64,7 +64,7 @@
   "dependencies": {
     "@bankify/react-native-animate-number": "0.2.1",
     "@bradgarropy/use-countdown": "1.4.1",
-    "@candlefinance/faster-image": "1.4.3",
+    "@candlefinance/faster-image": "1.5.0",
     "@capsizecss/core": "3.0.0",
     "@ensdomains/address-encoder": "0.2.16",
     "@ensdomains/content-hash": "2.5.7",
@@ -204,6 +204,7 @@
     "react": "18.2.0",
     "react-coin-icon": "rainbow-me/react-coin-icon#06464588a3d986f6ef3a7d7341b2d7ea0c5ac50b",
     "react-fast-compare": "2.0.4",
+    "react-fast-memo": "2.0.1",
     "react-flatten-children": "1.1.2",
     "react-freeze": "1.0.3",
     "react-native": "0.72.3",

patches/@candlefinance+faster-image+1.5.0.patch

@@ -0,0 +1,29 @@
+diff --git a/node_modules/@candlefinance/faster-image/ios/FasterImageViewManager.swift b/node_modules/@candlefinance/faster-image/ios/FasterImageViewManager.swift
+index a0b0ac6..e093754 100644
+--- a/node_modules/@candlefinance/faster-image/ios/FasterImageViewManager.swift
++++ b/node_modules/@candlefinance/faster-image/ios/FasterImageViewManager.swift
+@@ -41,7 +41,10 @@ final class FasterImageView: UIView {
+             lazyImageView.trailingAnchor.constraint(equalTo: trailingAnchor),
+         ])
+         lazyImageView.pipeline = .shared
+-        lazyImageView.priority = .high
++        // 🌈🌈
++        lazyImageView.priority = .veryLow
++//        lazyImageView.priority = .high
++        // 🌈🌈
+         lazyImageView.onCompletion = { [weak self] result in
+             self?.completionHandler(with: result)
+         }
+@@ -121,11 +124,7 @@ final class FasterImageView: UIView {
+         }
+     }
+
+-    var showActivityIndicator = false {
+-        didSet {
+-            lazyImageView.placeholderView = UIActivityIndicatorView()
+-        }
+-    }
++    var showActivityIndicator = false
+
+     var resizeMode = "contain" {
+         didSet {

patches/react-native-reanimated+3.7.1.patch → patches/react-native-reanimated+3.8.0.patch

@@ -1,7 +1,6 @@
 diff --git a/node_modules/react-native-reanimated/.DS_Store b/node_modules/react-native-reanimated/.DS_Store
 new file mode 100644
-index 0000000..928aae8
-Binary files /dev/null and b/node_modules/react-native-reanimated/.DS_Store differ
+index 0000000..e69de29
 diff --git a/node_modules/react-native-reanimated/apple/REANodesManager.mm b/node_modules/react-native-reanimated/apple/REANodesManager.mm
 index ed36c99..0156141 100644
 --- a/node_modules/react-native-reanimated/apple/REANodesManager.mm
@@ -19,3 +18,15 @@ index ed36c99..0156141 100644
  #endif
      [_displayLink addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSRunLoopCommonModes];
    }
+diff --git a/node_modules/react-native-reanimated/src/propsAllowlists.ts b/node_modules/react-native-reanimated/src/propsAllowlists.ts
+index 5e004b7..0f752e0 100644
+--- a/node_modules/react-native-reanimated/src/propsAllowlists.ts
++++ b/node_modules/react-native-reanimated/src/propsAllowlists.ts
+@@ -85,6 +85,7 @@ export const PropsAllowlists: AllowlistsHolder = {
+     elevation: true,
+     fontSize: true,
+     lineHeight: true,
++    textShadowColor: true,
+     textShadowRadius: true,
+     textShadowOffset: true,
+     letterSpacing: true,

src/__swaps__/screens/Swap/components/GestureHandlerV1Button.tsx

@@ -2,11 +2,12 @@ import ConditionalWrap from 'conditional-wrap';
 import React from 'react';
 import { StyleProp, ViewProps, ViewStyle } from 'react-native';
 import { TapGestureHandler, TapGestureHandlerGestureEvent } from 'react-native-gesture-handler';
-import Animated, { runOnJS, useAnimatedGestureHandler } from 'react-native-reanimated';
+import Animated, { AnimatedStyle, runOnJS, useAnimatedGestureHandler } from 'react-native-reanimated';
 import { ButtonPressAnimation } from '@/components/animations';
 import { IS_IOS } from '@/env';
 
 export type GestureHandlerButtonProps = {
+  buttonPressWrapperStyleIOS?: StyleProp<ViewStyle>;
   children: React.ReactNode;
   disableButtonPressWrapper?: boolean;
   disabled?: boolean;
@@ -15,7 +16,7 @@ export type GestureHandlerButtonProps = {
   onPressWorklet?: () => void;
   pointerEvents?: ViewProps['pointerEvents'];
   scaleTo?: number;
-  style?: StyleProp<ViewStyle>;
+  style?: StyleProp<ViewStyle> | AnimatedStyle;
 };
 
 /**
@@ -57,6 +58,7 @@ export type GestureHandlerButtonProps = {
  */
 export const GestureHandlerV1Button = React.forwardRef(function GestureHandlerV1Button(
   {
+    buttonPressWrapperStyleIOS,
     children,
     disableButtonPressWrapper = false,
     disabled = false,
@@ -67,7 +69,7 @@ export const GestureHandlerV1Button = React.forwardRef(function GestureHandlerV1
     scaleTo = 0.86,
     style,
   }: GestureHandlerButtonProps,
-  forwardedRef: React.LegacyRef<any> | undefined
+  forwardedRef: React.LegacyRef<unknown> | undefined
 ) {
   const pressHandler = useAnimatedGestureHandler<TapGestureHandlerGestureEvent>({
     onStart: () => {
@@ -83,7 +85,7 @@ export const GestureHandlerV1Button = React.forwardRef(function GestureHandlerV1
     <ConditionalWrap
       condition={IS_IOS && !disableButtonPressWrapper}
       wrap={children => (
-        <ButtonPressAnimation scaleTo={disabled ? 1 : scaleTo} useLateHaptic={disabled}>
+        <ButtonPressAnimation scaleTo={disabled ? 1 : scaleTo} style={buttonPressWrapperStyleIOS} useLateHaptic={disabled}>
           {children}
         </ButtonPressAnimation>
       )}

src/components/AnimatedComponents/AnimatedBlurView.ts

@@ -0,0 +1,4 @@
+import { BlurView } from '@react-native-community/blur';
+import Animated from 'react-native-reanimated';
+
+export const AnimatedBlurView = Animated.createAnimatedComponent(BlurView);

src/components/AnimatedComponents/AnimatedFasterImage.ts

@@ -0,0 +1,4 @@
+import { FasterImageView } from '@candlefinance/faster-image';
+import Animated from 'react-native-reanimated';
+
+export const AnimatedFasterImage = Animated.createAnimatedComponent(FasterImageView);

src/components/AnimatedComponents/AnimatedInput.ts

@@ -0,0 +1,4 @@
+import Animated from 'react-native-reanimated';
+import Input from '@/components/inputs/Input';
+
+export const AnimatedInput = Animated.createAnimatedComponent(Input);

src/components/AnimatedComponents/AnimatedScrollView.ts

@@ -0,0 +1,4 @@
+import { ScrollView } from 'react-native-gesture-handler';
+import Animated from 'react-native-reanimated';
+
+export const AnimatedScrollView = Animated.createAnimatedComponent(ScrollView);

src/components/AnimatedComponents/extendedPropsAllowlists.ts

@@ -0,0 +1,23 @@
+import Animated from 'react-native-reanimated';
+
+/**
+ * These lists extend the built-in props allowlists for Animated components.
+ *
+ * The default list for the latest version of Reanimated can be found here:
+ * https://github.com/software-mansion/react-native-reanimated/blob/main/src/propsAllowlists.ts
+ */
+
+/**
+ * 🟡 Extended Native props allowlist 🟡
+ */
+Animated.addWhitelistedNativeProps({
+  defaultValue: true, // AnimatedTextInput
+  text: true, // AnimatedTextInput
+});
+
+/**
+ * 🔵 Extended UI props allowlist 🔵
+ */
+Animated.addWhitelistedUIProps({
+  source: true, // AnimatedFasterImage
+});