65 lines
1.9 KiB
TypeScript
65 lines
1.9 KiB
TypeScript
import { ConferenceData } from '../../background/jitsi/eventListeners'
|
|
import { UsersData } from '../../background/types/roomData'
|
|
import useMeetingStarted from '../../hooks/useMeetingStarted'
|
|
import { useRoomName } from '../../hooks/useRoomName'
|
|
import JitsiEntrypoint from '../jitsi/JitsiEntrypoint'
|
|
import { UserInfo } from '../jitsi/types'
|
|
import MeetingNameInput from './MeetingNameInput'
|
|
import './Meeting.css'
|
|
|
|
interface Props {
|
|
conferenceData: ConferenceData | undefined
|
|
setConferenceData: (newData: ConferenceData) => void
|
|
userInfo: UserInfo
|
|
usersData: UsersData
|
|
}
|
|
|
|
function Meeting(props: Props) {
|
|
const { conferenceData, setConferenceData, userInfo, usersData } = props
|
|
console.log("[Rooms] meeting usersData", props)
|
|
const [meetingStarted] = useMeetingStarted()
|
|
const { roomName } = useRoomName()
|
|
const [_, setMeetingStarted] = useMeetingStarted()
|
|
const { updateAndSubmitRoomName: updateAndSubmitRoomName } = useRoomName()
|
|
|
|
if (meetingStarted) {
|
|
return (
|
|
<JitsiEntrypoint
|
|
conferenceData={conferenceData}
|
|
roomName={roomName}
|
|
userInfo={userInfo}
|
|
setConferenceData={setConferenceData}
|
|
/>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<div>
|
|
<MeetingNameInput roomName={roomName} currentUser={userInfo.displayName} />
|
|
<div className="meeting-quickjoin">
|
|
{usersData?.roomsData.map((roomData) => {
|
|
return (
|
|
<>
|
|
<h3>
|
|
<a
|
|
href="#"
|
|
onClick={() => {
|
|
updateAndSubmitRoomName(roomData.roomName)
|
|
setMeetingStarted(true)
|
|
}}
|
|
>
|
|
{roomData.roomName}
|
|
</a>
|
|
</h3>
|
|
{roomData.participants.map((participant) => (
|
|
<div key={participant.jid}> {participant.displayName} </div>
|
|
))}
|
|
</>
|
|
)
|
|
})}
|
|
</div>
|
|
</div>)
|
|
}
|
|
|
|
export default Meeting
|