communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
58 lines • 3.33 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
import { ControlBarButton } from './ControlBarButton';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { _HighContrastAwareIcon } from './HighContrastAwareIcon';
import { defaultSpokenLanguage } from './utils';
import { useLocale } from '../localization';
/**
* a button to start or stop captions
*
* Can be used with {@link ControlBar}
*
* @param props - properties for the start captions button.
* @public
*/
export const StartCaptionsButton = (props) => {
const { onStartCaptions, onStopCaptions, onSetSpokenLanguage, currentSpokenLanguage } = props;
const localeStrings = useLocale().strings.startCaptionsButton;
const strings = Object.assign(Object.assign({}, localeStrings), props.strings);
const onRenderStartIcon = () => {
return React.createElement(_HighContrastAwareIcon, { disabled: props.disabled, iconName: "CaptionsIcon" });
};
const onRenderOffIcon = () => {
return React.createElement(_HighContrastAwareIcon, { disabled: props.disabled, iconName: "CaptionsOffIcon" });
};
const options = useMemo(() => {
return { spokenLanguage: currentSpokenLanguage === '' ? defaultSpokenLanguage : currentSpokenLanguage };
}, [currentSpokenLanguage]);
const [hasSetSpokenLanguage, setHasSetSpokenLanguage] = useState(false);
const onToggleStartCaptions = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
if (props.checked) {
onStopCaptions();
}
else {
yield onStartCaptions(options);
}
}), [props.checked, onStartCaptions, onStopCaptions, options]);
useEffect(() => {
if (props.checked && !hasSetSpokenLanguage) {
// set spoken language when start captions with a spoken language specified.
// this is to fix the bug when a second user starts captions with a new spoken language, captions bot ignore that spoken language
onSetSpokenLanguage(options.spokenLanguage);
// we only need to call set spoken language once when first starting captions
setHasSetSpokenLanguage(true);
}
}, [props.checked, onSetSpokenLanguage, options.spokenLanguage, hasSetSpokenLanguage]);
return (React.createElement(ControlBarButton, Object.assign({}, props, { strings: strings, onClick: onToggleStartCaptions !== null && onToggleStartCaptions !== void 0 ? onToggleStartCaptions : props.onClick, onRenderOnIcon: onRenderStartIcon, onRenderOffIcon: onRenderOffIcon })));
};
//# sourceMappingURL=StartCaptionsButton.js.map