workaround for stale profile image

app/client/mobile/src/identity/Identity.styled.ts

@@ -23,7 +23,16 @@ export const styles = StyleSheet.create({
     width: 48,
     height: 48,
   },
-  logo: {
+  logoUnset: {
+    aspectRatio: 1,
+    resizeMode: 'contain',
+    borderRadius: 4,
+    width: null,
+    height: null,
+    borderWidth: 1,
+    borderColor: '#888888',
+  },
+  logoSet: {
     aspectRatio: 1,
     resizeMode: 'contain',
     borderRadius: 4,

app/client/mobile/src/identity/Identity.tsx

@@ -12,7 +12,12 @@ export function Identity({ openSettings }) {
     <SafeAreaView style={styles.identity}>
       <TouchableOpacity style={styles.identityData} activeOpacity={1} onPress={() => setMenu(true)}>
         <View style={styles.image}>
-          <Image style={styles.logo} resizeMode={'contain'} source={{ uri: state.imageUrl }} />
+          {state.profile.imageSet && (
+            <Image style={styles.logoSet} resizeMode={'contain'} source={state.imageUrl} />
+          )}
+          {!state.profile.imageSet && (
+            <Image style={styles.logoUnset} resizeMode={'contain'} source={state.imageUrl} />
+          )}
         </View>
         <View style={styles.details}>
           {state.profile.name && (

app/client/mobile/src/identity/useIdentity.hook.ts

@@ -29,8 +29,9 @@ export function useIdentity() {
         updateState({
           profile,
           profileSet: true,
-          imageUrl: identity.getProfileImageUrl(),
+          imageUrl: { uri: identity.getProfileImageUrl() },
         })
+
       }
       identity.addProfileListener(setProfile)
       return () => {

app/client/mobile/src/settings/Settings.styled.ts

@@ -79,7 +79,16 @@ export const styles = StyleSheet.create({
     marginTop: 16,
     marginBottom: 8,
   },
-  logo: {
+  logoSet: {
+    aspectRatio: 1,
+    resizeMode: 'contain',
+    borderRadius: 8,
+    width: null,
+    height: null,
+    borderWidth: 1,
+    borderColor: Colors.primary,
+  },
+  logoUnset: {
     aspectRatio: 1,
     resizeMode: 'contain',
     borderRadius: 8,

app/client/mobile/src/settings/Settings.tsx

@@ -52,7 +52,12 @@ export function Settings() {
         <SafeAreaView style={styles.settings}>
           <Text style={styles.header} adjustsFontSizeToFit={true} numberOfLines={1}>{`${state.profile.handle}${state.profile.node ? '/' + state.profile.node : ''}`}</Text>
           <View style={styles.image}>
-            <Image style={styles.logo} resizeMode={'contain'} source={{ uri: state.imageUrl }} />
+            {!state.profile.imageSet && (
+              <Image style={styles.logoUnset} resizeMode={'contain'} source={{ uri: state.imageUrl }} />
+            )}
+            {state.profile.imageSet && (
+              <Image style={styles.logoSet} resizeMode={'contain'} source={{ uri: state.imageUrl }} />
+            )}
             <View style={styles.editBar}>
               <TouchableOpacity onPress={selectImage}>
                 <Surface style={styles.editBorder} elevation={0}>