diff --git a/ios/Podfile.lock b/ios/Podfile.lock
index 9ce861cc85..6f14299b05 100644
--- a/ios/Podfile.lock
+++ b/ios/Podfile.lock
@@ -236,6 +236,8 @@ PODS:
- React-jsinspector (0.71.0)
- React-logger (0.71.0):
- glog
+ - react-native-blur (4.3.0):
+ - React-Core
- react-native-cameraroll (5.2.0):
- React-Core
- react-native-image-resizer (3.0.4):
@@ -413,6 +415,7 @@ DEPENDENCIES:
- React-jsiexecutor (from `../node_modules/react-native/ReactCommon/jsiexecutor`)
- React-jsinspector (from `../node_modules/react-native/ReactCommon/jsinspector`)
- React-logger (from `../node_modules/react-native/ReactCommon/logger`)
+ - "react-native-blur (from `../node_modules/@react-native-community/blur`)"
- "react-native-cameraroll (from `../node_modules/@react-native-camera-roll/camera-roll`)"
- "react-native-image-resizer (from `../node_modules/@bam.tech/react-native-image-resizer`)"
- react-native-pager-view (from `../node_modules/react-native-pager-view`)
@@ -493,6 +496,8 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native/ReactCommon/jsinspector"
React-logger:
:path: "../node_modules/react-native/ReactCommon/logger"
+ react-native-blur:
+ :path: "../node_modules/@react-native-community/blur"
react-native-cameraroll:
:path: "../node_modules/@react-native-camera-roll/camera-roll"
react-native-image-resizer:
@@ -578,6 +583,7 @@ SPEC CHECKSUMS:
React-jsiexecutor: 060dd495f1e2af3d87216f7ca8a94c55ec885b4f
React-jsinspector: 5061fcbec93fd672183dfb39cc2f65e55a0835db
React-logger: a6c0b3a807a8e81f6d7fea2e72660766f55daa50
+ react-native-blur: 50c9feabacbc5f49b61337ebc32192c6be7ec3c3
react-native-cameraroll: 0ff04cc4e0ff5f19a94ff4313e5c8bc4503cd86d
react-native-image-resizer: 794abf75ec13ed1f0dbb1f134e27504ea65e9e66
react-native-pager-view: 54bed894cecebe28cede54c01038d9d1e122de43
diff --git a/package.json b/package.json
index 7cfad40f98..e0d594e4b2 100644
--- a/package.json
+++ b/package.json
@@ -24,6 +24,7 @@
"@react-native-async-storage/async-storage": "^1.17.6",
"@react-native-camera-roll/camera-roll": "^5.1.0",
"@react-native-clipboard/clipboard": "^1.10.0",
+ "@react-native-community/blur": "^4.3.0",
"@zxing/text-encoding": "^0.9.0",
"base64-js": "^1.5.1",
"email-validator": "^2.0.4",
diff --git a/src/view/com/profile/ProfileHeader.tsx b/src/view/com/profile/ProfileHeader.tsx
index 3bcc825fd7..3982637fc7 100644
--- a/src/view/com/profile/ProfileHeader.tsx
+++ b/src/view/com/profile/ProfileHeader.tsx
@@ -8,6 +8,7 @@ import {
} from 'react-native'
import LinearGradient from 'react-native-linear-gradient'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
+import {BlurView} from '@react-native-community/blur'
import {ProfileViewModel} from '../../../state/models/profile-view'
import {useStores} from '../../../state'
import {
@@ -36,6 +37,9 @@ export const ProfileHeader = observer(function ProfileHeader({
const pal = usePalette('default')
const store = useStores()
+ const onPressBack = () => {
+ store.nav.tab.goBack()
+ }
const onPressAvi = () => {
if (view.avatar) {
store.shell.openLightbox(new ProfileImageLightbox(view))
@@ -262,6 +266,11 @@ export const ProfileHeader = observer(function ProfileHeader({
) : undefined}
+
+
+
+
+
@@ -284,9 +293,19 @@ const styles = StyleSheet.create({
width: '100%',
height: 120,
},
+ backBtn: {
+ position: 'absolute',
+ top: 10,
+ left: 10,
+ width: 30,
+ height: 30,
+ borderRadius: 15,
+ alignItems: 'center',
+ justifyContent: 'center',
+ },
avi: {
position: 'absolute',
- top: 80,
+ top: 110,
left: 10,
width: 84,
height: 84,
diff --git a/src/view/com/util/UserBanner.tsx b/src/view/com/util/UserBanner.tsx
index 2bd8f765bc..1863e1883a 100644
--- a/src/view/com/util/UserBanner.tsx
+++ b/src/view/com/util/UserBanner.tsx
@@ -61,7 +61,7 @@ export function UserBanner({
}, [onSelectNewBanner])
const renderSvg = () => (
-