snapshot of https://github.com/jitsi/jitsi-meet.git @ fd1749dd28f4138aa80234fc7f311b19aaffa0e7 (2026-09-15)

react/features/participants-pane/components/web/MeetingParticipantItems.tsx

@@ -0,0 +1,106 @@
+import React from 'react';
+
+import MeetingParticipantItem from './MeetingParticipantItem';
+
+interface IProps {
+
+    /**
+     * The translated ask unmute text for the quick action buttons.
+     */
+    askUnmuteText?: string;
+
+    /**
+     * Whether or not the local participant is in a breakout room.
+     */
+    isInBreakoutRoom: boolean;
+
+    /**
+     * Callback for the mouse leaving this item.
+     */
+    lowerMenu: Function;
+
+    /**
+     * The translated text for the mute participant button.
+     */
+    muteParticipantButtonText?: string;
+
+    /**
+     * Callback used to open an actions drawer for a participant.
+     */
+    openDrawerForParticipant: Function;
+
+    /**
+     * True if an overflow drawer should be displayed.
+     */
+    overflowDrawer?: boolean;
+
+    /**
+     * The aria-label for the ellipsis action.
+     */
+    participantActionEllipsisLabel: string;
+
+    /**
+     * The meeting participants.
+     */
+    participantIds: Array<string>;
+
+    /**
+     * The if of the participant for which the context menu should be open.
+     */
+    raiseContextId?: string;
+
+    /**
+     * Current search string.
+     */
+    searchString?: string;
+
+    /**
+     * Callback for the activation of this item's context menu.
+     */
+    toggleMenu: Function;
+
+    /**
+     * The translated "you" text.
+     */
+    youText: string;
+}
+
+/**
+ * Component used to display a list of meeting participants.
+ *
+ * @returns {ReactNode}
+ */
+function MeetingParticipantItems({
+    isInBreakoutRoom,
+    lowerMenu,
+    toggleMenu,
+    participantIds,
+    openDrawerForParticipant,
+    overflowDrawer,
+    raiseContextId,
+    participantActionEllipsisLabel,
+    searchString,
+    youText
+}: IProps) {
+    const renderParticipant = (id: string) => (
+        <MeetingParticipantItem
+            isHighlighted = { raiseContextId === id }
+            isInBreakoutRoom = { isInBreakoutRoom }
+            key = { id }
+            onContextMenu = { toggleMenu(id) }
+            onLeave = { lowerMenu }
+            openDrawerForParticipant = { openDrawerForParticipant }
+            overflowDrawer = { overflowDrawer }
+            participantActionEllipsisLabel = { participantActionEllipsisLabel }
+            participantID = { id }
+            searchString = { searchString }
+            youText = { youText } />
+    );
+
+    return (<>
+        {participantIds.map(renderParticipant)}
+    </>);
+}
+
+// Memoize the component in order to avoid rerender on drawer open/close.
+export default React.memo<IProps>(MeetingParticipantItems);