86 lines
2.3 KiB
JavaScript
86 lines
2.3 KiB
JavaScript
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { defineMessages } from 'react-intl';
|
|
import { safeMatch } from '/imports/utils/string-utils';
|
|
import { isUrlValid, startWatching } from '/imports/ui/components/external-video-player/service';
|
|
import BBBMenu from '/imports/ui/components/common/menu/component';
|
|
import Styled from './styles';
|
|
|
|
const intlMessages = defineMessages({
|
|
externalVideo: {
|
|
id: 'app.smartMediaShare.externalVideo',
|
|
},
|
|
});
|
|
|
|
export const SmartMediaShare = (props) => {
|
|
const {
|
|
currentSlide, intl, isMobile, isRTL,
|
|
} = props;
|
|
const linkPatt = /(https?:\/\/.*[ ]$)/g;
|
|
const externalLinks = safeMatch(linkPatt, currentSlide?.content?.replace(/[\r\n]/g, ' '), false);
|
|
if (!externalLinks) return null;
|
|
|
|
const lnkParts = externalLinks[0]?.split(' ')?.filter(s => !s?.includes(' ')).join('');
|
|
const actions = [];
|
|
|
|
const splitLink = lnkParts?.split('https://');
|
|
splitLink.forEach((l) => {
|
|
if (isUrlValid(`https://${l}`)) {
|
|
actions.push({
|
|
label: l,
|
|
onClick: () => startWatching(`https://${l}`),
|
|
});
|
|
}
|
|
});
|
|
|
|
if (actions?.length === 0) return null;
|
|
|
|
const customStyles = { top: '-1rem' };
|
|
|
|
return (
|
|
<BBBMenu
|
|
customStyles={!isMobile ? customStyles : null}
|
|
trigger={(
|
|
<Styled.QuickVideoButton
|
|
role="button"
|
|
label={intl.formatMessage(intlMessages.externalVideo)}
|
|
color="light"
|
|
circle
|
|
icon="external-video"
|
|
size="md"
|
|
onClick={() => null}
|
|
hideLabel
|
|
/>
|
|
)}
|
|
actions={actions}
|
|
opts={{
|
|
id: 'external-video-dropdown-menu',
|
|
keepMounted: true,
|
|
transitionDuration: 0,
|
|
elevation: 3,
|
|
getcontentanchorel: null,
|
|
fullwidth: 'true',
|
|
anchorOrigin: { vertical: 'top', horizontal: isRTL ? 'right' : 'left' },
|
|
transformOrigin: { vertical: 'bottom', horizontal: isRTL ? 'right' : 'left' },
|
|
}}
|
|
/>
|
|
);
|
|
};
|
|
|
|
export default SmartMediaShare;
|
|
|
|
SmartMediaShare.propTypes = {
|
|
currentSlide: PropTypes.shape({
|
|
content: PropTypes.string.isRequired,
|
|
}),
|
|
intl: PropTypes.shape({
|
|
formatMessage: PropTypes.func.isRequired,
|
|
}).isRequired,
|
|
isMobile: PropTypes.bool.isRequired,
|
|
isRTL: PropTypes.bool.isRequired,
|
|
};
|
|
|
|
SmartMediaShare.defaultProps = {
|
|
currentSlide: undefined,
|
|
};
|