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:
Generated
+8
-26
@@ -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
@@ -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",
|
||||
|
||||
@@ -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
@@ -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 />
|
||||
|
||||
@@ -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: {
|
||||
|
||||
Reference in New Issue
Block a user