BearStudio/start-ui-web

Update TanStack query usage to avoid destructuration

Closed this issue · 0 comments

Many of our clients use the destructuration pattern with React Query. I find it more readable to avoid that pattern.

Example:

Complex and not readable:

const { data: users, isLoading: areUsersLoading } = useUsers();

// later

{areUsersLoading && <Loader />}
{!areUsersLoading && users && ()}

Easier and more readable:

const users = useUsers();

{users.isLoading && <Loader />}
{!users.isLoading && users.data && ()}

Those example doesn't contain multiple queries, but image a page with 3 queries / mutations, it will be easier to read with the second one.