bigbluebutton-Github/bigbluebutton-html5/imports/ui/components/presentation/presentation-toolbar/smart-video-share/container.jsx
2024-01-19 10:44:27 -03:00

48 lines
1.4 KiB
JavaScript

import React from 'react';
import { withTracker } from 'meteor/react-meteor-data';
import { useMutation } from '@apollo/client';
import { SmartMediaShare } from './component';
import NotesService from '/imports/ui/components/notes/service';
import Panopto from '../../../external-video-player/custom-players/panopto';
import { layoutSelect } from '/imports/ui/components/layout/context';
import { isMobile } from '/imports/ui/components/layout/utils';
import { EXTERNAL_VIDEO_START } from '../../../external-video-player/mutations';
const YOUTUBE_SHORTS_REGEX = new RegExp(/^(?:https?:\/\/)?(?:www\.)?(youtube\.com\/shorts)\/.+$/);
const SmartMediaShareContainer = (props) => {
const [startExternalVideo] = useMutation(EXTERNAL_VIDEO_START);
const startWatching = (url) => {
let externalVideoUrl = url;
if (YOUTUBE_SHORTS_REGEX.test(url)) {
const shortsUrl = url.replace('shorts/', 'watch?v=');
externalVideoUrl = shortsUrl;
} else if (Panopto.canPlay(url)) {
externalVideoUrl = Panopto.getSocialUrl(url);
}
// Close Shared Notes if open.
NotesService.pinSharedNotes(false);
startExternalVideo({ variables: { externalVideoUrl } });
};
return (
<SmartMediaShare {...{
startWatching,
...props,
}}
/>
);
};
export default withTracker(() => {
const isRTL = layoutSelect((i) => i.isRTL);
return {
isRTL,
isMobile: isMobile(),
};
})(SmartMediaShareContainer);