/* eslint-disable lines-around-comment */ import React from 'react'; import { WithTranslation } from 'react-i18next'; // @ts-ignore import { AbstractDialogTab } from '../../../base/dialog'; // @ts-ignore import type { Props as AbstractDialogTabProps } from '../../../base/dialog'; import { translate } from '../../../base/i18n/functions'; import Checkbox from '../../../base/ui/components/web/Checkbox'; /** * The type of the React {@code Component} props of {@link SoundsTab}. */ export type Props = AbstractDialogTabProps & WithTranslation & { /** * Whether or not the reactions feature is enabled. */ enableReactions: Boolean, /** * Whether or not moderator muted the sounds. */ moderatorMutedSoundsReactions: Boolean, /** * Whether or not the sound for the incoming message should play. */ soundsIncomingMessage: Boolean, /** * Whether or not the sound for the participant joined should play. */ soundsParticipantJoined: Boolean, /** * Whether or not the sound for the participant entering the lobby should play. */ soundsParticipantKnocking: Boolean, /** * Whether or not the sound for the participant left should play. */ soundsParticipantLeft: Boolean, /** * Whether or not the sound for reactions should play. */ soundsReactions: Boolean, /** * Whether or not the sound for the talk while muted notification should play. */ soundsTalkWhileMuted: Boolean, /** * Invoked to obtain translated strings. */ t: Function } /** * React {@code Component} for modifying the local user's sound settings. * * @augments Component */ class SoundsTab extends AbstractDialogTab { /** * Initializes a new {@code SoundsTab} instance. * * @param {Props} props - The React {@code Component} props to initialize * the new {@code SoundsTab} instance with. */ constructor(props: Props) { super(props); // Bind event handlers so they are only bound once for every instance. this._onChange = this._onChange.bind(this); } /** * Changes a sound setting state. * * @param {Object} e - The key event to handle. * * @returns {void} */ _onChange({ target }: React.ChangeEvent) { super._onChange({ [target.name]: target.checked }); } /** * Implements React's {@link Component#render()}. * * @inheritdoc * @returns {ReactElement} */ render() { const { soundsIncomingMessage, soundsParticipantJoined, soundsParticipantKnocking, soundsParticipantLeft, soundsTalkWhileMuted, soundsReactions, enableReactions, moderatorMutedSoundsReactions, t // @ts-ignore } = this.props; return (

{t('settings.playSounds')}

{enableReactions && }
); } } // @ts-ignore export default translate(SoundsTab);