> ## Documentation Index
> Fetch the complete documentation index at: https://cal.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Event types hooks

> Overview of all the hooks associated with event types.

### 1. `useEventTypes`

The useEventTypes returns all event types associated with a user. Simply provide a username to fetch all their available event types. This hook is useful when you need to display or manage a user's entire collection of event configurations.

Below code snippet shows how to use the useEventTypes hook to fetch the event types of a specific user.

```js theme={null}
import { useEventTypes } from "@calcom/atoms";

export default function EventTypes({ username }: { username: string }) {
  const { isLoading: isLoadingEvents, data: eventTypes, refetch } = useEventTypes(username);

  return (
    <>
      {isLoadingEvents && <p>Loading...</p>}
      {!isLoadingEvents && !eventTypes && <p>No event types found</p>}
      {!isLoadingEvents &&
        eventTypes &&
        (Boolean(eventTypes?.length)) &&
        eventTypes?.map((event) => {
            return (
                <div key={event.id}><h1>Event: {event.slug}</h1></div>
            );
       })}
    </>
  );
}
```

### 2. `useTeamEventTypes`

The useTeamEventTypes returns all event types associated with a team. Simply provide the team id to fetch all their available event types. This hook is useful when you need to display or manage a team's entire collection of event configurations.

<Note>
  This hook only works within an organization context. The team must belong to an organization, and the access token passed to `<CalOAuthProvider>` must be from a managed user within that organization.
</Note>

Below code snippet shows how to use the useTeamEventTypes hook to fetch the event types of a team.

```js theme={null}
import { useTeamEventTypes } from "@calcom/atoms";

export default function TeamEventTypes({ id }: { id: number }) {
  const { isLoading: isLoadingTeamEvents, data: teamEventTypes, refetch: refetchTeamEvents } = useTeamEventTypes(id);

  return (
    <>
      {isLoadingTeamEvents && <p>Loading...</p>}
      {!isLoadingTeamEvents && !teamEventTypes && <p>No team events found</p>}
      {!isLoadingTeamEvents &&
        teamEventTypes &&
        (Boolean(teamEventTypes?.length)) &&
        teamEventTypes?.map((event) => {
            return (
                <div key={event.id}><h1>Team event: {event.slug}</h1></div>
            );
       })}
    </>
  );
}
```

### 3. `useEventTypeById`

The useEventTypeById returns data for a specific event type, provided you pass in the correct event type id. This hook is useful when you need to display or manage a specific event type.

Below code snippet shows how to use the useEventTypeById hook to fetch a specific event type.

```js theme={null}
import { useEventTypeById } from "@calcom/atoms";

export default function EventType({ id }: { id: number }) {
  const { isLoading: isLoadingEventType, data: eventType } = useEventTypeById(id);

  return (
    <>
      {isLoadingEventType && <p>Loading...</p>}
      {!isLoadingEventType && !eventType && <p>No event type found</p>}
      {!isLoadingEventType &&
        !!eventType &&
        return (
          <div>Title: {eventType.slug}</div>
        )
        }
    </>
  );
}
```

### 4. `useCreateEventType`

The useCreateEventType hook allows you to create a new event type. This hook returns a mutation function that handles the event type creation process. The mutation function accepts an object with the following properties: ***lengthInMinutes*** which is the length of the event in minutes, ***title*** which is the title of the event, ***slug*** which is the slug of the event, and ***description*** which is the description of the event.

Below code snippet shows how to use the useCreateEventType hook to set up an event type.

```js theme={null}
import { useCreateEventType } from "@calcom/atoms";

export default function CreateEventType() {
  const { mutate: createEventType, isPending } = useCreateEventType({
    onSuccess: () => {
      console.log("Event type created successfully!");
    },
    onError: () => {
      console.log("Error creating event type");
    },
  });

  return (
    <>
      <button 
        disabled={isPending}
        onClick={() => {
          createEventType({
            lengthInMinutes: 15,
            title: "Coffee chat",
            slug: "coffee-chat",
            description: "Quick chat about coffee and life in general!",
          })
        }}>
        Create event type
      </button>
    </>
  );
} 
```

### 5. `useCreateTeamEventType`

The useCreateTeamEventType hook allows you to create a new team event type. This hook returns a mutation function that handles the event type creation process.

<Note>
  This hook only works within an organization context. The team must belong to an organization, and the access token passed to `<CalOAuthProvider>` must be from a managed user within that organization.
</Note>

Below code snippet shows how to use the useCreateTeamEventType hook to set up a team event type.

```js theme={null}
import { useCreateTeamEventType } from "@calcom/atoms";

export default function CreateTeamEventType() {
  const { mutate: createTeamEventType, isPending } = useCreateTeamEventType({
    onSuccess: () => {
      console.log("Event type created successfully!");
    },
    onError: () => {
      console.log("Error creating event type");
    },
  });

  return (
    <>
      <button 
        disabled={isPending}
        onClick={() => {
          createTeamEventType({
            lengthInMinutes: 30,
            title: "Daily standup",
            slug: "daily-standup",
            description: "Daily standup for the team",
            schedulingType: "COLLECTIVE",
            hosts: [{"userId": 1456}, {"userId": 2357}],
            teamId: 1234,
          })
        }}>
        Create team event type
      </button>
    </>
  );
} 
```