46 lines
1.1 KiB
JavaScript
46 lines
1.1 KiB
JavaScript
import React from "react";
|
|
import { Box, Text, Button, Label, Flex } from "theme-ui";
|
|
|
|
import Modal from "../components/Modal";
|
|
|
|
function StartStreamModal({
|
|
isOpen,
|
|
onRequestClose,
|
|
isSupported,
|
|
unavailableMessage,
|
|
stream,
|
|
noAudioTrack,
|
|
noAudioMessage,
|
|
onStreamStart,
|
|
onStreamEnd,
|
|
}) {
|
|
return (
|
|
<Modal isOpen={isOpen} onRequestClose={onRequestClose}>
|
|
<Box>
|
|
<Label pt={2} pb={1}>
|
|
Radio (experimental)
|
|
</Label>
|
|
<Text as="p" mb={2} variant="caption">
|
|
Share your computers audio with the party
|
|
</Text>
|
|
{!isSupported && unavailableMessage}
|
|
{isSupported && !stream && noAudioTrack && noAudioMessage}
|
|
<Flex py={2}>
|
|
{isSupported && !stream && (
|
|
<Button sx={{ flexGrow: 1 }} onClick={onStreamStart}>
|
|
Start Radio
|
|
</Button>
|
|
)}
|
|
{isSupported && stream && (
|
|
<Button sx={{ flexGrow: 1 }} onClick={() => onStreamEnd(stream)}>
|
|
Stop Radio
|
|
</Button>
|
|
)}
|
|
</Flex>
|
|
</Box>
|
|
</Modal>
|
|
);
|
|
}
|
|
|
|
export default StartStreamModal;
|