41 lines
1.2 KiB
JavaScript
41 lines
1.2 KiB
JavaScript
// @flow
|
|
import React from 'react';
|
|
import Button from 'component/button';
|
|
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'}>
|
|
<FileThumbnail thumbnail={params.thumbnail_url} />
|
|
<div className={'claim-preview-metadata'}>
|
|
<div className="claim-preview-info">
|
|
<div className="claim-preview__title">{params.title}</div>
|
|
{xhr && (
|
|
<div className="card__actions--inline">
|
|
<Button
|
|
button="link"
|
|
onClick={() => {
|
|
xhr.abort();
|
|
}}
|
|
label={__('Cancel')}
|
|
/>
|
|
</div>
|
|
)}
|
|
</div>
|
|
<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>
|
|
);
|
|
}
|