useParticipantIds

useParticipantIds(params?): string[]; Use it to render groups, grids, or lists of participant tiles. If no parameters are provided, the ids of all participants in the call are returned.

Parameters (optional)

An object with the following properties:

string

Show filter options

Value	Type	Description
`'local'`	`string`	Returns only the `local` participant
`'remote'`	`string`	Returns remote participants, everybody but `local`
`'screen'`	`string`	Returns participants with active screen shares
`'owner'`	`string`	Returns participants who joined the call with a meeting token that has the `is_owner` property set to `true`
`FilterParticipantsFunction`	`Function`	Specifies custom filtering for the list of `id`s. The full Daily participant object can be referenced

String-based filters can be directly calculated from our internal state store and therefore provide a better render performance than a custom filter that needs to be evaluated at runtime.

Function

Callback for the active-speaker-change event

Function

Callback for the participant-joined event

Function

Callback for the participant-left event

Function

Callback for the participant-updated event

string

'joined_at' | 'session_id' | 'user_id' | 'user_name' | SortParticipantsFunction, sorts the list of participant ids according to the provided criteria

Show sort options

Value	Type	Description
`'joined_at'`	`string`	Sorts by when participants joined the call in ascending order.
`'session_id'`	`string`	Sorts by participant `session_id`s
`'user_id'`	`string`	Sorts by participant `user_id`s
`'user_name'`	`string`	Sorts in alphabetical order by participant `user_name`
`SortParticipantsFunction`	`Function`	Specifies custom sorting for the list of `id`s. The full Daily participant object can be referenced

String-based sorting can be directly calculated from our internal state store and therefore provide a better render performance than a custom sort function that needs to be evaluated at runtime.

{
  "filter": "remote",
  "onActiveSpeakerChange": <Function>,
  "onParticipantJoined": <Function>,
  "onparticipantUpdated": <Function>,
  "sort": "joined_at",
}

Return value

Returns a string[] — an array of participant ids.

Example

import { useParticipant, useParticipantIds } from '@daily-co/daily-react';
import { useMemo } from 'react';

export const UseParticipantIdsDemo = () => {
  const participantIDs = useParticipantIds({ sort: 'joined_at' });
  const latestParticipantID = useMemo(
    () => participantIDs?.[participantIDs.length - 1],
    [participantIDs]
  );
  const latestParticipant = useParticipant(latestParticipantID);

  return (
    <div>Latest participant: {latestParticipant?.user_name ?? 'none'}</div>
  );
};

Components

Hooks

useParticipantIds

Parameters (optional)

Return value

Example

See also

Hooks

Events

​Parameters (optional)

​Return value

​Example

​See also

Hooks

Events

Parameters (optional)

Return value

Example

See also