From cfa20fda4304afe556ae1800a7c5432bf9ecb53a Mon Sep 17 00:00:00 2001
From: balzack <roland.osborne@gmail.com>
Date: Sat, 21 Sep 2024 22:38:55 -0700
Subject: [PATCH] workaround for stale profile image

---
 app/client/mobile/src/identity/Identity.styled.ts  | 11 ++++++++++-
 app/client/mobile/src/identity/Identity.tsx        |  7 ++++++-
 app/client/mobile/src/identity/useIdentity.hook.ts |  3 ++-
 app/client/mobile/src/settings/Settings.styled.ts  | 11 ++++++++++-
 app/client/mobile/src/settings/Settings.tsx        |  7 ++++++-
 5 files changed, 34 insertions(+), 5 deletions(-)

diff --git a/app/client/mobile/src/identity/Identity.styled.ts b/app/client/mobile/src/identity/Identity.styled.ts
index 3461d9cc..d9a1db23 100644
--- a/app/client/mobile/src/identity/Identity.styled.ts
+++ b/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,
diff --git a/app/client/mobile/src/identity/Identity.tsx b/app/client/mobile/src/identity/Identity.tsx
index b10d0097..52a08f1d 100644
--- a/app/client/mobile/src/identity/Identity.tsx
+++ b/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 && (
diff --git a/app/client/mobile/src/identity/useIdentity.hook.ts b/app/client/mobile/src/identity/useIdentity.hook.ts
index 3c4f7eed..528856cc 100644
--- a/app/client/mobile/src/identity/useIdentity.hook.ts
+++ b/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 () => {
diff --git a/app/client/mobile/src/settings/Settings.styled.ts b/app/client/mobile/src/settings/Settings.styled.ts
index 368b9947..4881a5cc 100644
--- a/app/client/mobile/src/settings/Settings.styled.ts
+++ b/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,
diff --git a/app/client/mobile/src/settings/Settings.tsx b/app/client/mobile/src/settings/Settings.tsx
index f596669f..3165c112 100644
--- a/app/client/mobile/src/settings/Settings.tsx
+++ b/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}>