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
2021-06-18 12:37:09 +02:00
parent 5748c9b609
commit af88027ba9
5 changed files with 65 additions and 42 deletions
@@ -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>
+  )
+}