79 lines
2.1 KiB
TypeScript
79 lines
2.1 KiB
TypeScript
import React, { useCallback } from 'react';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
import { IconScreenshare } from '../../base/icons/svg';
|
|
import ContextMenuItem from '../../base/ui/components/web/ContextMenuItem';
|
|
import { NOTIFY_CLICK_MODE } from '../../toolbox/types';
|
|
import { IButtonProps } from '../../video-menu/types';
|
|
import { useSendToSecondScreen } from '../hooks.web';
|
|
import { ISecondScreenSource } from '../types';
|
|
|
|
interface IProps extends IButtonProps {
|
|
|
|
/**
|
|
* Button text class name.
|
|
*/
|
|
className?: string;
|
|
|
|
/**
|
|
* Whether the icon should be hidden or not.
|
|
*/
|
|
noIcon?: boolean;
|
|
|
|
/**
|
|
* Click handler executed aside from the main action.
|
|
*/
|
|
onClick?: Function;
|
|
|
|
/**
|
|
* What to show on the second screen.
|
|
*/
|
|
source: ISecondScreenSource;
|
|
}
|
|
|
|
/**
|
|
* A context-menu entry that sends its source to a second screen, and takes it
|
|
* off again once it is there. Renders nothing when the feature is unavailable,
|
|
* so it can be added unconditionally to a menu.
|
|
*
|
|
* @param {IProps} props - The component props.
|
|
* @returns {ReactElement | null}
|
|
*/
|
|
const SendToSecondScreenButton = ({
|
|
className,
|
|
noIcon = false,
|
|
notifyClick,
|
|
notifyMode,
|
|
onClick,
|
|
source
|
|
}: IProps) => {
|
|
const { t } = useTranslation();
|
|
const { active, onClick: sendToSecondScreen, visible } = useSendToSecondScreen(source);
|
|
|
|
const _onClick = useCallback(() => {
|
|
notifyClick?.();
|
|
if (notifyMode === NOTIFY_CLICK_MODE.PREVENT_AND_NOTIFY) {
|
|
return;
|
|
}
|
|
sendToSecondScreen();
|
|
onClick?.();
|
|
}, [ notifyClick, notifyMode, onClick, sendToSecondScreen ]);
|
|
|
|
if (!visible) {
|
|
return null;
|
|
}
|
|
|
|
const text = t(active ? 'multiScreen.removeFromSecondScreen' : 'multiScreen.sendToSecondScreen');
|
|
|
|
return (
|
|
<ContextMenuItem
|
|
accessibilityLabel = { text }
|
|
icon = { noIcon ? null : IconScreenshare }
|
|
onClick = { _onClick }
|
|
text = { text }
|
|
textClassName = { className } />
|
|
);
|
|
};
|
|
|
|
export default SendToSecondScreenButton;
|