Anjing Webshells

Website : rimsha.abasa.com
: / var / www / cal.com / cal.com / docs / platform /
Filename : user-or-team-related-hooks.mdx
back
---
title: User / Teams hooks
description: Overview of all the hooks associated with managed users or teams.
---

### 1. `useMe`

The useMe returns the current managed user's info. This hook is useful when you need to display a managed user's details.

Below code snippet shows how to use the useMe hook to fetch user details.

```js
import { useMe } from "@calcom/atoms";

export default function UserDetails() {
  const { data: userData, isLoading: isLoadingUser } = useMe();

  return (
    <>
      {isLoadingUser && <p>Loading...</p>}
      {!isLoadingUser && !userData && <p>No user found</p>}
      {!isLoadingUser &&
        !!userData &&
        return (
          <div>Username: {userData.username}</div>
        )
      }
    </>
  );
}
```

### 2. `useTeams`

The useTeams returns all teams info. This hook is useful when you need to display or manage a user's entire collection of teams.

Below code snippet shows how to use the useTeams hook to fetch team details.

```js
import { useTeams } from "@calcom/atoms";

export default function UserTeams() {
  const { data: teams, isLoading: isLoadingTeams } = useTeams();

  return (
    <>
      {isLoadingTeams && <p>Loading...</p>}
      {!isLoadingTeams && !teams && <p>No teams found</p>}
      {!isLoadingTeams &&
        teams &&
        (Boolean(teams?.length)) &&
        teams?.map((team) => {
            return (
                <div key={team.id}><h1>Team name: {team.name}</h1></div>
            );
       })}
    </>
  );
}
```