lbry-desktop/ui/component/webUploadList/internal/web-upload-item.jsx

42 lines
1.2 KiB
React
Raw Normal View History

// @flow
import React from 'react';
import Button from 'component/button';
2020-01-06 19:32:35 +01:00
import FileThumbnail from 'component/fileThumbnail';
type Props = {
params: UpdatePublishFormData,
progress: string,
xhr?: () => void,
};
export default function WebUploadItem(props: Props) {
const { params, progress, xhr } = props;
return (
<li className={'claim-preview claim-preview--padded claim-preview--inactive card--inline'}>
2020-01-06 19:32:35 +01:00
<FileThumbnail thumbnail={params.thumbnail_url} />
<div className={'claim-preview-metadata'}>
<div className="claim-preview-info">
2020-01-30 23:25:15 +01:00
<div className="claim-preview__title">{params.title}</div>
{xhr && (
<div className="card__actions--inline">
<Button
2019-10-22 22:42:13 +02:00
button="link"
onClick={() => {
xhr.abort();
}}
2019-10-22 22:42:13 +02:00
label={__('Cancel')}
/>
</div>
)}
</div>
2019-10-22 22:42:13 +02:00
<h2>lbry://{params.name}</h2>
<div className={'claim-upload__progress--outer card--inline'}>
<div className={'claim-upload__progress--inner'} style={{ width: `${progress}%` }}>
Uploading...
</div>
</div>
</div>
</li>
);
}