mirror of https://github.com/vector-im/riot-web
Prevent to start two broadcasts at the same time (#9744)
parent
16e92a4d8c
commit
ce554276db
|
@ -28,22 +28,42 @@ interface Props {
|
||||||
voiceBroadcastPreRecording: VoiceBroadcastPreRecording;
|
voiceBroadcastPreRecording: VoiceBroadcastPreRecording;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface State {
|
||||||
|
showDeviceSelect: boolean;
|
||||||
|
disableStartButton: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
export const VoiceBroadcastPreRecordingPip: React.FC<Props> = ({ voiceBroadcastPreRecording }) => {
|
export const VoiceBroadcastPreRecordingPip: React.FC<Props> = ({ voiceBroadcastPreRecording }) => {
|
||||||
const pipRef = useRef<HTMLDivElement | null>(null);
|
const pipRef = useRef<HTMLDivElement | null>(null);
|
||||||
const { currentDevice, currentDeviceLabel, devices, setDevice } = useAudioDeviceSelection();
|
const { currentDevice, currentDeviceLabel, devices, setDevice } = useAudioDeviceSelection();
|
||||||
const [showDeviceSelect, setShowDeviceSelect] = useState<boolean>(false);
|
const [state, setState] = useState<State>({
|
||||||
|
showDeviceSelect: false,
|
||||||
|
disableStartButton: false,
|
||||||
|
});
|
||||||
|
|
||||||
const onDeviceSelect = (device: MediaDeviceInfo | null) => {
|
const onDeviceSelect = (device: MediaDeviceInfo) => {
|
||||||
setShowDeviceSelect(false);
|
setState((state) => ({
|
||||||
|
...state,
|
||||||
|
showDeviceSelect: false,
|
||||||
|
}));
|
||||||
setDevice(device);
|
setDevice(device);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const onStartBroadcastClick = () => {
|
||||||
|
setState((state) => ({
|
||||||
|
...state,
|
||||||
|
disableStartButton: true,
|
||||||
|
}));
|
||||||
|
|
||||||
|
voiceBroadcastPreRecording.start();
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="mx_VoiceBroadcastBody mx_VoiceBroadcastBody--pip" ref={pipRef}>
|
<div className="mx_VoiceBroadcastBody mx_VoiceBroadcastBody--pip" ref={pipRef}>
|
||||||
<VoiceBroadcastHeader
|
<VoiceBroadcastHeader
|
||||||
linkToRoom={true}
|
linkToRoom={true}
|
||||||
onCloseClick={voiceBroadcastPreRecording.cancel}
|
onCloseClick={voiceBroadcastPreRecording.cancel}
|
||||||
onMicrophoneLineClick={() => setShowDeviceSelect(true)}
|
onMicrophoneLineClick={() => setState({ ...state, showDeviceSelect: true })}
|
||||||
room={voiceBroadcastPreRecording.room}
|
room={voiceBroadcastPreRecording.room}
|
||||||
microphoneLabel={currentDeviceLabel}
|
microphoneLabel={currentDeviceLabel}
|
||||||
showClose={true}
|
showClose={true}
|
||||||
|
@ -51,12 +71,13 @@ export const VoiceBroadcastPreRecordingPip: React.FC<Props> = ({ voiceBroadcastP
|
||||||
<AccessibleButton
|
<AccessibleButton
|
||||||
className="mx_VoiceBroadcastBody_blockButton"
|
className="mx_VoiceBroadcastBody_blockButton"
|
||||||
kind="danger"
|
kind="danger"
|
||||||
onClick={voiceBroadcastPreRecording.start}
|
onClick={onStartBroadcastClick}
|
||||||
|
disabled={state.disableStartButton}
|
||||||
>
|
>
|
||||||
<LiveIcon className="mx_Icon mx_Icon_16" />
|
<LiveIcon className="mx_Icon mx_Icon_16" />
|
||||||
{_t("Go live")}
|
{_t("Go live")}
|
||||||
</AccessibleButton>
|
</AccessibleButton>
|
||||||
{showDeviceSelect && (
|
{state.showDeviceSelect && (
|
||||||
<DevicesContextMenu
|
<DevicesContextMenu
|
||||||
containerRef={pipRef}
|
containerRef={pipRef}
|
||||||
currentDevice={currentDevice}
|
currentDevice={currentDevice}
|
||||||
|
|
|
@ -87,6 +87,7 @@ describe("VoiceBroadcastPreRecordingPip", () => {
|
||||||
});
|
});
|
||||||
jest.spyOn(MediaDeviceHandler.instance, "setDevice").mockImplementation();
|
jest.spyOn(MediaDeviceHandler.instance, "setDevice").mockImplementation();
|
||||||
preRecording = new VoiceBroadcastPreRecording(room, sender, client, playbacksStore, recordingsStore);
|
preRecording = new VoiceBroadcastPreRecording(room, sender, client, playbacksStore, recordingsStore);
|
||||||
|
jest.spyOn(preRecording, "start").mockResolvedValue();
|
||||||
});
|
});
|
||||||
|
|
||||||
afterAll(() => {
|
afterAll(() => {
|
||||||
|
@ -106,6 +107,19 @@ describe("VoiceBroadcastPreRecordingPip", () => {
|
||||||
expect(renderResult.container).toMatchSnapshot();
|
expect(renderResult.container).toMatchSnapshot();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe("and double clicking »Go live«", () => {
|
||||||
|
beforeEach(async () => {
|
||||||
|
await act(async () => {
|
||||||
|
await userEvent.click(screen.getByText("Go live"));
|
||||||
|
await userEvent.click(screen.getByText("Go live"));
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it("should call start once", () => {
|
||||||
|
expect(preRecording.start).toHaveBeenCalledTimes(1);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
describe("and clicking the room name", () => {
|
describe("and clicking the room name", () => {
|
||||||
beforeEach(async () => {
|
beforeEach(async () => {
|
||||||
await userEvent.click(screen.getByText(room.name));
|
await userEvent.click(screen.getByText(room.name));
|
||||||
|
|
Loading…
Reference in New Issue