in packages/react-composites/src/composites/common/Drawer/MoreDrawer.tsx [272:316]
iconName: isDeviceSelected(speaker, props.selectedSpeaker)
? 'MoreDrawerSelectedSpeaker'
: 'MoreDrawerSpeakers'
},
text: speaker.name,
onItemClick: onSpeakerItemClick,
secondaryIconProps: isDeviceSelected(speaker, props.selectedSpeaker) ? { iconName: 'Accept' } : undefined
})),
secondaryText: props.selectedSpeaker?.name
});
}
const { microphones, onSelectMicrophone } = props;
const onMicrophoneItemClick = useCallback(
(
_ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement> | undefined,
itemKey: string | undefined
) => {
const selected = microphones?.find((mic) => mic.id === itemKey);
if (selected) {
// This is unsafe - we're only passing in part of the argument to the handler.
// But this is a known issue in our state.
onSelectMicrophone(selected as AudioDeviceInfo);
}
onLightDismiss();
},
[microphones, onSelectMicrophone, onLightDismiss]
);
if (props.microphones && props.microphones.length > 0) {
// Set props as Microphone if speakers can be enumerated else set as Audio Device
const speakersAvailable = props.speakers && props.speakers.length > 0;
const itemKey = speakersAvailable ? 'microphones' : 'audioDevices';
const text = speakersAvailable ? props.strings.microphoneMenuTitle : props.strings.audioDeviceMenuTitle;
const iconName = speakersAvailable ? 'MoreDrawerMicrophones' : 'MoreDrawerSpeakers';
const selectedIconName = speakersAvailable ? 'MoreDrawerSelectedMicrophone' : 'MoreDrawerSelectedSpeaker';
drawerMenuItems.push({
itemKey: itemKey,
disabled: props.disableButtonsForHoldScreen,
text: text,
iconProps: { iconName: iconName },
subMenuProps: props.microphones.map((mic) => ({
itemKey: mic.id,
iconProps: {