The first letter of the name is not shown in the avatar

[raffaelone]

Description:

All users' avatars are not displayed correctly in the Android app

Environment Information:

• Rocket.Chat Server Version: 4.5.1 Ubuntu 20.04 LTS
• Rocket.Chat App Version: 4.26.0.30563
• Device Name: Samsung Galaxy Z Fold
• OS Version: Android 12

Additional context:

[diegolmello]

@raffaelone can you reproduce it on https://open.rocket.chat?

[raffaelone]

On https://open.rocket.chat avatars are OK

[diegolmello]

Looks like it's something on your env then.

[raffaelone]

Probably, but I don't understand why the problem is only for Android and iOS. On the desktop the avatars are displayed correctly.

[diegolmello]

The letter avatar is done on the server by applying a font (I think it's Inter or Helvetica) and generating an image. Mobile uses PNG. Based on the image you sent, it looks like if the font isn't quite there. Can you try to investigate a little deeper? There's not much we can do from here.

[raffaelone]

Thanks. I'll open an issue on Rocket.Chat about the server configuration

[raffaelone]

At the moment for my issue reported on Rocket.Chat github issue there are no answers. However, the fonts are correctly installed on the system. In the meantime I tried to get around the problem by setting Gravatar as external avatar provider url, but I encounter the same bug reported with issue #3362. Could there be some missing dependency problem in the server snap installation?

[wifidong]

I have also encountered this problem. Switching to docker deployment will not have this problem.

[raffaelone]

Same problem with the new snap version 4.5.5

[OneTwoBarbecue]

We are facing the very same issue on Android and iOS.

EV: Ubuntu 20.04, Snap, RC Server 4.6.2, LDAP sync, Enterprise

Any news on this issue?

Kind regards, Marco

[Kamp11]

The problem still remains! Ubuntu 20.04, Snap, RocketChat Server 4.8.1

Has anyone managed to solve this problem?

[sanraymer]

Solution: don't use snap (latest version as of today). It is the cause of that problem (verified).

I use AWS and directly installed this one: https://aws.amazon.com/marketplace/pp/prodview-4ky7yfikdzfqk?sr=0-1&ref_=beagle&applicationId=AWSMPContessa#pdp-pricing

---

However, if you want to use snap here I have a very quick and less than optimal/recommended solution for you.

Go to the path: app/lib/methods/helpers/getAvatarUrl.ts

Change: return formatUrl(${server}/avatar/${room}, size, query);

By: return formatUrl(https://ui-avatars.com/api/?background=${color}&color=fff&name=${text}, size, query);

You must write the following code at the beginning:

const colors = ["1abc9c", "2ecc71", "3498db", "9b59b6", "34495e", "16a085", "27ae60", "2980b9", "8e44ad", "2c3e50", "f1c40f", "e67e22", "e74c3c", "95a5a6", "f39c12", "d35400", "c0392b", "bdc3c7", "7f8c8d"];

const color = colors[Math.floor(Math.random() * colors.length)];

(Or just change the provider directly from the admin "/admin/Accounts > Avatar", although when I tried it it didn't change the avatar of the channels)

[diegolmello]

Thanks! I can see several versions of the server on the comments. Maybe it's an issue on the default config (of file upload possibly) or even when running on Ubuntu?