[HOLD] User Avatar does not fall back on default when offline, and instead a blank space is shown.

[isagoico]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

---

Action Performed:

1. Force close the app
2. Turn on airplane mode
3. Open the app

Expected Result:

App should load on offline mode and user avatar should be displayed

Actual Result:

App is not loading the user avatar on offline mode. A blank space is displayed.

Workaround:

Going back online fixes the issue.

Platform:

Where is this issue occurring?

• iOS
• Android
• Desktop

Version Number: 1.1.8-0

Reproducible in staging?: Yes
Reproducible in production?: Yes

Logs: https://stackoverflow.com/c/expensify/questions/4856

Notes/Photos/Videos: Any additional supporting documentation

When testing this, I noticed on my device that the avatars from the LHN conversation list were also not loading

Expensify/Expensify Issue URL:

Issue reported by: @roryabraham
Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1633893109079200

View all open jobs on GitHub

view this job on upwork

[MelvinBot]

Triggered auto assignment to @Luke9389 (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[MelvinBot]

Triggered auto assignment to @jboniface (External), see https://stackoverflow.com/c/expensify/questions/8582 for more details.

[developvsn]

Proposal:

The avatar-images are requested by the URL each time user opens new window.

We see the solution in several ways:

1. No need to show user’s avatar-image and use placeholder instead. #
   We can check in Avatar.js the state of network connection then if not connected — to show a placeholder and it will be applied to all views. In this case is it necessary immediately after the connection appears to change the placeholder to user’s avatar-image in real time without re-opening the window?

App/src/components/Avatar.js

Line 50 in fa7cb60

: <Image source={{uri: this.props.source}} style={imageStyle} />}

We can modify above line as shown below, to fix this issue.

<Image source={this.props.network.isOffline ? require("../../assets/images/avatars/user.jpg") : {uri: this.props.source}} style={imageStyle}/>

IMG_9525.MP4

2. If it’s necessary to show avatars without a network connection, then we suggest:
   As one of the solutions we see adding a new property, base64Avatar, which will be saved local for each chat and for the main user. When the user’s avatar-image is first retrieved from the url. If there is no connection — display the backup stored in the base64Avatar property. Every time the user’s avatar-image changes, the backup will also change, it will be obtained from the current avatar.

Or we can suggest using some library like react-native-fast-image

[isagoico]

@Santhosh-Sellavel Was able to reproduce this issue on desktop too, adding to original comment

[jboniface]

@Luke9389 do you have an opinion on the pending proposal?

[Luke9389]

Hey @developvsn, thanks for the proposal. The solution we want is for the avatar to fall back to a default avatar (like the one Chronos has). That's like solution number 1 above. I don't think we should have the require inside the ternary, but otherwise, this proposal looks OK. I'll give you the 🟢 green light 🟢 to go ahead and start a PR.

[jboniface]

@developvsn if you haven't applied to the upwork job, can you do so? If you have applied, can you let me know who you are on UW so I can hire you? you can also message me through the job posting on UW and let me know your gh username if you'd prefer.

[developvsn]

Hello @Luke9389 , we started the PR (branch fix-default-avatar) !

Hello @jboniface, we'll message you on upwork , we haven't applied yet, thanks !

[mallenexpensify]

@developvsn we noticed the PR was submitted by @RGutu. Our process for managing and paying contributors is setup so that the same account that is hired in the Github issue is the same who submits the PR. Can you use the same accounts in the future?

[developvsn]

@mallenexpensify okay, we just wanted to submit it from our organisation account, and it didn't work, so in the future we'll use same accounts , understood.

[mallenexpensify]

Thanks @developvsn , it'll make our lives much easier.

For this issue, can you apply to the Upwork job here https://www.upwork.com/jobs/~01382d9aca711ad10a then confirm in a comment here once you have. Please include your first name and initial of last name so we can ensure we hire the correct person.

I'm also going to confirm in the PR that payment will be going to the user in Upwork to ensure wires don't get crossed.

Thanks!

[developvsn]

@mallenexpensify
We applied to the Upwork job. The name on upwork is: Alexandru. S.

[mallenexpensify]

We are placing all non-critical issues on hold while we're on a company offsite. The hold is expected to be lifted on 11/19 (but could go longer). For any PRs that are submitted before or during the hold, we will add a $250 bonus payment.

[jboniface]

temporary hold, not overdue

[jboniface]

I hired Alexandru @developvsn

[MelvinBot]

📣 @developvsn You have been assigned to this job by @jboniface!
Please apply to this job in Upwork and let us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[developvsn]

@Luke9389 Hi ! Can you please review or give us an update regarding Pull Request

@mallenexpensify okay, we just wanted to submit it from our organisation account, and it didn't work, so in the future we'll use same accounts , understood.

[mountiny]

@developvsn as per your comment here, I have tested this on Staging iOS app and the issue still prevails. Therefore, we should still go ahead with trying to solve this or find out why is it it should work on production but not on staging (I only have staging on my phone right now, so I can't test production behaviour).

[developvsn]

@mountiny @jboniface @Luke9389 We downloaded production app for 3 different IOS devices and 1 android, and we can't reproduce this bag.

IOS

ios.MP4

Android

android.mp4

We also tried to do it in github source code and it's the same result:

github.mp4

[mountiny]

This is my experience on Staging. I guess we need to test more. Why would it occur only on staging but prod and dev would be fine, interesting 😅

Upload.from.GitHub.for.iOS.MOV

[Luke9389]

For now, I'm going to put this issue on HOLD and then have this retested after the next deploy.

Frankly, if this issue fixed itself, that'd be ideal, because the changes in the PR don't feel optimal to me. More discussion on that if need be.

Rest assured @developvsn, we'll pay you for your time regardless of whether your PR is merged.

[Luke9389]

@isagoico Would you be willing to have this tested again? It looks like we had a successful deploy today, so we should have a clear idea of whether this is still occurring.

[isagoico]

Of course! happy to try and repro again :)

I was unable to reproduce this on Android on build 1.1.16-1. I currently don't have my iOS on me today so I'll check this tomorrow too (since it was the device I was able to reproduce initially).

[developvsn]

Of course! happy to try and repro again :)

I was unable to reproduce this on Android on build 1.1.16-1. I currently don't have my iOS on me today so I'll check this tomorrow too (since it was the device I was able to reproduce initially).

Have you had a chance to look into it?

[isagoico]

I was unable to reproduce the Profile image issue on the main user but I was able to reproduce the missing profile picture in LHN conversation. Please check the video and image below

Image.from.iOS.8.MP4

[mountiny]

@isagoico It might be that the main user profile picture in your case is the default one, or at least I am thinking it might be a different scenario since originally Rory and then when I tried it, we both had a profile pic uploaded.

[developvsn]

Then what's the plan? Do we implement changes or keep it like this?

[mallenexpensify]

I just tested, it looks like MY avatar is showing but not all the rest. FWIW...

[jboniface]

It looks like this is still being discussed?

[developvsn]

It looks like this is still being discussed?

sort of. Waiting on Luke's comment here

It seems like it need more testing — looks like some devices loading avatars in offline and some not.

[Luke9389]

@jboniface, can we pay @developvsn for their time?

I'd like to close this issue and open a new one with a more clear (and up-to-date) description of the problem and solution.

[developvsn]

@jboniface, can we pay @developvsn for their time?

I'd like to close this issue and open a new one with a more clear (and up-to-date) description of the problem and solution.

Any updates? @jboniface

[jboniface]

@developvsn sorry, i missed that message. i just paid the contract. closing.