Skip to content

Commit

Permalink
upgrade blur lib to 4.4.0
Browse files Browse the repository at this point in the history
## 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 : #18138

## Review & Test notes

Verify if blur stuff still works.

## Platforms
- iOS
- Android

status: ready
  • Loading branch information
siddarthkay committed Apr 19, 2024
1 parent 8353c65 commit b6cae3e
Show file tree
Hide file tree
Showing 8 changed files with 107 additions and 6 deletions.
6 changes: 4 additions & 2 deletions ios/Podfile.lock
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -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",
Expand Down
11 changes: 11 additions & 0 deletions patches/BlurView-build.gradle.patch
Original file line number Diff line number Diff line change
@@ -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'
}
}

10 changes: 10 additions & 0 deletions patches/BlurView.ios.tsx.patch
Original file line number Diff line number Diff line change
@@ -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'
57 changes: 57 additions & 0 deletions patches/BlurView.mm.patch
Original file line number Diff line number Diff line change
@@ -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<const BlurViewProps>(_props);
const auto &newViewProps = *std::static_pointer_cast<const BlurViewProps>(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
10 changes: 10 additions & 0 deletions patches/BlurViewNativeComponent.ts.patch
Original file line number Diff line number Diff line change
@@ -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'
10 changes: 10 additions & 0 deletions patches/VibrancyViewNativeComponent.ts.patch
Original file line number Diff line number Diff line change
@@ -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'
7 changes: 4 additions & 3 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -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/[email protected]":
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/[email protected]":
version "12.3.6"
Expand Down

0 comments on commit b6cae3e

Please sign in to comment.