[CAL-252] Avatar icon not loading properly

[Udit-takkar]

From Linear-GitHub Sync

[harshsinghatz]

@Udit-takkar Also the avatar is not getting updated from the profile section, I tried it with two accounts. Can you check it on your end?

[Udit-takkar]

Yeah there seem to be some problems with the Avatar updating also. I'll be looking into this. Why is this happening.

[Udit-takkar]

Yeah there seem to be some problems with the Avatar updating also. I'll be looking into it

[harshsinghatz]

@Udit-takkar would you be picking that as well?

[Udit-takkar]

@harshsinghatz yes. the avatar seem to block updating profile.

[harshsinghatz]

Is it fixed? because rn it works fine on prod

[Udit-takkar]

@harshsinghatz no try creating new account and the avatar won't load or try updating the image in /settings.

[harshsinghatz]

Ok let me check

[harshsinghatz]

@Udit-takkar Yeah, i did see and it's working unexpectedly

1. For a new user, avatar doesn't show
   
   but changing imgSrc from "https://app.cal.com/hello-world/avatar.png" to "https://cal.com/hello-world/avatar.png" works for some reason

2. I don't know if this just from my end but in main branch when i am trying to change the avatar the request doesn't hit trpc server if the image is md5 encrypted. Whereas if it is a default avatar then it does

Can you check the diff between the current main branch and the prod, because this seems like a new issue

[Udit-takkar]

2. yeah the trpc request is not returning any result in the main branch. i don't understand why is it happening. maybe due to trpc v10

[harshsinghatz]

Can you compare the main branch with the production?

[hariombalhara]

@harshsinghatz Wrt your point-1. This seems like a cloudflare caching issue with cal.com only. With app.cal.com it works fine.
See this loom that clearly shows the issue. @baileypumfleet maybe Cloudflare needs some tweaking?

Wrt Point-2, the issue seems to be happening due to middleware. Deleting the middleware.ts file solves the issue and trpc mutation endpoint responds immediately.

[harshsinghatz]

@hariombalhara It seems both the domains have caching issues because earlier I saw problems with both the domains

Can you point out exactly what issue is middleware causing, is it like an infinite loop of redirects?
And also if we are sending the default image trpc endpoint responds, so is there any particular problem with the format of data(avatar)?

[hariombalhara]

Middleware is simply not forwarding the request to next.js endpoint. It seems to be doing some processing of own and it's stuck there.

[hariombalhara]

Okay, so it's a known Next.js bug. People are reporting it.
vercel/next.js#39593
vercel/next.js#39262

[harshsinghatz]

That makes sense because after encryption the avatar data is around 225KB.
Should we prompt for some less bulky hashing technique?

But this issue wasn't present before, so an RCA would be needed for this (as this issue is only on main)

[Udit-takkar]

@hariombalhara i am not sure if size is the issue here because i tried uploading avatar on prod and it worked fine and it returned a success response but when i tried uploading the same image on dev , the request did not return any response.

[Udit-takkar]

discussion on similar topic here #5164

[Udit-takkar]

now i think the avatar picture loading problem is fixed somehow. just tried creating new account and it seem to work fine.

[milospuac]

Customers keep reporting this one today @udit

[Udit-takkar]

yeah no idea what's the issue here.

[PeerRich]

@leog @alannnc @hariombalhara can you look and help?

[hariombalhara]

Opened a PR to fix it. Found the root cause for the issue.
https://github.com/calcom/cal.com/pull/5299/files

[PeerRich]

@milospuac can you ask them to try again?