MediaSFU React Native
    Preparing search index...

    Variable PollModalConst

    PollModal: React.FC<PollModalOptions> = ...

    PollModal - Interactive polling and voting interface.

    Provides a full polling workflow for MediaSFU rooms, enabling hosts to author polls, participants to vote, and everyone to view live results with percentages. Layout and container wrappers can be overridden through uiOverrides.pollModal while retaining the built-in handlers.

    Key Features:

    • Guided poll creation with multiple choice support (host/co-host only).
    • Participant voting with per-user selection highlighting.
    • Real-time tally and percentage breakdown of each option.
    • Previous poll archive including ended/archived questions.
    • Configurable modal positioning for disparate layout needs.
    • Optional custom styling via style prop or render overrides.
    • Socket-driven synchronization to keep all clients consistent.
    • Single-vote enforcement leveraging member identity tracking.

    UI Customization: Replace via uiOverrides.pollModal to supply an entirely custom polling UI while continuing to leverage the provided poll handlers.

    Component properties.

    Rendered poll modal.

    // Host creating and managing polls
    <PollModal
      isPollModalVisible={isOpen}
      onClose={() => setIsOpen(false)}
      member="host-user"
      islevel="2"
      polls={allPolls}
      poll={activePoll}
      socket={socket}
      roomName="demo-room"
      handleCreatePoll={handleCreatePoll}
      handleEndPoll={handleEndPoll}
      handleVotePoll={handleVotePoll}
      updateIsPollModalVisible={setIsOpen}
    />

    // Participant voting with custom styling
    <PollModal
      isPollModalVisible={visible}
      onClose={onClose}
      member={participantId}
      islevel="0"
      polls={pollHistory}
      poll={currentPoll}
      socket={socket}
      roomName={roomName}
      handleCreatePoll={handleCreatePoll}
      handleEndPoll={handleEndPoll}
      handleVotePoll={handleVotePoll}
      updateIsPollModalVisible={setVisible}
      backgroundColor="#eef6ff"
      style={{ borderRadius: 20 }}
    />

    // Supplying a custom container through uiOverrides
    const overrides = {
      pollModal: {
        component: MyCustomPollModal,
        injectedProps: {
          theme: 'dark',
        },
      },
    };

    const PollModalComponent = withOverride(overrides.pollModal, PollModal);
    <PollModalComponent
      isPollModalVisible={visible}
      onClose={onClose}
      member="user-1"
      islevel="1"
      polls={polls}
      poll={poll}
      socket={socket}
      roomName="lobby"
      handleCreatePoll={handleCreatePoll}
      handleEndPoll={handleEndPoll}
      handleVotePoll={handleVotePoll}
      updateIsPollModalVisible={setVisible}
    />

    Settings

    Member Visibility