diff --git a/lang/main.json b/lang/main.json index 63d334c9d..202fdcc39 100644 --- a/lang/main.json +++ b/lang/main.json @@ -674,6 +674,7 @@ "more": "More", "name": "Name", "noDevice": "None", + "sameAsSystem": "Same as system ({{label}})", "selectAudioOutput": "Audio output", "selectCamera": "Camera", "selectMic": "Microphone", diff --git a/react/features/settings/components/web/audio/AudioSettingsContent.js b/react/features/settings/components/web/audio/AudioSettingsContent.js index 17ec53321..3ac9506dd 100644 --- a/react/features/settings/components/web/audio/AudioSettingsContent.js +++ b/react/features/settings/components/web/audio/AudioSettingsContent.js @@ -14,6 +14,20 @@ import SpeakerEntry from './SpeakerEntry'; const browser = JitsiMeetJS.util.browser; +/** + * Translates the default device label into a more user friendly one. + * + * @param {string} deviceId - The device Id. + * @param {string} label - The device label. + * @param {Function} t - The translation function. + * @returns {string} + */ +function transformDefaultDeviceLabel(deviceId, label, t) { + return deviceId === 'default' + ? t('settings.sameAsSystem', { label: label.replace('Default - ', '') }) + : label; +} + export type Props = { /** @@ -125,10 +139,12 @@ class AudioSettingsContent extends Component { * * @param {Object} data - An object with the deviceId, jitsiTrack & label of the microphone. * @param {number} index - The index of the element, used for creating a key. + * @param {Function} t - The translation function. * @returns {React$Node} */ - _renderMicrophoneEntry(data, index) { - const { deviceId, label, jitsiTrack, hasError } = data; + _renderMicrophoneEntry(data, index, t) { + const { deviceId, jitsiTrack, hasError } = data; + const label = transformDefaultDeviceLabel(deviceId, data.label, t); const isSelected = deviceId === this.props.currentMicDeviceId; return ( @@ -149,10 +165,12 @@ class AudioSettingsContent extends Component { * * @param {Object} data - An object with the deviceId and label of the speaker. * @param {number} index - The index of the element, used for creating a key. + * @param {Function} t - The translation function. * @returns {React$Node} */ - _renderSpeakerEntry(data, index) { - const { deviceId, label } = data; + _renderSpeakerEntry(data, index, t) { + const { deviceId } = data; + const label = transformDefaultDeviceLabel(deviceId, data.label, t); const key = `se-${index}`; return ( @@ -251,7 +269,7 @@ class AudioSettingsContent extends Component { IconComponent = { IconMicrophoneHollow } text = { t('settings.microphones') } /> {this.state.audioTracks.map((data, i) => - this._renderMicrophoneEntry(data, i), + this._renderMicrophoneEntry(data, i, t), )} { outputDevices.length > 0 && ( <> @@ -263,7 +281,7 @@ class AudioSettingsContent extends Component { ) } {outputDevices.map((data, i) => - this._renderSpeakerEntry(data, i), + this._renderSpeakerEntry(data, i, t), )}