mediasfu-reactnative
Version:
MediaSFU Prebuilt React Native SDK
241 lines (240 loc) • 8.87 kB
TypeScript
import React from 'react';
import { Socket } from 'socket.io-client';
import { ConnectSocketType, ShowAlert, ConnectLocalSocketType, RecordingParams, MeetingRoomParams, CreateMediaSFURoomOptions, JoinMediaSFURoomOptions } from '../../@types/types';
import { CreateRoomOnMediaSFUType, JoinRoomOnMediaSFUType } from '../../methods/utils/joinRoomOnMediaSFU';
/**
* Interface defining the parameters for joining a local event room.
*/
export interface JoinLocalEventRoomParameters {
eventID: string;
userName: string;
secureCode?: string;
videoPreference?: string | null;
audioPreference?: string | null;
audioOutputPreference?: string | null;
}
/**
* Interface defining the options for joining a local event room.
*/
export interface JoinLocalEventRoomOptions {
joinData: JoinLocalEventRoomParameters;
link?: string;
}
/**
* Interface defining the response structure when creating or joining a local room.
*/
export interface CreateLocalRoomParameters {
eventID: string;
duration: number;
capacity: number;
userName: string;
scheduledDate: Date;
secureCode: string;
waitRoom?: boolean;
recordingParams?: RecordingParams;
eventRoomParams?: MeetingRoomParams;
videoPreference?: string | null;
audioPreference?: string | null;
audioOutputPreference?: string | null;
mediasfuURL?: string;
}
/**
* Interface defining the response structure when joining a local room.
*/
export interface CreateLocalRoomOptions {
createData: CreateLocalRoomParameters;
link?: string;
}
/**
* Interface defining the response structure when creating or joining a local room.
*/
export interface CreateJoinLocalRoomResponse {
success: boolean;
secret: string;
reason?: string;
url?: string;
}
/**
* Interface defining the parameters for the PreJoinPage component.
*/
export interface PreJoinPageParameters {
/**
* Source URL for the logo image.
* Defaults to 'https://mediasfu.com/images/logo192.png' if not provided.
*/
imgSrc?: string;
/**
* Function to display alert messages.
*/
showAlert?: ShowAlert;
/**
* Function to toggle the visibility of the loading modal.
*/
updateIsLoadingModalVisible: (visible: boolean) => void;
/**
* Function to establish a socket connection.
*/
connectSocket: ConnectSocketType;
/**
* Function to establish a socket connection to a local server.
*/
connectLocalSocket?: ConnectLocalSocketType;
/**
* Function to update the socket instance in the parent state.
*/
updateSocket: (socket: Socket) => void;
/**
* Function to update the socket instance in the parent state.
*/
updateLocalSocket?: (socket: Socket) => void;
/**
* Function to update the validation state in the parent.
*/
updateValidated: (validated: boolean) => void;
/**
* Function to update the API username in the parent state.
*/
updateApiUserName: (apiUserName: string) => void;
/**
* Function to update the API token in the parent state.
*/
updateApiToken: (apiToken: string) => void;
/**
* Function to update the event link in the parent state.
*/
updateLink: (link: string) => void;
/**
* Function to update the room name in the parent state.
*/
updateRoomName: (roomName: string) => void;
/**
* Function to update the member name in the parent state.
*/
updateMember: (member: string) => void;
}
/**
* Interface defining the credentials.
*/
export interface Credentials {
apiUserName: string;
apiKey: string;
}
/**
* Interface defining the options for the PreJoinPage component.
*/
export interface PreJoinPageOptions {
/**
* link to the local server (Community Edition)
*/
localLink?: string;
/**
* Determines if the user is allowed to connect to the MediaSFU server.
*/
connectMediaSFU?: boolean;
/**
* Parameters required by the PreJoinPage component.
*/
parameters: PreJoinPageParameters;
/**
* Optional user credentials. Defaults to predefined credentials if not provided.
*/
credentials?: Credentials;
/**
* Flag to determine if the component should return the UI.
*/
returnUI?: boolean;
/**
* Options for creating/joining a room without UI.
*/
noUIPreJoinOptions?: CreateMediaSFURoomOptions | JoinMediaSFURoomOptions;
/**
* Function to create a room on MediaSFU.
*/
createMediaSFURoom?: CreateRoomOnMediaSFUType;
/**
* Function to join a room on MediaSFU.
*/
joinMediaSFURoom?: JoinRoomOnMediaSFUType;
}
export type PreJoinPageType = (options: PreJoinPageOptions) => JSX.Element;
/**
* PreJoinPage component allows users to either create a new room or join an existing one.
*
* @component
* @param {PreJoinPageOptions} props - The properties for the PreJoinPage component.
* @param {PreJoinPageParameters} props.parameters - Various parameters required for the component.
* @param {ShowAlert} [props.parameters.showAlert] - Function to show alert messages.
* @param {() => void} props.parameters.updateIsLoadingModalVisible - Function to update the loading modal visibility.
* @param {ConnectSocketType} props.parameters.connectSocket - Function to connect to the socket.
* @param {ConnectSocketType} props.parameters.connectLocalSocket - Function to connect to the local socket.
* @param {Socket} props.parameters.updateSocket - Function to update the socket.
* @param {Socket} props.parameters.updateLocalSocket - Function to update the local socket.
* @param {() => void} props.parameters.updateValidated - Function to update the validation status.
* @param {string} [props.parameters.imgSrc] - The source URL for the logo image.
* @param {Credentials} [props.credentials=user_credentials] - The user credentials containing the API username and API key.
* @param {boolean} [props.returnUI=false] - Flag to determine if the component should return the UI.
* @param {CreateMediaSFURoomOptions | JoinMediaSFURoomOptions} [props.noUIPreJoinOptions] - The options for creating/joining a room without UI.
* @param {string} [props.localLink=''] - The link to the local server.
* @param {boolean} [props.connectMediaSFU=true] - Flag to determine if the component should connect to MediaSFU.
* @param {CreateRoomOnMediaSFUType} [props.createMediaSFURoom] - Function to create a room on MediaSFU.
* @param {JoinRoomOnMediaSFUType} [props.joinMediaSFURoom] - Function to join a room on MediaSFU.
*
* @returns {JSX.Element} The rendered PreJoinPage component.
*
* @example
* ```tsx
* import React from 'react';
* import { PreJoinPage } from 'mediasfu-reactnative';
* import { JoinLocalRoomOptions } from 'mediasfu-reactnative';
*
* function App() {
* * const showAlertFunction = (message: string) => console.log(message);
* const updateLoadingFunction = (visible: boolean) => console.log(`Loading: ${visible}`);
* const connectSocketFunction = () => {}; // Connect socket function
* const updateSocketFunction = (socket: Socket) => {}; // Update socket function
* const updateValidatedFunction = (validated: boolean) => {}; // Update validated function
* const updateApiUserNameFunction = (userName: string) => {}; // Update API username function
* const updateApiTokenFunction = (token: string) => {}; // Update API token function
* const updateLinkFunction = (link: string) => {}; // Update link function
* const updateRoomNameFunction = (roomName: string) => {}; // Update room name function
* const updateMemberFunction = (member: string) => {}; // Update member function
*
* return (
* <PreJoinPage
* parameters={{
* showAlert: showAlertFunction,
* updateIsLoadingModalVisible: updateLoadingFunction,
* connectSocket: connectSocketFunction,
* updateSocket: updateSocketFunction,
* updateValidated: updateValidatedFunction,
* updateApiUserName: updateApiUserNameFunction,
* updateApiToken: updateApiTokenFunction,
* updateLink: updateLinkFunction,
* updateRoomName: updateRoomNameFunction,
* updateMember: updateMemberFunction,
* imgSrc: 'https://example.com/logo.png'
* }}
* credentials={{
* apiUserName: 'user123',
* apiKey: 'apikey123'
* }}
* returnUI={true}
* noUIPreJoinOptions={{
* action: 'create',
* capacity: 10,
* duration: 15,
* eventType: 'broadcast',
* userName: 'Prince',
* }}
* connectMediaSFU={true}
* localLink='http://localhost:3000'
* />
* );
* };
*
*
* export default App;
* ```
*/
declare const PreJoinPage: React.FC<PreJoinPageOptions>;
export default PreJoinPage;