116 lines
3.2 KiB
TypeScript
116 lines
3.2 KiB
TypeScript
import { useMemo } from 'react';
|
|
import { useSelector } from 'react-redux';
|
|
|
|
import ChatButton from '../chat/components/native/ChatButton';
|
|
import RaiseHandContainerButtons from '../reactions/components/native/RaiseHandContainerButtons';
|
|
import TileViewButton from '../video-layout/components/TileViewButton';
|
|
import { iAmVisitor } from '../visitors/functions';
|
|
|
|
import AudioMuteButton from './components/native/AudioMuteButton';
|
|
import CustomOptionButton from './components/native/CustomOptionButton';
|
|
import HangupContainerButtons from './components/native/HangupContainerButtons';
|
|
import OverflowMenuButton from './components/native/OverflowMenuButton';
|
|
import ScreenSharingButton from './components/native/ScreenSharingButton';
|
|
import VideoMuteButton from './components/native/VideoMuteButton';
|
|
import { isDesktopShareButtonDisabled } from './functions.native';
|
|
import { ICustomToolbarButton, IToolboxNativeButton, NativeToolbarButton } from './types';
|
|
|
|
|
|
const microphone = {
|
|
key: 'microphone',
|
|
Content: AudioMuteButton,
|
|
group: 0
|
|
};
|
|
|
|
const camera = {
|
|
key: 'camera',
|
|
Content: VideoMuteButton,
|
|
group: 0
|
|
};
|
|
|
|
const chat = {
|
|
key: 'chat',
|
|
Content: ChatButton,
|
|
group: 1
|
|
};
|
|
|
|
const screensharing = {
|
|
key: 'desktop',
|
|
Content: ScreenSharingButton,
|
|
group: 1
|
|
};
|
|
|
|
const raisehand = {
|
|
key: 'raisehand',
|
|
Content: RaiseHandContainerButtons,
|
|
group: 2
|
|
};
|
|
|
|
const tileview = {
|
|
key: 'tileview',
|
|
Content: TileViewButton,
|
|
group: 2
|
|
};
|
|
|
|
const overflowmenu = {
|
|
key: 'overflowmenu',
|
|
Content: OverflowMenuButton,
|
|
group: 3
|
|
};
|
|
|
|
const hangup = {
|
|
key: 'hangup',
|
|
Content: HangupContainerButtons,
|
|
group: 3
|
|
};
|
|
|
|
/**
|
|
* Returns all buttons that could be rendered.
|
|
*
|
|
* @param {Object} _customToolbarButtons - An array containing custom buttons objects.
|
|
* @returns {Object} The button maps mainMenuButtons and overflowMenuButtons.
|
|
*/
|
|
export function useNativeToolboxButtons(
|
|
_customToolbarButtons?: ICustomToolbarButton[]): { [key: string]: IToolboxNativeButton; } {
|
|
const _iAmVisitor = useSelector(iAmVisitor);
|
|
const _isScreenShareButtonDisabled = useSelector(isDesktopShareButtonDisabled);
|
|
|
|
return useMemo(() => {
|
|
const buttons: { [key in NativeToolbarButton]?: IToolboxNativeButton; } = {
|
|
chat,
|
|
raisehand,
|
|
tileview,
|
|
overflowmenu,
|
|
hangup
|
|
};
|
|
|
|
if (!_iAmVisitor) {
|
|
buttons.microphone = microphone;
|
|
buttons.camera = camera;
|
|
|
|
if (!_isScreenShareButtonDisabled) {
|
|
buttons.desktop = screensharing;
|
|
}
|
|
}
|
|
|
|
const customButtons = _customToolbarButtons?.reduce((prev, { backgroundColor, icon, id, text }) => {
|
|
prev[id] = {
|
|
backgroundColor,
|
|
key: id,
|
|
id,
|
|
Content: CustomOptionButton,
|
|
group: 4,
|
|
icon,
|
|
text
|
|
};
|
|
|
|
return prev;
|
|
}, {} as { [key: string]: ICustomToolbarButton; });
|
|
|
|
return {
|
|
...buttons,
|
|
...customButtons
|
|
};
|
|
}, [ _iAmVisitor, _isScreenShareButtonDisabled, _customToolbarButtons ]);
|
|
}
|