refactor: call toString on numerical values to be bee-js compatible (#148)

* refactor: call toString on numerical values to be bee-js compatible

* feat: add upload size check
This commit is contained in:
Cafe137
2021-06-18 12:37:09 +02:00
committed by GitHub
parent 5748c9b609
commit af88027ba9
5 changed files with 65 additions and 42 deletions
+8 -26
View File
@@ -9,7 +9,7 @@
"version": "0.3.1",
"license": "BSD-3-Clause",
"dependencies": {
"@ethersphere/bee-js": "^0.10.0",
"@ethersphere/bee-js": "^0.12.0",
"@material-ui/core": "^4.11.4",
"@material-ui/icons": "^4.11.2",
"@material-ui/lab": "^4.0.0-alpha.57",
@@ -1460,20 +1460,19 @@
}
},
"node_modules/@ethersphere/bee-js": {
"version": "0.10.0",
"resolved": "https://registry.npmjs.org/@ethersphere/bee-js/-/bee-js-0.10.0.tgz",
"integrity": "sha512-j5HcrtN+LMmaqDNqdI5jUmU4YM039rV/vvOM2xsUX3+sFZBP00KVrpUsEMBzqQspU6U7//0y3BKx634V1hvpCA==",
"version": "0.12.0",
"resolved": "https://registry.npmjs.org/@ethersphere/bee-js/-/bee-js-0.12.0.tgz",
"integrity": "sha512-fpZjbjIU5pxuGGo6nvVyAkEvCNSYIuoUb5fyaaIyZ+czswEkVm5oPeEfNvF703EWnar6kcAjCpAOs+dLWwLKAg==",
"dependencies": {
"axios": "^0.21.1",
"elliptic": "^6.5.4",
"isomorphic-ws": "^4.0.1",
"js-sha3": "^0.8.0",
"json-bigint": "^1.0.0",
"tar-js": "^0.3.0",
"ws": "^7.4.4"
},
"engines": {
"bee": "0.6.2-984dca0a",
"bee": "1.0.0-3a92ef5-dirty",
"node": ">=12.0.0",
"npm": ">=6.0.0"
}
@@ -11760,14 +11759,6 @@
"node": ">=4"
}
},
"node_modules/json-bigint": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/json-bigint/-/json-bigint-1.0.0.tgz",
"integrity": "sha512-SiPv/8VpZuWbvLSMtTDU8hEfrZWg/mH/nV/b4o0CYbSxu1UIQPLdwKOCIyLQX+VIPO5vrLX3i8qtqFyhdPSUSQ==",
"dependencies": {
"bignumber.js": "^9.0.0"
}
},
"node_modules/json-parse-better-errors": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz",
@@ -22904,15 +22895,14 @@
}
},
"@ethersphere/bee-js": {
"version": "0.10.0",
"resolved": "https://registry.npmjs.org/@ethersphere/bee-js/-/bee-js-0.10.0.tgz",
"integrity": "sha512-j5HcrtN+LMmaqDNqdI5jUmU4YM039rV/vvOM2xsUX3+sFZBP00KVrpUsEMBzqQspU6U7//0y3BKx634V1hvpCA==",
"version": "0.12.0",
"resolved": "https://registry.npmjs.org/@ethersphere/bee-js/-/bee-js-0.12.0.tgz",
"integrity": "sha512-fpZjbjIU5pxuGGo6nvVyAkEvCNSYIuoUb5fyaaIyZ+czswEkVm5oPeEfNvF703EWnar6kcAjCpAOs+dLWwLKAg==",
"requires": {
"axios": "^0.21.1",
"elliptic": "^6.5.4",
"isomorphic-ws": "^4.0.1",
"js-sha3": "^0.8.0",
"json-bigint": "^1.0.0",
"tar-js": "^0.3.0",
"ws": "^7.4.4"
}
@@ -31634,14 +31624,6 @@
"integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==",
"dev": true
},
"json-bigint": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/json-bigint/-/json-bigint-1.0.0.tgz",
"integrity": "sha512-SiPv/8VpZuWbvLSMtTDU8hEfrZWg/mH/nV/b4o0CYbSxu1UIQPLdwKOCIyLQX+VIPO5vrLX3i8qtqFyhdPSUSQ==",
"requires": {
"bignumber.js": "^9.0.0"
}
},
"json-parse-better-errors": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz",
+1 -1
View File
@@ -24,7 +24,7 @@
"url": "https://github.com/ethersphere/bee-dashboard.git"
},
"dependencies": {
"@ethersphere/bee-js": "^0.10.0",
"@ethersphere/bee-js": "^0.12.0",
"@material-ui/core": "^4.11.4",
"@material-ui/icons": "^4.11.2",
"@material-ui/lab": "^4.0.0-alpha.57",
+38
View File
@@ -0,0 +1,38 @@
import Collapse from '@material-ui/core/Collapse'
import { createStyles, makeStyles, Theme } from '@material-ui/core/styles'
import { Alert, AlertTitle } from '@material-ui/lab'
import { ReactElement } from 'react'
const LIMIT = 100_000_000 // 100 megabytes
interface Props {
file: File
}
const useStyles = makeStyles((theme: Theme) =>
createStyles({
root: {
width: '100%',
marginTop: theme.spacing(2),
marginBottom: theme.spacing(2),
},
}),
)
export default function UploadSizeAlert(props: Props): ReactElement | null {
const classes = useStyles()
const aboveLimit = props.file.size >= LIMIT
return (
<Collapse in={aboveLimit}>
<div className={classes.root}>
<Alert severity="warning">
<AlertTitle>Warning</AlertTitle>
The file you are trying to upload is above the recommended size. The chunks may not be synchronised properly
over the network.
</Alert>
</div>
</Collapse>
)
}
+15 -12
View File
@@ -1,17 +1,19 @@
import { ReactElement, useContext, useEffect, useState } from 'react'
import { beeApi } from '../../services/bee'
import { Button, Container, CircularProgress } from '@material-ui/core'
import { DropzoneArea } from 'material-ui-dropzone'
import ClipboardCopy from '../../components/ClipboardCopy'
import { PostageBatch } from '@ethersphere/bee-js'
import { Context } from '../../providers/Stamps'
import PeerDetailDrawer from '../../components/PeerDetail'
import Chip from '@material-ui/core/Chip'
import { Button, CircularProgress, Container } from '@material-ui/core'
import Avatar from '@material-ui/core/Avatar'
import SelectStamp from './SelectStamp'
import CreatePostageStamp from '../stamps/CreatePostageStampModal'
import Chip from '@material-ui/core/Chip'
import { DropzoneArea } from 'material-ui-dropzone'
import { useSnackbar } from 'notistack'
import { ReactElement, useContext, useEffect, useState } from 'react'
import UploadSizeAlert from '../../components/AlertUploadSize'
import ClipboardCopy from '../../components/ClipboardCopy'
import PeerDetailDrawer from '../../components/PeerDetail'
import { Context } from '../../providers/Stamps'
import { beeApi } from '../../services/bee'
import CreatePostageStamp from '../stamps/CreatePostageStampModal'
import SelectStamp from './SelectStamp'
const MAX_FILE_SIZE = 1_000_000_000 // 1 gigabyte
export default function Files(): ReactElement {
const [file, setFile] = useState<File | null>(null)
@@ -61,7 +63,7 @@ export default function Files(): ReactElement {
return (
<div>
<div>
<DropzoneArea onChange={handleChange} filesLimit={1} />
<DropzoneArea onChange={handleChange} filesLimit={1} maxFileSize={MAX_FILE_SIZE} />
<div style={{ marginTop: '15px' }}>
{selectedStamp && (
<div style={{ display: 'flex' }}>
@@ -82,6 +84,7 @@ export default function Files(): ReactElement {
<Button disabled={!file && isUploadingFile && !selectedStamp} onClick={() => uploadFile()}>
Upload
</Button>
{file && <UploadSizeAlert file={file} />}
{isUploadingFile && (
<Container style={{ textAlign: 'center', padding: '50px' }}>
<CircularProgress />
+3 -3
View File
@@ -45,7 +45,7 @@ export const beeApi = {
return beeJSClient().getAllPostageBatch()
},
buyPostageStamp(amount: bigint, depth: number, options: PostageBatchOptions = {}): Promise<Address> {
return beeJSClient().createPostageBatch(amount, depth, options)
return beeJSClient().createPostageBatch(amount.toString(), depth, options)
},
},
}
@@ -95,10 +95,10 @@ export const beeDebugApi = {
return beeJSDebugClient().getLastChequesForPeer(peerId)
},
withdraw(amount: bigint): Promise<string> {
return beeJSDebugClient().withdrawTokens(amount)
return beeJSDebugClient().withdrawTokens(amount.toString())
},
deposit(amount: bigint): Promise<string> {
return beeJSDebugClient().depositTokens(amount)
return beeJSDebugClient().depositTokens(amount.toString())
},
},
settlements: {