61 lines
1.7 KiB
JavaScript
61 lines
1.7 KiB
JavaScript
// @flow
|
|
import React, { useState, useEffect } from 'react';
|
|
import classnames from 'classnames';
|
|
import FileRender from 'component/fileRender';
|
|
import usePrevious from 'effects/use-previous';
|
|
|
|
type Props = {
|
|
mediaType: string,
|
|
contentType: string,
|
|
isPlaying: boolean,
|
|
fileInfo: FileListItem,
|
|
uri: string,
|
|
isStreamable: boolean,
|
|
streamingUrl?: string,
|
|
triggerAnalyticsView: (string, number) => Promise<any>,
|
|
claimRewards: () => void,
|
|
};
|
|
|
|
export default function TextViewer(props: Props) {
|
|
const {
|
|
isPlaying,
|
|
fileInfo,
|
|
uri,
|
|
streamingUrl,
|
|
isStreamable,
|
|
triggerAnalyticsView,
|
|
claimRewards,
|
|
mediaType,
|
|
contentType,
|
|
} = props;
|
|
const [playTime, setPlayTime] = useState();
|
|
const webStreamOnly = contentType === 'application/pdf' || mediaType === 'text';
|
|
const previousUri = usePrevious(uri);
|
|
const isNewView = uri && previousUri !== uri && isPlaying;
|
|
const [hasRecordedView, setHasRecordedView] = useState(false);
|
|
const isReadyToPlay = (IS_WEB && (isStreamable || streamingUrl || webStreamOnly)) || (fileInfo && fileInfo.completed);
|
|
|
|
useEffect(() => {
|
|
if (isNewView) {
|
|
setPlayTime(Date.now());
|
|
}
|
|
}, [isNewView, uri]);
|
|
|
|
useEffect(() => {
|
|
if (playTime && isReadyToPlay && !hasRecordedView) {
|
|
const timeToStart = Date.now() - playTime;
|
|
triggerAnalyticsView(uri, timeToStart).then(() => {
|
|
claimRewards();
|
|
setHasRecordedView(false);
|
|
setPlayTime(null);
|
|
});
|
|
}
|
|
}, [setPlayTime, triggerAnalyticsView, isReadyToPlay, hasRecordedView, playTime, uri, claimRewards]);
|
|
|
|
return (
|
|
<div className={classnames('content__viewersss')}>
|
|
{isReadyToPlay ? <FileRender uri={uri} /> : <div className="placeholder--text-document" />}
|
|
</div>
|
|
);
|
|
}
|