# useUser (https://docs.salla.dev/twilight/react/hooks/use-user)



Use `useUser` when a component must greet the customer, show their avatar, or behave differently for guests and signed-in customers.

## Example [#example]

```tsx title="app/components/layout/AccountLink.tsx"
import { useUser } from '@salla.sa/twilight-theme-engine/hooks/useUser';

export function AccountLink() {
  const { isLoggedIn, data: user } = useUser();

  if (!isLoggedIn) return <a href="/login">Sign in</a>;
  return <a href="/account">{user ? `Hello, ${user.first_name}` : 'My account'}</a>;
}
```

## API [#api]

```ts
function useUser(): UseUserReturn;

type UseUserReturn = UseQueryResult<User | null> & {
  isLoggedIn: boolean;
};
```

The hook takes no arguments. It returns a React Query result plus `isLoggedIn`.

| Prop         | Type                 | Description                                                                                                      |
| ------------ | -------------------- | ---------------------------------------------------------------------------------------------------------------- |
| `isLoggedIn` | `boolean`            | `true` when the customer has an auth token. It does not mean the profile has loaded or the token is still valid. |
| `data`       | `User \| null`       | The profile. `null` for guests, while loading, and when the request fails.                                       |
| `isLoading`  | `boolean`            | `true` while the first profile request runs. Always `false` for guests.                                          |
| `isFetching` | `boolean`            | `true` during any fetch, including refetches.                                                                    |
| `refetch`    | `() => Promise<...>` | Loads the profile again, for example after the customer edits it.                                                |

The rest of the React Query result (`status`, `error`, `fetchStatus`) is also there. For the `User` fields see [User data](https://docs.salla.dev/twilight/react/data/user).

## Gotchas [#gotchas]

* The engine reads the auth token from its own context, so `isLoggedIn` is correct on the first render, during server rendering as well.
* The profile request only runs when there is a token. For guests no request is sent and `data` stays `null`.
* If the request fails, `data` is `null` and `error` stays empty, because the API module turns failures into `null`. Treat "signed in but no `data`" as "not loaded".
* `User` has a `type` field of `"guest"` or `"user"`. The hook only returns `"user"` objects, so use `isLoggedIn` to detect guests.
* The hook needs the engine providers at the root of your app, as in a normal theme.

## Next [#next]

* [User data](https://docs.salla.dev/twilight/react/data/user): every field of the profile, with example values.
* [`user` API module](https://docs.salla.dev/twilight/react/api/modules/user)
* [`useStore`](https://docs.salla.dev/twilight/react/hooks/use-store) reads the store's data.