diff --git a/src/common/components/VideoPlayer.tsx b/src/common/components/VideoPlayer.tsx
index ff71c45d4..ede540eb0 100644
--- a/src/common/components/VideoPlayer.tsx
+++ b/src/common/components/VideoPlayer.tsx
@@ -7,18 +7,21 @@ type VideoPlayerProps = YouTubePlayerProps & {
// make the player responsive
responsive?: boolean;
// set this to not set the full URL
+ vimeoVideoId?: string;
+ // set this to not set the full URL
youTubeVideoId?: string;
};
const VideoPlayerDynamic = React.lazy(async () => {
// dynamically import react-player (saves 7kb but still..)
+ const { default: ReactPlayerVimeo } = await import('react-player/vimeo');
const { default: ReactPlayerYouTube } = await import('react-player/youtube');
return {
default: (props: YouTubePlayerProps) => {
- const { responsive, youTubeVideoId, ...baseProps } = props;
+ const { responsive, youTubeVideoId, vimeoVideoId, ...baseProps } = props;
// responsive patch
if (responsive) {
@@ -26,11 +29,17 @@ const VideoPlayerDynamic = React.lazy(async () => {
baseProps.height = '100%';
}
- // fill in the URL if we have a YouTube video ID
- if (youTubeVideoId) {
- baseProps.url = `https://www.youtube.com/watch?v=${youTubeVideoId}`;
- }
+ // Vimeo Video ID
+ if (props.vimeoVideoId)
+ baseProps.url = `https://vimeo.com/${props.vimeoVideoId}`;
+ if (baseProps.url?.indexOf('vimeo.') > 0)
+ return ;
+ // YouTube video ID
+ if (youTubeVideoId)
+ baseProps.url = `https://www.youtube.com/watch?v=${youTubeVideoId}`;
+
+ // fallback to YouTube
return ;
},
};
diff --git a/src/common/components/modals/GoodModal.tsx b/src/common/components/modals/GoodModal.tsx
index f1df7496c..1882e0846 100644
--- a/src/common/components/modals/GoodModal.tsx
+++ b/src/common/components/modals/GoodModal.tsx
@@ -71,7 +71,7 @@ export function GoodModal(props: {
{props.children}
{/**/}
- {props.dividers === true && }
+ {props.dividers === true && (!!props.startButton || showBottomClose) && }
{(!!props.startButton || showBottomClose) &&
{props.startButton}