feat: upload files with postage stamps (#126)

* chore: release 0.3.0 * feat: added postage stamp table to list all stamps * feat: postage stamp modal to purchase stamps * feat: postage stamps provider * chore: added formik * chore: proper form state handling * chore: revert accidental release inclusion * chore: polishing identified when developing the upload functionality * feat: upload files with postage stamps * style: tabs styles are defined in theme now, addressed other PR comments * style: removed unused styles * fix: enable encrypted hashes to download Co-authored-by: bee-worker <70210089+bee-worker@users.noreply.github.com>
2021-06-02 13:25:49 +02:00
parent 4074a9de5d
commit 92c727e5f5
7 changed files with 365 additions and 74 deletions
@@ -0,0 +1,48 @@
+import React, { ReactElement } from 'react'
+import Button from '@material-ui/core/Button'
+import Menu from '@material-ui/core/Menu'
+import MenuItem from '@material-ui/core/MenuItem'
+import ListItemIcon from '@material-ui/core/ListItemIcon'
+import { PostageBatch } from '@ethersphere/bee-js'
+import PeerDetailDrawer from '../../components/PeerDetail'
+
+interface Props {
+  stamps: PostageBatch[] | null
+  selectedStamp: PostageBatch | null
+  setSelected: (stamp: PostageBatch) => void
+}
+
+export default function SimpleMenu({ stamps, selectedStamp, setSelected }: Props): ReactElement | null {
+  const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null)
+
+  if (!stamps) return null
+
+  const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
+    setAnchorEl(event.currentTarget)
+  }
+
+  const handleClose = () => setAnchorEl(null)
+
+  return (
+    <div>
+      <Button aria-controls="simple-menu" aria-haspopup="true" onClick={handleClick}>
+        Change
+      </Button>
+      <Menu id="simple-menu" anchorEl={anchorEl} keepMounted open={Boolean(anchorEl)} onClose={handleClose}>
+        {stamps.map(stamp => (
+          <MenuItem
+            key={stamp.batchID}
+            onClick={() => {
+              setSelected(stamp)
+              handleClose()
+            }}
+            selected={stamp.batchID === selectedStamp?.batchID}
+          >
+            <ListItemIcon>{stamp.utilization}</ListItemIcon>
+            <PeerDetailDrawer peerId={stamp.batchID} />
+          </MenuItem>
+        ))}
+      </Menu>
+    </div>
+  )
+}