1
0
mirror of https://github.com/oceanprotocol/commons.git synced 2023-03-15 18:03:00 +01:00

make showing received file size more reliable

This commit is contained in:
Matthias Kretschmann 2019-09-19 14:48:35 +02:00
parent 1813207772
commit 483cc35de3
Signed by: m
GPG Key ID: 606EEEF3C479A91F
5 changed files with 15 additions and 18 deletions

View File

@ -25,14 +25,15 @@ export default function Ipfs({ addFile }: { addFile(url: string): void }) {
const [loading, setLoading] = useState(false)
const [message, setMessage] = useState('')
const [received, setReceived] = useState(0)
const [fileSize, setFileSize] = useState('')
const [fileSizeReceived, setFileSizeReceived] = useState('')
useEffect(() => {
setMessage(
`Adding to IPFS<br />
<small>${formatBytes(received, 0)}</small><br />`
<small>${fileSizeReceived || 0}/${fileSize}</small><br />`
)
}, [received])
})
async function addToIpfs(data: any) {
try {
@ -40,7 +41,7 @@ export default function Ipfs({ addFile }: { addFile(url: string): void }) {
wrapWithDirectory: true,
progress: (length: number) => {
console.log(`Received: ${formatBytes(length, 0)}`)
setReceived(length)
setFileSizeReceived(formatBytes(length, 0))
}
})
@ -61,7 +62,7 @@ export default function Ipfs({ addFile }: { addFile(url: string): void }) {
const totalSize = formatBytes(size, 0)
setLoading(true)
setMessage(`Adding to IPFS<br /><small>0/${totalSize}</small><br />`)
setFileSize(totalSize)
// Add file to IPFS node
const content: any = await readFileAsync(acceptedFiles[0])

View File

@ -4,8 +4,9 @@
font-size: $font-size-small;
display: block;
margin-bottom: $spacer / 8;
// TODO: truncate long urls with ellipsis
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-all;
}
.remove {

View File

@ -5,7 +5,7 @@ import Dotdotdot from 'react-dotdotdot'
const Item = ({
item,
removeItem
removeFile
}: {
item: {
url: string
@ -13,7 +13,7 @@ const Item = ({
contentType: string
contentLength: number
}
removeItem(): void
removeFile(): void
}) => (
<li>
<a href={item.url} className={styles.linkUrl} title={item.url}>
@ -36,7 +36,7 @@ const Item = ({
type="button"
className={styles.remove}
title="Remove item"
onClick={removeItem}
onClick={removeFile}
>
&times;
</button>

View File

@ -169,9 +169,9 @@ export default class Files extends PureComponent<FilesProps, FilesStates> {
<ul className={styles.itemsList}>
{files.map((item: any, index: number) => (
<Item
key={item.url}
key={shortid.generate()}
item={item}
removeItem={() => this.removeFile(index)}
removeFile={() => this.removeFile(index)}
/>
))}
</ul>

View File

@ -32,12 +32,7 @@ describe('Publish', () => {
<MemoryRouter>
<Publish
history={history}
location={{
pathname: '/publish',
search: '',
hash: '',
state: ''
}}
location={location}
match={{ params: '', path: '', url: '', isExact: true }}
/>
</MemoryRouter>