RequestsModal component displays a modal with a list of requests.
import { RequestsModal, RenderRequestComponent } from 'mediasfu-reactjs';import { io } from 'socket.io-client';// Define request list and parametersconst requestList = [ { id: "1", name: "Request 1", icon: "fa-microphone" }, { id: "2", name: "Request 2", icon: "fa-desktop" },];const socket = io("http://localhost:3000");const parameters = { getUpdatedAllParams: () => ({ filteredRequestList: requestList }),};// Render the RequestsModal component<RequestsModal isRequestsModalVisible={true} onRequestClose={() => console.log('Requests modal closed')} requestCounter={2} onRequestFilterChange={(text) => console.log('Filter changed to:', text)} requestList={requestList} updateRequestList={(newList) => console.log("Updated request list:", newList)} roomName="Room 1" socket={socket} renderRequestComponent={RenderRequestComponent} backgroundColor="#83c0e9" position="topRight" parameters={parameters}/> Copy
import { RequestsModal, RenderRequestComponent } from 'mediasfu-reactjs';import { io } from 'socket.io-client';// Define request list and parametersconst requestList = [ { id: "1", name: "Request 1", icon: "fa-microphone" }, { id: "2", name: "Request 2", icon: "fa-desktop" },];const socket = io("http://localhost:3000");const parameters = { getUpdatedAllParams: () => ({ filteredRequestList: requestList }),};// Render the RequestsModal component<RequestsModal isRequestsModalVisible={true} onRequestClose={() => console.log('Requests modal closed')} requestCounter={2} onRequestFilterChange={(text) => console.log('Filter changed to:', text)} requestList={requestList} updateRequestList={(newList) => console.log("Updated request list:", newList)} roomName="Room 1" socket={socket} renderRequestComponent={RenderRequestComponent} backgroundColor="#83c0e9" position="topRight" parameters={parameters}/>
The rendered RequestsModal component.
Optional
Ignored by React.
Only kept in types for backwards compatibility. Will be removed in a future major release.
Used in debugging messages. You might want to set it explicitly if you want to display a different name for debugging purposes.
Legacy React Docs
const MyComponent: FC = () => { return <div>Hello!</div>}MyComponent.displayName = 'MyAwesomeComponent' Copy
const MyComponent: FC = () => { return <div>Hello!</div>}MyComponent.displayName = 'MyAwesomeComponent'
RequestsModal component displays a modal with a list of requests.
Example