diff --git a/frontend/src/static/js/components/media-page/ViewerInfoVideoTitleBanner.js b/frontend/src/static/js/components/media-page/ViewerInfoVideoTitleBanner.js
index 1ea3d8e6..6863a78b 100644
--- a/frontend/src/static/js/components/media-page/ViewerInfoVideoTitleBanner.js
+++ b/frontend/src/static/js/components/media-page/ViewerInfoVideoTitleBanner.js
@@ -1,107 +1,119 @@
import React from 'react';
-import { formatViewsNumber } from '../../utils/helpers/';
+import { formatViewsNumber, inEmbeddedApp } from '../../utils/helpers/';
import { PageStore, MediaPageStore } from '../../utils/stores/';
import { MemberContext, PlaylistsContext } from '../../utils/contexts/';
-import { MediaLikeIcon, MediaDislikeIcon, OtherMediaDownloadLink, VideoMediaDownloadLink, MediaSaveButton, MediaShareButton, MediaMoreOptionsIcon } from '../media-actions/';
+import {
+ MediaLikeIcon,
+ MediaDislikeIcon,
+ OtherMediaDownloadLink,
+ VideoMediaDownloadLink,
+ MediaSaveButton,
+ MediaShareButton,
+ MediaMoreOptionsIcon,
+} from '../media-actions/';
import ViewerInfoTitleBanner from './ViewerInfoTitleBanner';
import { translateString } from '../../utils/helpers/';
export default class ViewerInfoVideoTitleBanner extends ViewerInfoTitleBanner {
- render() {
- const displayViews = PageStore.get('config-options').pages.media.displayViews && void 0 !== this.props.views;
+ render() {
+ const displayViews = PageStore.get('config-options').pages.media.displayViews && void 0 !== this.props.views;
- const mediaData = MediaPageStore.get('media-data');
- const mediaState = mediaData.state;
- const isShared = mediaData.is_shared;
+ const mediaData = MediaPageStore.get('media-data');
+ const mediaState = mediaData.state;
+ const isShared = mediaData.is_shared;
- let stateTooltip = '';
+ let stateTooltip = '';
- switch (mediaState) {
- case 'private':
- stateTooltip = 'The site admins have to make its access public';
- break;
- case 'unlisted':
- stateTooltip = 'The site admins have to make it appear on listings';
- break;
+ switch (mediaState) {
+ case 'private':
+ stateTooltip = 'The site admins have to make its access public';
+ break;
+ case 'unlisted':
+ stateTooltip = 'The site admins have to make it appear on listings';
+ break;
+ }
+
+ const sharedTooltip = 'This media is shared with specific users or categories';
+
+ return (
+
+ {displayViews && PageStore.get('config-options').pages.media.categoriesWithTitle
+ ? this.mediaCategories(true)
+ : null}
+
+ {void 0 !== this.props.title ?
{this.props.title}
: null}
+
+ {isShared || 'public' !== mediaState ? (
+
+
+ {isShared ? (
+ <>
+
+ shared
+
+
+ help_outline
+
+ >
+ ) : 'public' !== mediaState ? (
+ <>
+
+ {mediaState}
+
+
+ help_outline
+
+ >
+ ) : null}
+
+
+ ) : null}
+
+
+ {!displayViews && PageStore.get('config-options').pages.media.categoriesWithTitle
+ ? this.mediaCategories()
+ : null}
+
+ {displayViews ? (
+
+ {formatViewsNumber(this.props.views, true)}{' '}
+ {1 >= this.props.views ? translateString('view') : translateString('views')}
+
+ ) : null}
+
+
+
+ {MemberContext._currentValue.can.likeMedia ? : null}
+ {MemberContext._currentValue.can.dislikeMedia ? : null}
+ {!inEmbeddedApp() && MemberContext._currentValue.can.shareMedia ? (
+
+ ) : null}
+
+ {!inEmbeddedApp() &&
+ !MemberContext._currentValue.is.anonymous &&
+ MemberContext._currentValue.can.saveMedia &&
+ -1 < PlaylistsContext._currentValue.mediaTypes.indexOf(MediaPageStore.get('media-type')) ? (
+
+ ) : null}
+
+ {!this.props.allowDownload || !MemberContext._currentValue.can.downloadMedia ? null : !this
+ .downloadLink ? (
+
+ ) : (
+
+ )}
+
+
+
+
+
+
+ );
}
-
- const sharedTooltip = 'This media is shared with specific users or categories';
-
- return (
-
- {displayViews && PageStore.get('config-options').pages.media.categoriesWithTitle
- ? this.mediaCategories(true)
- : null}
-
- {void 0 !== this.props.title ?
{this.props.title}
: null}
-
- {isShared || 'public' !== mediaState ? (
-
-
- {isShared ? (
- <>
-
- shared
-
-
- help_outline
-
- >
- ) : 'public' !== mediaState ? (
- <>
-
- {mediaState}
-
-
- help_outline
-
- >
- ) : null}
-
-
- ) : null}
-
-
- {!displayViews && PageStore.get('config-options').pages.media.categoriesWithTitle
- ? this.mediaCategories()
- : null}
-
- {displayViews ? (
-
- {formatViewsNumber(this.props.views, true)} {1 >= this.props.views ? translateString('view') : translateString('views')}
-
- ) : null}
-
-
-
- {MemberContext._currentValue.can.likeMedia ? : null}
- {MemberContext._currentValue.can.dislikeMedia ? : null}
- {MemberContext._currentValue.can.shareMedia ? : null}
-
- {!MemberContext._currentValue.is.anonymous &&
- MemberContext._currentValue.can.saveMedia &&
- -1 < PlaylistsContext._currentValue.mediaTypes.indexOf(MediaPageStore.get('media-type')) ? (
-
- ) : null}
-
- {!this.props.allowDownload || !MemberContext._currentValue.can.downloadMedia ? null : !this
- .downloadLink ? (
-
- ) : (
-
- )}
-
-
-
-
-
-
- );
- }
}