Clicking on idle-user tab shows Application error

[Maheima]

Steps to reproduce: Currently, unable to reproduce

[RitikJaiswal75]

I Looked into the preview builds even they were failing.

its something over from vercel.

Having a deeper look

[Maheima]

https://discussions.apple.com/thread/253645567#:~:text=The%20message%20%22Application%20error%3A%20a,the%20standards%20your%20browser%20expects.

[Maheima]

When I checked the builds weren't failing which is why I merged it

[RitikJaiswal75]

Console is alerting on some map being used

[RitikJaiswal75]

Could we rollback the deploy @Maheima

[RitikJaiswal75]

While the deploy is rolled back we have an application working for everyone and we can look at the issue in the staging after that.

@ankushdharkar @Maheima

[yesyash]

Issue

The problem seems to be in src/pages/ideal-users.tsx of #382 as pointed out by @sakshambhatt. Where when there is an error the response value in line number 13 is set to an empty object ({}).

This results in the condition inside useEffect being truthy, and as there is no allUserStatus key in this empty object idealUsersList is set to undefined, mapping over undefined it is not possible it throws us an error on the client.

Typescript does help us prevent the race condition for undefined because the response returned from useFetch function is of type any.

Proposed solution

Quick fix

A quick fix to this issue can be to replace the before code with after:

Before	After
```typescript const { response, error, isLoading, } = useFetch(IDLE_USERS_URL); useEffect(() => { if (response) { const idleUsers = response.allUserStatus; setIdleUsersList(idleUsers); } }, [isLoading, response]); ```	```typescript const { response, error, isLoading, } = useFetch(IDLE_USERS_URL); useEffect(() => { if (response && response.allUserStatus) { const idleUsers = response.allUserStatus; setIdleUsersList(idleUsers); } }, [isLoading, response]); ```

A Better Solution

Make useFetch a generic function and make the its consumer explicitly mention response type.