lbry-desktop/ui/component/fileDownloadLink/view.jsx

104 lines
2.6 KiB
React
Raw Normal View History

2018-05-21 22:30:00 +02:00
// @flow
2018-11-26 02:21:25 +01:00
import * as ICONS from 'constants/icons';
import * as MODALS from 'constants/modal_types';
2020-02-01 22:17:20 +01:00
import React, { useState } from 'react';
2018-03-26 23:32:43 +02:00
import Button from 'component/button';
2020-02-01 22:17:20 +01:00
import { generateDownloadUrl } from 'util/lbrytv';
2017-09-08 05:15:05 +02:00
2018-05-21 22:30:00 +02:00
type Props = {
2019-08-06 05:25:33 +02:00
uri: string,
2020-01-07 19:17:43 +01:00
claim: StreamClaim,
claimIsMine: boolean,
2018-05-21 22:30:00 +02:00
downloading: boolean,
loading: boolean,
2019-08-02 08:28:14 +02:00
isStreamable: boolean,
2019-08-06 05:25:33 +02:00
fileInfo: ?FileListItem,
openModal: (id: string, { path: string }) => void,
pause: () => void,
2019-08-06 05:25:33 +02:00
download: string => void,
triggerViewEvent: string => void,
costInfo: ?{ cost: string },
2020-01-29 19:58:43 +01:00
hideOpenButton: boolean,
2020-02-05 03:54:19 +01:00
hideDownloadStatus: boolean,
2018-05-21 22:30:00 +02:00
};
2019-08-02 08:28:14 +02:00
function FileDownloadLink(props: Props) {
const {
fileInfo,
downloading,
loading,
openModal,
pause,
claimIsMine,
download,
uri,
claim,
triggerViewEvent,
costInfo,
2020-01-29 19:58:43 +01:00
hideOpenButton = false,
2020-02-05 03:54:19 +01:00
hideDownloadStatus = false,
} = props;
2020-02-01 22:17:20 +01:00
const [viewEventSent, setViewEventSent] = useState(false);
const cost = costInfo ? Number(costInfo.cost) : 0;
const isPaidContent = cost > 0;
if (!claim || (IS_WEB && isPaidContent)) {
return null;
}
2020-01-07 19:17:43 +01:00
const { name, claim_id: claimId, value } = claim;
const fileName = value && value.source && value.source.name;
2020-02-01 22:17:20 +01:00
const downloadUrl = generateDownloadUrl(name, claimId);
2017-09-08 05:15:05 +02:00
2020-01-29 19:58:43 +01:00
function handleDownload(e) {
// @if TARGET='app'
2020-02-01 22:17:20 +01:00
e.preventDefault();
download(uri);
// @endif;
// @if TARGET='web'
2020-02-01 22:17:20 +01:00
if (!viewEventSent) {
triggerViewEvent(uri);
}
setViewEventSent(true);
// @endif;
}
if (downloading || loading) {
2019-08-02 08:28:14 +02:00
const progress = fileInfo && fileInfo.written_bytes > 0 ? (fileInfo.written_bytes / fileInfo.total_bytes) * 100 : 0;
const label =
2019-08-14 05:56:11 +02:00
fileInfo && fileInfo.written_bytes > 0 ? progress.toFixed(0) + __('% downloaded') : __('Connecting...');
2018-03-26 23:32:43 +02:00
2020-02-05 03:54:19 +01:00
return hideDownloadStatus ? null : <span className="download-text">{label}</span>;
2019-08-02 08:28:14 +02:00
}
2017-09-08 05:15:05 +02:00
2019-08-02 08:28:14 +02:00
if (fileInfo && fileInfo.download_path && fileInfo.completed) {
2020-01-29 19:58:43 +01:00
return hideOpenButton ? null : (
<Button
button="alt"
title={__('Open file')}
icon={ICONS.EXTERNAL}
onClick={() => {
pause();
openModal(MODALS.CONFIRM_EXTERNAL_RESOURCE, { path: fileInfo.download_path, isMine: claimIsMine });
}}
/>
2019-08-02 08:28:14 +02:00
);
2017-09-08 05:15:05 +02:00
}
return (
2020-01-29 19:58:43 +01:00
<Button
button="alt"
title={IS_WEB ? __('Download') : __('Add to your library')}
icon={ICONS.DOWNLOAD}
onClick={handleDownload}
// @if TARGET='web'
download={fileName}
href={downloadUrl}
// @endif
/>
);
2017-09-08 05:15:05 +02:00
}
export default FileDownloadLink;