From 59f536c4791674d112435929374e002b5b3bcc7a Mon Sep 17 00:00:00 2001 From: Siddarth Kumar Date: Fri, 19 Apr 2024 15:03:12 +0200 Subject: [PATCH] upgrade blur lib to 4.4.0 (#19681) ## Summary This commit swaps the fork of @react-native-community/blur with a patch and upgrades the library to latest version of 4.4.0 needed for : https://github.com/status-im/status-mobile/issues/18138 ## Review & Test notes Verify if blur stuff still works. ## Platforms - iOS - Android status: ready --- ios/Podfile.lock | 6 ++- package.json | 2 +- patches/BlurView-build.gradle.patch | 11 ++++ patches/BlurView.ios.tsx.patch | 10 ++++ patches/BlurView.mm.patch | 57 ++++++++++++++++++++ patches/BlurViewNativeComponent.ts.patch | 10 ++++ patches/VibrancyViewNativeComponent.ts.patch | 10 ++++ yarn.lock | 7 +-- 8 files changed, 107 insertions(+), 6 deletions(-) create mode 100644 patches/BlurView-build.gradle.patch create mode 100644 patches/BlurView.ios.tsx.patch create mode 100644 patches/BlurView.mm.patch create mode 100644 patches/BlurViewNativeComponent.ts.patch create mode 100644 patches/VibrancyViewNativeComponent.ts.patch diff --git a/ios/Podfile.lock b/ios/Podfile.lock index 749f6bcb73..2f382511ba 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -879,7 +879,9 @@ PODS: - React-Core - react-native-blob-util (0.13.18): - React-Core - - react-native-blur (4.3.3): + - react-native-blur (4.4.0): + - glog + - RCT-Folly (= 2022.05.16.00) - React-Core - react-native-cameraroll (7.5.2): - glog @@ -1476,7 +1478,7 @@ SPEC CHECKSUMS: react-native-background-timer: 1f7d560647b40e6a60b01c452ba29c54bf581fc4 react-native-biometrics: 352e5a794bfffc46a0c86725ea7dc62deb085bdc react-native-blob-util: 600972b1782380a5a7d5db61a3817ea32349dae9 - react-native-blur: c6d0a1dc2b4b519f7afe3b14d8151998632b6d18 + react-native-blur: 799045500f56146afc46245148080e7b7623cb75 react-native-cameraroll: af8eec1e585d053ff485d98ec837f9a8a11b5745 react-native-config: 5330c8258265c1e5fdb8c009d2cabd6badd96727 react-native-hole-view: 6935448993bac79f2b5a4ad7e9741094cf810679 diff --git a/package.json b/package.json index 76e920261e..c23b103b43 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,7 @@ "@react-native-camera-roll/camera-roll": "7.5.2", "@react-native-clipboard/clipboard": "1.13.2", "@react-native-community/audio-toolkit": "git+https://github.com/tbenr/react-native-audio-toolkit.git#refs/tags/v2.0.3-status-v6", - "@react-native-community/blur": "git+https://github.com/status-im/react-native-blur.git#refs/tags/v4.3.3-status", + "@react-native-community/blur": "4.4.0", "@react-native-community/hooks": "^3.0.0", "@react-native-community/masked-view": "^0.1.6", "@react-native-community/netinfo": "^4.4.0", diff --git a/patches/BlurView-build.gradle.patch b/patches/BlurView-build.gradle.patch new file mode 100644 index 0000000000..cd93e309ca --- /dev/null +++ b/patches/BlurView-build.gradle.patch @@ -0,0 +1,11 @@ +--- /tmp/tmp-status-mobile-851dbcb56/tmp.gcyqIAUEIA/build.gradle 2024-04-16 18:11:12.481819000 +0200 ++++ ./node_modules/@react-native-community/blur/android/build.gradle 2024-04-16 18:11:18.889991702 +0200 +@@ -5,7 +5,7 @@ + } + + dependencies { +- classpath 'com.android.tools.build:gradle:3.5.3' ++ classpath 'com.android.tools.build:gradle:3.5.4' + } + } + diff --git a/patches/BlurView.ios.tsx.patch b/patches/BlurView.ios.tsx.patch new file mode 100644 index 0000000000..85b09c59e5 --- /dev/null +++ b/patches/BlurView.ios.tsx.patch @@ -0,0 +1,10 @@ +--- /tmp/tmp-status-mobile-61974dae4/tmp.6k5ZPUa0Hp/BlurView.ios.tsx 2024-04-16 17:07:33.229847000 +0200 ++++ ./node_modules/@react-native-community/blur/src/components/BlurView.ios.tsx 2024-04-16 17:07:58.540617624 +0200 +@@ -6,6 +6,7 @@ + | 'dark' + | 'light' + | 'xlight' ++ | 'transparent' + | 'prominent' + | 'regular' + | 'extraDark' diff --git a/patches/BlurView.mm.patch b/patches/BlurView.mm.patch new file mode 100644 index 0000000000..13bf7d36d3 --- /dev/null +++ b/patches/BlurView.mm.patch @@ -0,0 +1,57 @@ +--- /tmp/tmp-status-mobile-851dbcb56/tmp.beqWjtcNwi/BlurView.mm 2024-04-16 17:55:00.688450000 +0200 ++++ ./node_modules/@react-native-community/blur/ios/BlurView.mm 2024-04-16 17:56:17.772952042 +0200 +@@ -73,7 +73,7 @@ + { + const auto &oldViewProps = *std::static_pointer_cast(_props); + const auto &newViewProps = *std::static_pointer_cast(props); +- ++ + if (oldViewProps.blurAmount != newViewProps.blurAmount) { + NSNumber *blurAmount = [NSNumber numberWithInt:newViewProps.blurAmount]; + [self setBlurAmount:blurAmount]; +@@ -83,12 +83,12 @@ + NSString *blurType = [NSString stringWithUTF8String:toString(newViewProps.blurType).c_str()]; + [self setBlurType:blurType]; + } +- ++ + if (oldViewProps.reducedTransparencyFallbackColor != newViewProps.reducedTransparencyFallbackColor) { + UIColor *color = RCTUIColorFromSharedColor(newViewProps.reducedTransparencyFallbackColor); + [self setReducedTransparencyFallbackColor:color]; + } +- ++ + [super updateProps:props oldProps:oldProps]; + } + #endif // RCT_NEW_ARCH_ENABLED +@@ -131,6 +131,7 @@ + + - (UIBlurEffectStyle)blurEffectStyle + { ++ if ([self.blurType isEqual: @"transparent"]) return UIBlurEffectStyleDark; + if ([self.blurType isEqual: @"xlight"]) return UIBlurEffectStyleExtraLight; + if ([self.blurType isEqual: @"light"]) return UIBlurEffectStyleLight; + if ([self.blurType isEqual: @"dark"]) return UIBlurEffectStyleDark; +@@ -160,7 +161,7 @@ + if ([self.blurType isEqual: @"thinMaterialLight"]) return UIBlurEffectStyleSystemThinMaterialLight; + if ([self.blurType isEqual: @"ultraThinMaterialLight"]) return UIBlurEffectStyleSystemUltraThinMaterialLight; + #endif +- ++ + #if TARGET_OS_TV + if ([self.blurType isEqual: @"regular"]) return UIBlurEffectStyleRegular; + if ([self.blurType isEqual: @"prominent"]) return UIBlurEffectStyleProminent; +@@ -183,6 +184,13 @@ + UIBlurEffectStyle style = [self blurEffectStyle]; + self.blurEffect = [BlurEffectWithAmount effectWithStyle:style andBlurAmount:self.blurAmount]; + self.blurEffectView.effect = self.blurEffect; ++ ++ if ([self.blurType isEqual: @"transparent"]) { ++ for (UIView *subview in self.blurEffectView.subviews) { ++ subview.backgroundColor = [UIColor clearColor]; ++ } ++ } ++ + } + + - (void)updateFallbackView diff --git a/patches/BlurViewNativeComponent.ts.patch b/patches/BlurViewNativeComponent.ts.patch new file mode 100644 index 0000000000..e08b1d94d8 --- /dev/null +++ b/patches/BlurViewNativeComponent.ts.patch @@ -0,0 +1,10 @@ +--- /tmp/tmp-status-mobile-61974dae4/tmp.NHLSFZG6LG/BlurViewNativeComponent.ts 2024-04-16 17:08:42.755929000 +0200 ++++ ./node_modules/@react-native-community/blur/src/fabric/BlurViewNativeComponent.ts 2024-04-16 17:08:57.634037113 +0200 +@@ -10,6 +10,7 @@ + | 'dark' + | 'light' + | 'xlight' ++ | 'transparent' + | 'prominent' + | 'regular' + | 'extraDark' diff --git a/patches/VibrancyViewNativeComponent.ts.patch b/patches/VibrancyViewNativeComponent.ts.patch new file mode 100644 index 0000000000..14742361e5 --- /dev/null +++ b/patches/VibrancyViewNativeComponent.ts.patch @@ -0,0 +1,10 @@ +--- /tmp/tmp-status-mobile-61974dae4/tmp.zy6uXqO4gW/VibrancyViewNativeComponent.ts 2024-04-16 17:09:23.772623000 +0200 ++++ ./node_modules/@react-native-community/blur/src/fabric/VibrancyViewNativeComponent.ts 2024-04-16 17:09:39.033737349 +0200 +@@ -10,6 +10,7 @@ + | 'dark' + | 'light' + | 'xlight' ++ | 'transparent' + | 'prominent' + | 'regular' + | 'extraDark' diff --git a/yarn.lock b/yarn.lock index 75d251e77c..0851ad1502 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2594,9 +2594,10 @@ eventemitter3 "^1.2.0" lodash "^4.17.15" -"@react-native-community/blur@git+https://github.com/status-im/react-native-blur.git#refs/tags/v4.3.3-status": - version "4.3.3" - resolved "git+https://github.com/status-im/react-native-blur.git#c140cc8e7d54e3318af0a7c149b5d64b54de3419" +"@react-native-community/blur@4.4.0": + version "4.4.0" + resolved "https://registry.yarnpkg.com/@react-native-community/blur/-/blur-4.4.0.tgz#b2440dab17d94e480fbc4470e03155573b5b7375" + integrity sha512-P+xdT2LIq1ewOsF3zx7C0nu4dj7nxl2NVTsMXEzRDjM3bWMdrrEbTRA7uwPV5ngn7/BXIommBPlT/JW4SAedrw== "@react-native-community/cli-clean@12.3.6": version "12.3.6"