113 lines
2.6 KiB
JavaScript
113 lines
2.6 KiB
JavaScript
import React, { Component, Fragment } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { connect } from 'react-redux';
|
|
import { withRoomContext } from '../../../RoomContext';
|
|
import magnet from 'magnet-uri';
|
|
|
|
const DEFAULT_PICTURE = 'resources/images/avatar-empty.jpeg';
|
|
|
|
class File extends Component
|
|
{
|
|
render()
|
|
{
|
|
const {
|
|
roomClient,
|
|
torrentSupport,
|
|
file
|
|
} = this.props;
|
|
|
|
return (
|
|
<div className='file-entry'>
|
|
<img className='file-avatar' src={file.picture || DEFAULT_PICTURE} />
|
|
|
|
<div className='file-content'>
|
|
<Choose>
|
|
<When condition={file.me}>
|
|
<p>You shared a file.</p>
|
|
</When>
|
|
<Otherwise>
|
|
<p>{file.displayName} shared a file.</p>
|
|
</Otherwise>
|
|
</Choose>
|
|
|
|
<If condition={!file.active && !file.files}>
|
|
<div className='file-info'>
|
|
<Choose>
|
|
<When condition={torrentSupport}>
|
|
<span
|
|
className='button'
|
|
onClick={() =>
|
|
{
|
|
roomClient.handleDownload(file.magnetUri);
|
|
}}
|
|
>
|
|
<img src='resources/images/download-icon.svg' />
|
|
</span>
|
|
</When>
|
|
<Otherwise>
|
|
<p>
|
|
Your browser does not support downloading files using WebTorrent.
|
|
</p>
|
|
</Otherwise>
|
|
</Choose>
|
|
<p>{magnet.decode(file.magnetUri).dn}</p>
|
|
</div>
|
|
</If>
|
|
|
|
<If condition={file.timeout}>
|
|
<Fragment>
|
|
<p>
|
|
If this process takes a long time, there might not be anyone seeding
|
|
this torrent. Try asking someone to reupload the file that you want.
|
|
</p>
|
|
</Fragment>
|
|
</If>
|
|
|
|
<If condition={file.active}>
|
|
<progress value={file.progress} />
|
|
</If>
|
|
|
|
<If condition={file.files}>
|
|
<Fragment>
|
|
<p>File finished downloading.</p>
|
|
|
|
{file.files.map((sharedFile, i) => (
|
|
<div className='file-info' key={i}>
|
|
<span
|
|
className='button'
|
|
onClick={() =>
|
|
{
|
|
roomClient.saveFile(sharedFile);
|
|
}}
|
|
>
|
|
<img src='resources/images/save-icon.svg' />
|
|
</span>
|
|
|
|
<p>{sharedFile.name}</p>
|
|
</div>
|
|
))}
|
|
</Fragment>
|
|
</If>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
File.propTypes = {
|
|
roomClient : PropTypes.object.isRequired,
|
|
torrentSupport : PropTypes.bool.isRequired,
|
|
file : PropTypes.object.isRequired
|
|
};
|
|
|
|
const mapStateToProps = (state, { magnetUri }) =>
|
|
{
|
|
return {
|
|
file : state.files[magnetUri],
|
|
torrentSupport : state.room.torrentSupport
|
|
};
|
|
};
|
|
|
|
export default withRoomContext(connect(
|
|
mapStateToProps
|
|
)(File)); |