Compare commits
10 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 OpenCode
|
29b138346e | ||
 woggioni
|
b5b0d37e94 | ||
 bee-worker
|
b3137fbef1 | ||
 Ferenc Sárai
|
e6f882d7e1 | ||
|
bee-worker
|
eda0529dfd | ||
|
Ferenc Sárai
|
cb5adfe031 | ||
|
Ferenc Sárai
|
4848b5be97 | ||
|
Ferenc Sárai
|
becb87377e | ||
|
bee-worker
|
f149f86155 | ||
|
Ferenc Sárai
|
37ab8fedaa |
+4
-1
@@ -1,3 +1,6 @@
|
||||
PORT=3002
|
||||
VITE_BEE_DESKTOP_URL=http://localhost:3054
|
||||
VITE_FORMBRICKS_ENV_ID=
|
||||
VITE_FORMBRICKS_APP_URL=
|
||||
VITE_FORMBRICKS_APP_URL=
|
||||
VITE_DEFAULT_RPC_URL=
|
||||
VITE_BEE_DESKTOP_ENABLED=
|
||||
@@ -1,5 +1,6 @@
|
||||
name: Publish on npm
|
||||
on:
|
||||
workflow_dispatch:
|
||||
release:
|
||||
types: [published]
|
||||
|
||||
@@ -35,4 +36,4 @@ jobs:
|
||||
|
||||
- run: pnpm install --frozen-lockfile
|
||||
|
||||
- run: pnpm publish --provenance --access public
|
||||
- run: pnpm publish --provenance --access public --no-git-checks
|
||||
|
||||
@@ -23,6 +23,7 @@
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
/**.log
|
||||
|
||||
|
||||
settings.json
|
||||
|
||||
+73
-28
@@ -1,42 +1,87 @@
|
||||
# Changelog
|
||||
|
||||
## [0.34.0](https://github.com/ethersphere/bee-dashboard/compare/v0.33.5...v0.34.0) (2026-03-20)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* add image opening functionality to DownloadActionBar ([#725](https://github.com/ethersphere/bee-dashboard/issues/725)) ([3ff645c](https://github.com/ethersphere/bee-dashboard/commit/3ff645cab1b4e9fba0c42ed99e7c3fac7b0ed0ca))
|
||||
* spdv-995 ([#225](https://github.com/ethersphere/bee-dashboard/issues/225)) ([fa8a26e](https://github.com/ethersphere/bee-dashboard/commit/fa8a26e80d83d5c794a9d572cf716f0cb484e642))
|
||||
* sync and update with all changes from fork ([#720](https://github.com/ethersphere/bee-dashboard/issues/720)) ([519c411](https://github.com/ethersphere/bee-dashboard/commit/519c411db0b37f3d4004366ca267013e2268f8eb))
|
||||
## [0.35.1](https://github.com/ethersphere/bee-dashboard/compare/v0.35.0...v0.35.1) (2026-04-10)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* add error handling and ui notifications for download failures ([#217](https://github.com/ethersphere/bee-dashboard/issues/217)) ([b58f01c](https://github.com/ethersphere/bee-dashboard/commit/b58f01cc2b5535ba0ad347d03ae4102e18f637f0))
|
||||
- [`cb6854e`](https://github.com/ethersphere/bee-dashboard/commit/cb6854eb68ffe3064a39a171bc1e23f628ee93bb) fix: swap error caused by invalid id and batchcount
|
||||
- [`bb93d5c`](https://github.com/ethersphere/bee-dashboard/commit/bb93d5c26fa5414c6423b87a3992e0f2e410e515) fix: enhance creation messages for admin drive and user drives [(#238)](https://github.com/ethersphere/bee-dashboard/issues/238)
|
||||
- [`c08bf8a`](https://github.com/ethersphere/bee-dashboard/commit/d65da143d2200db653fe7a80a7891dacf4c2937e) fix: identity and wallet creation [(#240)](https://github.com/ethersphere/bee-dashboard/pull/240)
|
||||
- [`d65da14`](https://github.com/ethersphere/bee-dashboard/commit/d65da143d2200db653fe7a80a7891dacf4c2937e) fix: ui display changes [(#239)](https://github.com/ethersphere/bee-dashboard/issues/239)
|
||||
- [`c890f7c`](https://github.com/ethersphere/bee-dashboard/commit/c890f7c1e8e4d21f8d252b3e1a9c783982459adf) fix: stamp buy and dilute [(#242)](https://github.com/ethersphere/bee-dashboard/issues/242)
|
||||
- [`b33b663`](https://github.com/ethersphere/bee-dashboard/commit/b33b6630c2b5830b0fdbfbcf14cadc3fa1225190) fix: standard mode postage stamp purchase [(#243)](https://github.com/ethersphere/bee-dashboard/issues/243)
|
||||
- [`f943f7a`](https://github.com/ethersphere/bee-dashboard/commit/f943f7ad666de15ef780cb5adf736b533902eef7) fix: add syncing message for bee node and update page state [(#244)](https://github.com/ethersphere/bee-dashboard/pull/244)
|
||||
- [`056188a`](https://github.com/ethersphere/bee-dashboard/commit/056188abedf3a8ac828b8eb10a71a3b823cd5e6e) fix: duplicated ttl (time to live) information [(#245)](https://github.com/ethersphere/bee-dashboard/issues/245)
|
||||
- [`8b36556`](https://github.com/ethersphere/bee-dashboard/commit/8b36556502d316ac5bd7dba49ce34b594857d449) fix: misleading "bee node is syncing" message for ultra-light nodes in file manager [(#246)](https://github.com/ethersphere/bee-dashboard/pull/246)
|
||||
- [`9732170`](https://github.com/ethersphere/bee-dashboard/commit/97321706c33fb02abe7e067e6d865a046051d68b) fix: validate stamp before every upgrade click [(#247)](https://github.com/ethersphere/bee-dashboard/issues/247)
|
||||
- [`f52ed4a`](https://github.com/ethersphere/bee-dashboard/commit/f52ed4abb2bb5274b33430c1e8efadae6b3fa795) fix: use tochecksum() and toplurbigint for ethers v6 compatibility [(#248)](https://github.com/ethersphere/bee-dashboard/pull/248)
|
||||
|
||||
|
||||
## [0.35.0](https://github.com/ethersphere/bee-dashboard/compare/v0.34.0...v0.35.0) (2026-04-02)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* add image opening functionality to DownloadActionBar ([3ff645c](https://github.com/ethersphere/bee-dashboard/commit/3ff645cab1b4e9fba0c42ed99e7c3fac7b0ed0ca))
|
||||
* the dashboard sidebar should be collapsible ([fa8a26e](https://github.com/ethersphere/bee-dashboard/commit/fa8a26e80d83d5c794a9d572cf716f0cb484e642))
|
||||
* sync and update with all changes from fork ([519c411](https://github.com/ethersphere/bee-dashboard/commit/519c411db0b37f3d4004366ca267013e2268f8eb))
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* swap error caused by invalid id and batchcount
|
||||
* enhance creation messages for admin drive and user drives
|
||||
* identity and wallet creation
|
||||
* asset preview types
|
||||
* fm search unicode text
|
||||
* feed identity and stamp usage
|
||||
* ui display changes
|
||||
* stamp buy and dilute
|
||||
* vite polyfill warning for stream
|
||||
* standard mode postage stamp purchase reserves incorrect size and duration
|
||||
* add syncing message for Bee node and update page state handling
|
||||
* stamp depth and amount validation
|
||||
* add --no-git-checks to pnpm publish command ([37ab8fe](https://github.com/ethersphere/bee-dashboard/commit/37ab8fedaa9fa2f941b84746ec83fe87cf61b014))
|
||||
* add workflow_dispatch trigger to npm publish workflow ([becb873](https://github.com/ethersphere/bee-dashboard/commit/becb87377e506aca0c429439d70e43151025d755))
|
||||
* remove cross-env from prepublishOnly script ([4848b5b](https://github.com/ethersphere/bee-dashboard/commit/4848b5be97a827abeb0ca8156ef53cab0d2f315e))
|
||||
|
||||
## [0.34.0](https://github.com/ethersphere/bee-dashboard/compare/v0.33.5...v0.34.0) (2026-03-20)
|
||||
|
||||
### Features
|
||||
|
||||
* add image opening functionality to DownloadActionBar ([3ff645c](https://github.com/ethersphere/bee-dashboard/commit/3ff645cab1b4e9fba0c42ed99e7c3fac7b0ed0ca))
|
||||
* the dashboard sidebar should be collapsible ([fa8a26e](https://github.com/ethersphere/bee-dashboard/commit/fa8a26e80d83d5c794a9d572cf716f0cb484e642))
|
||||
* sync and update with all changes from fork ([519c411](https://github.com/ethersphere/bee-dashboard/commit/519c411db0b37f3d4004366ca267013e2268f8eb))
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* add error handling and ui notifications for download failures ([b58f01c](https://github.com/ethersphere/bee-dashboard/commit/b58f01cc2b5535ba0ad347d03ae4102e18f637f0))
|
||||
* buy stamp values display ([3031d54](https://github.com/ethersphere/bee-dashboard/commit/3031d54272d51da020d3a3cd7154b969c60e8669))
|
||||
* buy stamp values display ([#226](https://github.com/ethersphere/bee-dashboard/issues/226)) ([3031d54](https://github.com/ethersphere/bee-dashboard/commit/3031d54272d51da020d3a3cd7154b969c60e8669))
|
||||
* cannot forget expired drives ([#214](https://github.com/ethersphere/bee-dashboard/issues/214)) ([7e05a56](https://github.com/ethersphere/bee-dashboard/commit/7e05a56073a2be306a1394bf5b2e798a1a457c74))
|
||||
* correct misleading update warning message for desktop version ([#218](https://github.com/ethersphere/bee-dashboard/issues/218)) ([bc2c0ad](https://github.com/ethersphere/bee-dashboard/commit/bc2c0addbb685454fbae61d317f2e920d507c07c))
|
||||
* cannot forget expired drives ([7e05a56](https://github.com/ethersphere/bee-dashboard/commit/7e05a56073a2be306a1394bf5b2e798a1a457c74))
|
||||
* Correct misleading update warning message for desktop version ([bc2c0ad](https://github.com/ethersphere/bee-dashboard/commit/bc2c0addbb685454fbae61d317f2e920d507c07c))
|
||||
* dockerfile build and use compose ([76bf221](https://github.com/ethersphere/bee-dashboard/commit/76bf2211ca75f44255e5696d58072e639a9cd2b0))
|
||||
* download and upload files ([#223](https://github.com/ethersphere/bee-dashboard/issues/223)) ([e8e01c0](https://github.com/ethersphere/bee-dashboard/commit/e8e01c054a867447e07a71960d45f9cb36926e61))
|
||||
* filemanager state handling ([#232](https://github.com/ethersphere/bee-dashboard/issues/232)) ([855a017](https://github.com/ethersphere/bee-dashboard/commit/855a0170334fb36d8ff119ce96f8c9bdb4294d58))
|
||||
* reflect file rename immediately ([#227](https://github.com/ethersphere/bee-dashboard/issues/227)) ([a56a5c3](https://github.com/ethersphere/bee-dashboard/commit/a56a5c3ed8554cf81afc7c6401ca2dc65a8e898d))
|
||||
* **rpc:** ensure 0x prefix for recipient in sendBzzTransaction and add tests ([#722](https://github.com/ethersphere/bee-dashboard/issues/722)) ([fff94d9](https://github.com/ethersphere/bee-dashboard/commit/fff94d907157d0cd4f6e490c450cdc58cefeec31))
|
||||
* **sidebar:** use swarm-desktop GitHub link when running in desktop mode ([#724](https://github.com/ethersphere/bee-dashboard/issues/724)) ([7382da8](https://github.com/ethersphere/bee-dashboard/commit/7382da8595e86230c03dab93aec726cd02cc91ec))
|
||||
* spdv-1007 cost values correcting ([#234](https://github.com/ethersphere/bee-dashboard/issues/234)) ([a7e4205](https://github.com/ethersphere/bee-dashboard/commit/a7e42053ae99990c5e9e782e8fe14326f155730c))
|
||||
* spdv-914 - Modals are partially cut off in File Manager on Windows (Chrome) ([#219](https://github.com/ethersphere/bee-dashboard/issues/219)) ([220618f](https://github.com/ethersphere/bee-dashboard/commit/220618f19bc95b92a0521dc62eb8f5414dfdcbba))
|
||||
* spdv-934 ([#231](https://github.com/ethersphere/bee-dashboard/issues/231)) ([55e7879](https://github.com/ethersphere/bee-dashboard/commit/55e78798492e715ef9aa92262f5aa874aec240b0))
|
||||
* spdv-963 - Expired admin drive upgrading handling ([#230](https://github.com/ethersphere/bee-dashboard/issues/230)) ([e1fdd52](https://github.com/ethersphere/bee-dashboard/commit/e1fdd52676653c65beba06283f07e470d7ee4668))
|
||||
* spdv-971 ([#211](https://github.com/ethersphere/bee-dashboard/issues/211)) ([e00918b](https://github.com/ethersphere/bee-dashboard/commit/e00918b192f9a916d72df7ed6790eddf908397d3))
|
||||
* spdv-973 ([3c4d618](https://github.com/ethersphere/bee-dashboard/commit/3c4d618cc85b2836a2f794b7da79f4da12205869))
|
||||
* spdv-986 [commit: 519c411d] - Admin drive stucks in "in progress" state and the already existing admin drives are not listed on the initial modal ([#215](https://github.com/ethersphere/bee-dashboard/issues/215)) ([ad8c8f1](https://github.com/ethersphere/bee-dashboard/commit/ad8c8f18eb5dabbf64e8059f0fcfe98a68b97eea))
|
||||
* update documentation message for file access clarification ([#221](https://github.com/ethersphere/bee-dashboard/issues/221)) ([ae63615](https://github.com/ethersphere/bee-dashboard/commit/ae63615c7ca26896c1114c16dc6a921aa267bc0d))
|
||||
* download and upload files ([e8e01c0](https://github.com/ethersphere/bee-dashboard/commit/e8e01c054a867447e07a71960d45f9cb36926e61))
|
||||
* filemanager state handling ([855a017](https://github.com/ethersphere/bee-dashboard/commit/855a0170334fb36d8ff119ce96f8c9bdb4294d58))
|
||||
* reflect file rename immediately ([a56a5c3](https://github.com/ethersphere/bee-dashboard/commit/a56a5c3ed8554cf81afc7c6401ca2dc65a8e898d))
|
||||
* rpc: ensure 0x prefix for recipient in sendBzzTransaction and add tests ([fff94d9](https://github.com/ethersphere/bee-dashboard/commit/fff94d907157d0cd4f6e490c450cdc58cefeec31))
|
||||
* sidebar: use swarm-desktop GitHub link when running in desktop mode ([7382da8](https://github.com/ethersphere/bee-dashboard/commit/7382da8595e86230c03dab93aec726cd02cc91ec))
|
||||
* cost values correcting [a7e4205](https://github.com/ethersphere/bee-dashboard/commit/a7e42053ae99990c5e9e782e8fe14326f155730c))
|
||||
* modals are partially cut off in File Manager on Windows (Chrome) ([220618f](https://github.com/ethersphere/bee-dashboard/commit/220618f19bc95b92a0521dc62eb8f5414dfdcbba))
|
||||
* misleading update warning (Desktop vs Dashboard) ([55e7879](https://github.com/ethersphere/bee-dashboard/commit/55e78798492e715ef9aa92262f5aa874aec240b0))
|
||||
* expired admin drive upgrading handling ([e1fdd52](https://github.com/ethersphere/bee-dashboard/commit/e1fdd52676653c65beba06283f07e470d7ee4668))
|
||||
* in case of a synced bee node the Purchase stamp and create drive button is inactive ([e00918b](https://github.com/ethersphere/bee-dashboard/commit/e00918b192f9a916d72df7ed6790eddf908397d3))
|
||||
* newly created drive sometimes appears under “Expired Drives” in Chrome until page refresh and sometimes you have to delete cache in order to appear. ([3c4d618](https://github.com/ethersphere/bee-dashboard/commit/3c4d618cc85b2836a2f794b7da79f4da12205869))
|
||||
* admin drive stucks in "in progress" state and the already existing admin drives are not listed on the initial modal ([ad8c8f1](https://github.com/ethersphere/bee-dashboard/commit/ad8c8f18eb5dabbf64e8059f0fcfe98a68b97eea))
|
||||
* update documentation message for file access clarification ([ae63615](https://github.com/ethersphere/bee-dashboard/commit/ae63615c7ca26896c1114c16dc6a921aa267bc0d))
|
||||
* upload history text align ([3031d54](https://github.com/ethersphere/bee-dashboard/commit/3031d54272d51da020d3a3cd7154b969c60e8669))
|
||||
* upload q and drive size error ([#220](https://github.com/ethersphere/bee-dashboard/issues/220)) ([8992c18](https://github.com/ethersphere/bee-dashboard/commit/8992c189fd0300b0ee28d44a109c47b633174c06))
|
||||
* use upload and download abort signals ([#212](https://github.com/ethersphere/bee-dashboard/issues/212)) ([308ec3d](https://github.com/ethersphere/bee-dashboard/commit/308ec3dcc0ff3806777b89dc99fef669c993bcf7))
|
||||
* use uploadFile for single files to support long filenames and reafactor for linter ([#228](https://github.com/ethersphere/bee-dashboard/issues/228)) ([db52e44](https://github.com/ethersphere/bee-dashboard/commit/db52e4471a9519a0aca8a6fd2702a242e03d2a06))
|
||||
* upload and drive size error ([8992c18](https://github.com/ethersphere/bee-dashboard/commit/8992c189fd0300b0ee28d44a109c47b633174c06))
|
||||
* use upload and download abort signals ([308ec3d](https://github.com/ethersphere/bee-dashboard/commit/308ec3dcc0ff3806777b89dc99fef669c993bcf7))
|
||||
* use uploadFile for single files to support long filenames and reafactor for linter ([db52e44](https://github.com/ethersphere/bee-dashboard/commit/db52e4471a9519a0aca8a6fd2702a242e03d2a06))
|
||||
* withdraw and deposit buttons style ([3031d54](https://github.com/ethersphere/bee-dashboard/commit/3031d54272d51da020d3a3cd7154b969c60e8669))
|
||||
|
||||
|
||||
## [0.33.5](https://github.com/ethersphere/bee-dashboard/compare/v0.33.4...v0.33.5) (2026-02-17)
|
||||
|
||||
|
||||
|
||||
+2
-2
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@ethersphere/bee-dashboard",
|
||||
"version": "0.34.0",
|
||||
"version": "0.35.1",
|
||||
"description": "An app which helps users to setup their Bee node and do actions like cash out cheques",
|
||||
"homepage": ".",
|
||||
"bin": {
|
||||
@@ -27,7 +27,7 @@
|
||||
"url": "https://github.com/ethersphere/bee-dashboard.git"
|
||||
},
|
||||
"scripts": {
|
||||
"prepublishOnly": "cross-env NODE_ENV=production pnpm run prepare",
|
||||
"prepublishOnly": "NODE_ENV=production pnpm run prepare",
|
||||
"prepare": "pnpm run build && pnpm run build:component",
|
||||
"start": "vite",
|
||||
"desktop": "node ./desktop.mjs",
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
allowBuilds:
|
||||
'@parcel/watcher': false
|
||||
esbuild: false
|
||||
puppeteer: false
|
||||
unrs-resolver: false
|
||||
@@ -40,7 +40,7 @@ export default function ExpandableListItem({ label, value, tooltip }: Props): Re
|
||||
)}
|
||||
{value && (
|
||||
<Box flex={1} textAlign="right">
|
||||
<Typography variant="body2">
|
||||
<Typography variant="body2" component="div">
|
||||
{value}
|
||||
{tooltip && (
|
||||
<Tooltip title={tooltip} placement="top" arrow>
|
||||
|
||||
@@ -16,11 +16,17 @@ const useStyles = makeStyles()(theme => ({
|
||||
header: {
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
marginBottom: theme.spacing(0.25),
|
||||
borderLeft: `${theme.spacing(0.25)}px solid rgba(0,0,0,0)`,
|
||||
borderLeft: `${theme.spacing(0.25)} solid rgba(0,0,0,0)`,
|
||||
wordBreak: 'break-word',
|
||||
'&:hover': {
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
},
|
||||
'&:focus-within': {
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
},
|
||||
},
|
||||
headerOpen: {
|
||||
borderLeft: `${theme.spacing(0.25)}px solid ${theme.palette.primary.main}`,
|
||||
borderLeft: `${theme.spacing(0.25)} solid ${theme.palette.primary.main}`,
|
||||
},
|
||||
copyValue: {
|
||||
cursor: 'pointer',
|
||||
@@ -95,35 +101,35 @@ export default function ExpandableListItemInput({
|
||||
}
|
||||
|
||||
return (
|
||||
<ListItemButton className={`${classes.header} ${open ? classes.headerOpen : ''}`}>
|
||||
<Box display="flex" flexDirection="column" width="100%">
|
||||
<Box display="flex" flexDirection="row" alignItems="center" width="100%">
|
||||
{label && (
|
||||
<Box flex={1} minWidth={0}>
|
||||
<Typography variant="body1" className={classes.unselectableLabel} component="span">
|
||||
{label}
|
||||
</Typography>
|
||||
<>
|
||||
<ListItemButton className={`${classes.header} ${open ? classes.headerOpen : ''}`}>
|
||||
<Box display="flex" flexDirection="column" width="100%">
|
||||
<Box display="flex" flexDirection="row" alignItems="center" width="100%">
|
||||
{label && (
|
||||
<Box flex={1} minWidth={0}>
|
||||
<Typography variant="body1" className={classes.unselectableLabel} component="span">
|
||||
{label}
|
||||
</Typography>
|
||||
</Box>
|
||||
)}
|
||||
<Box flex={3} display="flex" alignItems="center" justifyContent="flex-end" minWidth={0} gap={1}>
|
||||
{!open && value && (
|
||||
<Typography
|
||||
variant="body2"
|
||||
component="span"
|
||||
sx={{ minWidth: 0, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}
|
||||
>
|
||||
{value}
|
||||
</Typography>
|
||||
)}
|
||||
{!expandedOnly && !locked && (
|
||||
<IconButton size="small" className={classes.copyValue} onClick={toggleOpen}>
|
||||
{open ? <Minus strokeWidth={1} /> : <Edit strokeWidth={1} />}
|
||||
</IconButton>
|
||||
)}
|
||||
</Box>
|
||||
)}
|
||||
<Box flex={3} display="flex" alignItems="center" justifyContent="flex-end" minWidth={0} gap={1}>
|
||||
{!open && value && (
|
||||
<Typography
|
||||
variant="body2"
|
||||
component="span"
|
||||
sx={{ minWidth: 0, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}
|
||||
>
|
||||
{value}
|
||||
</Typography>
|
||||
)}
|
||||
{!expandedOnly && !locked && (
|
||||
<IconButton size="small" className={classes.copyValue} onClick={toggleOpen}>
|
||||
{open ? <Minus strokeWidth={1} /> : <Edit strokeWidth={1} />}
|
||||
</IconButton>
|
||||
)}
|
||||
</Box>
|
||||
</Box>
|
||||
<Collapse in={open} timeout="auto" unmountOnExit>
|
||||
<Box display="flex" flexDirection="column" width="100%">
|
||||
<Collapse in={open} timeout="auto" unmountOnExit>
|
||||
<Box display="flex" alignItems="center" width="100%" minWidth={0}>
|
||||
<InputBase
|
||||
value={inputValue}
|
||||
@@ -146,36 +152,38 @@ export default function ExpandableListItemInput({
|
||||
/>
|
||||
</Box>
|
||||
{helperText && <ExpandableListItemNote>{helperText}</ExpandableListItemNote>}
|
||||
<Box mt={2}>
|
||||
<ExpandableListItemActions>
|
||||
<SwarmButton
|
||||
disabled={
|
||||
loading ||
|
||||
inputValue === value ||
|
||||
Boolean(confirmLabelDisabled) ||
|
||||
(inputValue === '' && value === undefined)
|
||||
}
|
||||
loading={loading}
|
||||
iconType={confirmIcon ?? Check}
|
||||
onClick={() => {
|
||||
onConfirm?.(inputValue.trim())
|
||||
}}
|
||||
>
|
||||
{confirmLabel || 'Save'}
|
||||
</SwarmButton>
|
||||
<SwarmButton
|
||||
disabled={loading || inputValue === value || inputValue === ''}
|
||||
iconType={X}
|
||||
onClick={() => setInputValue(value || '')}
|
||||
cancel
|
||||
>
|
||||
Cancel
|
||||
</SwarmButton>
|
||||
</ExpandableListItemActions>
|
||||
</Box>
|
||||
</Box>
|
||||
</Collapse>
|
||||
</Box>
|
||||
</ListItemButton>
|
||||
</Collapse>
|
||||
</Box>
|
||||
</ListItemButton>
|
||||
<Collapse in={open} timeout="auto" unmountOnExit>
|
||||
<Box mt={2}>
|
||||
<ExpandableListItemActions>
|
||||
<SwarmButton
|
||||
disabled={
|
||||
loading ||
|
||||
inputValue === value ||
|
||||
Boolean(confirmLabelDisabled) ||
|
||||
(inputValue === '' && value === undefined)
|
||||
}
|
||||
loading={loading}
|
||||
iconType={confirmIcon ?? Check}
|
||||
onClick={() => {
|
||||
onConfirm?.(inputValue.trim())
|
||||
}}
|
||||
>
|
||||
{confirmLabel || 'Save'}
|
||||
</SwarmButton>
|
||||
<SwarmButton
|
||||
disabled={loading || inputValue === value || inputValue === ''}
|
||||
iconType={X}
|
||||
onClick={() => setInputValue(value || '')}
|
||||
cancel
|
||||
>
|
||||
Cancel
|
||||
</SwarmButton>
|
||||
</ExpandableListItemActions>
|
||||
</Box>
|
||||
</Collapse>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -10,11 +10,17 @@ const useStyles = makeStyles()(theme => ({
|
||||
header: {
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
marginBottom: theme.spacing(0.25),
|
||||
borderLeft: `${theme.spacing(0.25)}px solid rgba(0,0,0,0)`,
|
||||
borderLeft: `${theme.spacing(0.25)} solid rgba(0,0,0,0)`,
|
||||
wordBreak: 'break-word',
|
||||
'&:hover': {
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
},
|
||||
'&:focus-within': {
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
},
|
||||
},
|
||||
headerOpen: {
|
||||
borderLeft: `${theme.spacing(0.25)}px solid ${theme.palette.primary.main}`,
|
||||
borderLeft: `${theme.spacing(0.25)} solid ${theme.palette.primary.main}`,
|
||||
},
|
||||
copyValue: {
|
||||
cursor: 'pointer',
|
||||
@@ -69,7 +75,7 @@ export default function ExpandableListItemKey({ label, value, expanded }: Props)
|
||||
|
||||
return (
|
||||
<ListItemButton className={`${classes.header} ${open ? classes.headerOpen : ''}`}>
|
||||
<Grid container direction="column" justifyContent="space-between" alignItems="stretch">
|
||||
<Grid container direction="column" justifyContent="space-between" alignItems="stretch" style={{ width: '100%' }}>
|
||||
<Grid container direction="row" justifyContent="space-between" alignItems="center">
|
||||
{label && (
|
||||
<Typography variant="body1" component="span">
|
||||
|
||||
@@ -10,11 +10,17 @@ const useStyles = makeStyles()(theme => ({
|
||||
header: {
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
marginBottom: theme.spacing(0.25),
|
||||
borderLeft: `${theme.spacing(0.25)}px solid rgba(0,0,0,0)`,
|
||||
borderLeft: `${theme.spacing(0.25)} solid rgba(0,0,0,0)`,
|
||||
wordBreak: 'break-word',
|
||||
'&:hover': {
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
},
|
||||
'&:focus-within': {
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
},
|
||||
},
|
||||
headerOpen: {
|
||||
borderLeft: `${theme.spacing(0.25)}px solid ${theme.palette.primary.main}`,
|
||||
borderLeft: `${theme.spacing(0.25)} solid ${theme.palette.primary.main}`,
|
||||
},
|
||||
openLinkIcon: {
|
||||
cursor: 'pointer',
|
||||
|
||||
@@ -0,0 +1,73 @@
|
||||
import { BZZ, DAI, RedistributionState } from '@ethersphere/bee-js'
|
||||
import { useContext, useEffect, useState } from 'react'
|
||||
|
||||
import { Context } from '../providers/Settings'
|
||||
|
||||
import ExpandableListItem from './ExpandableListItem'
|
||||
|
||||
export function Redistribution() {
|
||||
const { beeApi } = useContext(Context)
|
||||
const [redistributionState, setRedistributionState] = useState<RedistributionState | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
const interval = setInterval(() => {
|
||||
if (!beeApi) {
|
||||
return
|
||||
}
|
||||
|
||||
beeApi.getRedistributionState().then(setRedistributionState).catch(console.error) // eslint-disable-line
|
||||
}, 3_000)
|
||||
|
||||
return () => clearInterval(interval)
|
||||
})
|
||||
|
||||
const formatDurationSeconds = (s?: number) => {
|
||||
if (s === null || s === undefined) {
|
||||
return '-'
|
||||
} else {
|
||||
return `${s} s`
|
||||
}
|
||||
}
|
||||
|
||||
const formatBzzAmount = (amount?: BZZ) => {
|
||||
if (amount === null || amount === undefined) {
|
||||
return '-'
|
||||
} else {
|
||||
return `${amount.toSignificantDigits(4)} xBZZ`
|
||||
}
|
||||
}
|
||||
|
||||
const formatDaiAmount = (amount?: DAI) => {
|
||||
if (amount === null || amount === undefined) {
|
||||
return '-'
|
||||
} else {
|
||||
return `${amount.toSignificantDigits(4)} xDAI`
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<ExpandableListItem
|
||||
label="Has sufficient funds"
|
||||
value={redistributionState?.hasSufficientFunds?.toString() ?? '-'}
|
||||
/>
|
||||
<ExpandableListItem label="Fully synced" value={redistributionState?.isFullySynced?.toString() ?? '-'} />
|
||||
<ExpandableListItem label="Frozen" value={redistributionState?.isFrozen?.toString() ?? '-'} />
|
||||
<ExpandableListItem label="Phase" value={redistributionState?.phase ?? '-'} />
|
||||
<ExpandableListItem label="Round" value={redistributionState?.round?.toString() ?? '-'} />
|
||||
<ExpandableListItem
|
||||
label="Last selected round"
|
||||
value={redistributionState?.lastSelectedRound.toString() ?? '-'}
|
||||
/>
|
||||
<ExpandableListItem label="Last played round" value={redistributionState?.lastPlayedRound.toString() ?? '-'} />
|
||||
<ExpandableListItem label="Last round won" value={redistributionState?.lastWonRound.toString() ?? '-'} />
|
||||
<ExpandableListItem label="Last frozen round" value={redistributionState?.lastFrozenRound.toString() ?? '-'} />
|
||||
<ExpandableListItem
|
||||
label="Last sample duration"
|
||||
value={formatDurationSeconds(redistributionState?.lastSampleDurationSeconds)}
|
||||
/>
|
||||
<ExpandableListItem label="Reward" value={formatBzzAmount(redistributionState?.reward)} />
|
||||
<ExpandableListItem label="Fees" value={formatDaiAmount(redistributionState?.fees)} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -4,6 +4,7 @@ import { ReactElement, useContext, useState } from 'react'
|
||||
import { Link } from 'react-router-dom'
|
||||
import FilesIcon from 'remixicon-react/ArrowUpDownLineIcon'
|
||||
import DocsIcon from 'remixicon-react/BookOpenLineIcon'
|
||||
import ExchangeDollarLineIcon from 'remixicon-react/ExchangeDollarLineIcon'
|
||||
import ExternalLinkIcon from 'remixicon-react/ExternalLinkLineIcon'
|
||||
import FileManagerIcon from 'remixicon-react/FolderOpenLineIcon'
|
||||
import GithubIcon from 'remixicon-react/GithubFillIcon'
|
||||
@@ -139,7 +140,7 @@ export default function SideBar(): ReactElement {
|
||||
label: 'File Manager',
|
||||
path: ROUTES.FILEMANAGER,
|
||||
icon: FileManagerIcon,
|
||||
pathMatcherSubstring: '/filemanager/',
|
||||
pathMatcherSubstring: '/filemanager',
|
||||
},
|
||||
{
|
||||
label: 'Account',
|
||||
@@ -147,6 +148,11 @@ export default function SideBar(): ReactElement {
|
||||
icon: AccountIcon,
|
||||
pathMatcherSubstring: '/account/',
|
||||
},
|
||||
{
|
||||
label: 'Redistribution',
|
||||
path: ROUTES.REDISTRIBUTION,
|
||||
icon: ExchangeDollarLineIcon,
|
||||
},
|
||||
{
|
||||
label: 'Settings',
|
||||
path: ROUTES.SETTINGS,
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { BatchId, Bee } from '@ethersphere/bee-js'
|
||||
import { Bee, PostageBatch } from '@ethersphere/bee-js'
|
||||
import { Box } from '@mui/material'
|
||||
import Button from '@mui/material/Button'
|
||||
import Dialog from '@mui/material/Dialog'
|
||||
@@ -8,19 +8,48 @@ import DialogTitle from '@mui/material/DialogTitle'
|
||||
import Input from '@mui/material/Input'
|
||||
import { useSnackbar } from 'notistack'
|
||||
import React, { ReactElement, ReactNode, useState } from 'react'
|
||||
import { makeStyles } from 'tss-react/mui'
|
||||
|
||||
interface Props {
|
||||
type: 'Topup' | 'Dilute'
|
||||
icon: ReactNode
|
||||
bee: Bee
|
||||
stamp: BatchId
|
||||
import { CheckState } from '../providers/Bee'
|
||||
|
||||
const useStyles = makeStyles()(theme => ({
|
||||
buttonSelected: {
|
||||
color: 'white',
|
||||
backgroundColor: theme.palette.primary.main,
|
||||
'&:hover': {
|
||||
color: theme.palette.secondary.main,
|
||||
backgroundColor: 'white',
|
||||
'@media (hover: none)': {
|
||||
color: 'white',
|
||||
backgroundColor: theme.palette.primary.main,
|
||||
},
|
||||
},
|
||||
},
|
||||
buttonUnselected: {
|
||||
color: '#dd7700',
|
||||
backgroundColor: 'white',
|
||||
},
|
||||
}))
|
||||
|
||||
export enum StampExtensionType {
|
||||
Topup = 'Topup',
|
||||
Dilute = 'Dilute',
|
||||
}
|
||||
|
||||
export default function StampExtensionModal({ type, icon, bee, stamp }: Props): ReactElement {
|
||||
const [open, setOpen] = useState(false)
|
||||
const [amount, setAmount] = useState('')
|
||||
interface Props {
|
||||
type: StampExtensionType
|
||||
icon: ReactNode
|
||||
bee: Bee
|
||||
stamp: PostageBatch
|
||||
status: CheckState
|
||||
}
|
||||
|
||||
export default function StampExtensionModal({ type, icon, bee, stamp, status }: Props): ReactElement {
|
||||
const { classes } = useStyles()
|
||||
const [open, setOpen] = useState<boolean>(false)
|
||||
const [amount, setAmount] = useState<string>('')
|
||||
const { enqueueSnackbar } = useSnackbar()
|
||||
const label = `${type} ${stamp.toHex().substring(0, 8)}`
|
||||
const label = `${type} ${stamp.batchID.toHex().substring(0, 8)}`
|
||||
|
||||
const handleClickOpen = (e: React.MouseEvent<HTMLButtonElement>) => {
|
||||
setOpen(true)
|
||||
@@ -32,23 +61,65 @@ export default function StampExtensionModal({ type, icon, bee, stamp }: Props):
|
||||
}
|
||||
|
||||
const handleAction = async () => {
|
||||
if (type === 'Topup') {
|
||||
if (status !== CheckState.OK) {
|
||||
enqueueSnackbar(`Node connection status is not ${CheckState.OK}: ${status}`, { variant: 'error' })
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
if (type === StampExtensionType.Topup) {
|
||||
const isAmountInvalid = BigInt(amount) <= BigInt(0)
|
||||
|
||||
if (isAmountInvalid) {
|
||||
enqueueSnackbar(`Invalid amount: ${amount}, it must be greate than 0`, { variant: 'error' })
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
await bee.topUpBatch(stamp, amount)
|
||||
await bee.topUpBatch(stamp.batchID, amount)
|
||||
enqueueSnackbar(`Successfully topped up stamp, your changes will appear soon`, { variant: 'success' })
|
||||
} catch (error) {
|
||||
enqueueSnackbar(`Failed to topup stamp: ${error || 'Unknown reason'}`, { variant: 'error' })
|
||||
}
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
if (type === 'Dilute') {
|
||||
if (type === StampExtensionType.Dilute) {
|
||||
const newDepth = parseInt(amount, 10)
|
||||
const ttlDays = stamp.duration.toDays()
|
||||
const currentDepth = stamp.depth
|
||||
const maxHalvings = Math.floor(Math.log2(ttlDays)) + currentDepth
|
||||
const isDepthInvalid = newDepth > maxHalvings || newDepth <= currentDepth
|
||||
|
||||
if (isDepthInvalid) {
|
||||
enqueueSnackbar(`Invalid depth: ${newDepth} (${currentDepth} < new depth < ${maxHalvings})`, {
|
||||
variant: 'error',
|
||||
})
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
if (ttlDays <= 2) {
|
||||
enqueueSnackbar(`TTL: ${ttlDays} <= 2 days, cannot dilute stamp (min. TTL is 1 day)`, {
|
||||
variant: 'warning',
|
||||
})
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
await bee.diluteBatch(stamp, parseInt(amount, 10))
|
||||
await bee.diluteBatch(stamp.batchID, newDepth)
|
||||
enqueueSnackbar(`Successfully diluted stamp, your changes will appear soon`, { variant: 'success' })
|
||||
} catch (error) {
|
||||
enqueueSnackbar(`Failed to dilute stamp: ${error || 'Unknown reason'}`, { variant: 'error' })
|
||||
}
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
enqueueSnackbar(`Failed to extend stamp, unknown operation: ${type}`, { variant: 'error' })
|
||||
}
|
||||
|
||||
const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) => {
|
||||
@@ -57,7 +128,7 @@ export default function StampExtensionModal({ type, icon, bee, stamp }: Props):
|
||||
|
||||
return (
|
||||
<Box mb={2}>
|
||||
<Button variant="contained" onClick={handleClickOpen} startIcon={icon}>
|
||||
<Button className={classes.buttonSelected} variant="contained" onClick={handleClickOpen} startIcon={icon}>
|
||||
{type}
|
||||
</Button>
|
||||
<Dialog open={open} onClose={handleClose} aria-labelledby="form-dialog-title">
|
||||
@@ -68,7 +139,7 @@ export default function StampExtensionModal({ type, icon, bee, stamp }: Props):
|
||||
margin="dense"
|
||||
id="name"
|
||||
type="text"
|
||||
placeholder={type === 'Topup' ? 'Amount to add' : 'New depth to dilute'}
|
||||
placeholder={type === StampExtensionType.Topup ? 'Amount to add' : 'New depth to dilute'}
|
||||
fullWidth
|
||||
value={amount}
|
||||
onChange={handleChange}
|
||||
@@ -78,7 +149,14 @@ export default function StampExtensionModal({ type, icon, bee, stamp }: Props):
|
||||
<Button onClick={handleClose} color="primary">
|
||||
Cancel
|
||||
</Button>
|
||||
<Button disabled={amount === ''} onClick={handleAction} color="primary">
|
||||
<Button
|
||||
disabled={amount === ''}
|
||||
onClick={async () => {
|
||||
await handleAction()
|
||||
handleClose()
|
||||
}}
|
||||
color="primary"
|
||||
>
|
||||
{type}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
|
||||
@@ -75,6 +75,7 @@ export function SwarmSelect({
|
||||
value={value}
|
||||
className={classes.select}
|
||||
displayEmpty
|
||||
onChange={onChange}
|
||||
renderValue={(value: unknown) => (value ? renderValue(value) : placeholder)}
|
||||
MenuProps={{ MenuListProps: { disablePadding: true }, PaperProps: { square: true } }}
|
||||
>
|
||||
|
||||
@@ -57,7 +57,7 @@ export function SwarmTextInput({
|
||||
variant="filled"
|
||||
className={classes.field}
|
||||
defaultValue={defaultValue || ''}
|
||||
InputProps={{ disableUnderline: true }}
|
||||
slotProps={{ input: { disableUnderline: true } }}
|
||||
placeholder={placeholder}
|
||||
/>
|
||||
)
|
||||
@@ -73,7 +73,7 @@ export function SwarmTextInput({
|
||||
className={classes.field}
|
||||
defaultValue={defaultValue || ''}
|
||||
onChange={onChange}
|
||||
InputProps={{ disableUnderline: true }}
|
||||
slotProps={{ input: { disableUnderline: true } }}
|
||||
placeholder={placeholder}
|
||||
/>
|
||||
)
|
||||
|
||||
@@ -24,14 +24,14 @@ const useStyles = makeStyles()(theme => ({
|
||||
},
|
||||
},
|
||||
buttonSelected: {
|
||||
color: 'white',
|
||||
backgroundColor: theme.palette.primary.main,
|
||||
color: theme.palette.secondary.main,
|
||||
backgroundColor: 'white',
|
||||
'&:hover': {
|
||||
color: theme.palette.secondary.main,
|
||||
backgroundColor: 'white',
|
||||
color: 'white',
|
||||
backgroundColor: theme.palette.primary.main,
|
||||
'@media (hover: none)': {
|
||||
color: 'white',
|
||||
backgroundColor: theme.palette.primary.main,
|
||||
color: theme.palette.secondary.main,
|
||||
backgroundColor: 'white',
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
@@ -12,3 +12,5 @@ export const BEE_DESKTOP_LATEST_RELEASE_PAGE_API =
|
||||
'https://api.github.com/repos/ethersphere/bee-desktop/releases/latest'
|
||||
export const DEFAULT_BEE_API_HOST = 'http://localhost:1633'
|
||||
export const DEFAULT_RPC_URL = 'https://xdai.fairdatasociety.org'
|
||||
export const MIN_STAMP_DEPTH = 17
|
||||
export const MAX_STAMP_DEPTH = 255
|
||||
|
||||
@@ -179,7 +179,13 @@ export function AdminStatusBar({
|
||||
const isBusy = loading || isUpgrading || isCreationInProgress
|
||||
const blurCls = isBusy ? ' is-loading' : ''
|
||||
const statusVerb = isCreationInProgress ? 'Creating' : 'Loading'
|
||||
const statusText = statusVerb + ' admin drive, please do not reload'
|
||||
const statusText = (
|
||||
<>
|
||||
{statusVerb} admin drive — please do not reload the page.
|
||||
<br />
|
||||
This may take a few minutes.
|
||||
</>
|
||||
)
|
||||
|
||||
const renderModalsAndOverlays = () => {
|
||||
return (
|
||||
|
||||
@@ -15,7 +15,7 @@ interface ConfirmModalProps {
|
||||
onCancel?: () => void
|
||||
showFooter?: boolean
|
||||
isProgress?: boolean
|
||||
spinnerMessage?: string
|
||||
spinnerMessage?: React.ReactNode
|
||||
showMinimize?: boolean
|
||||
onMinimize?: () => void
|
||||
background?: boolean
|
||||
|
||||
+18
-2
@@ -1,9 +1,10 @@
|
||||
import { PostageBatch } from '@ethersphere/bee-js'
|
||||
import { Bee, PostageBatch } from '@ethersphere/bee-js'
|
||||
import { DriveInfo, FileInfo } from '@solarpunkltd/file-manager-lib'
|
||||
import { ReactElement, useEffect, useMemo, useState } from 'react'
|
||||
import { createPortal } from 'react-dom'
|
||||
import AlertIcon from 'remixicon-react/AlertLineIcon'
|
||||
|
||||
import { validateStampStillExists } from '../../utils/bee'
|
||||
import { getDaysLeft } from '../../utils/common'
|
||||
import { Button } from '../Button/Button'
|
||||
import { UpgradeDriveModal } from '../UpgradeDriveModal/UpgradeDriveModal'
|
||||
@@ -16,19 +17,23 @@ import '../../styles/global.scss'
|
||||
const EXPIRING_ITEMS_PAGE_SIZE = 3
|
||||
|
||||
interface ExpiringNotificationModalProps {
|
||||
bee: Bee
|
||||
stamps: PostageBatch[]
|
||||
drives: DriveInfo[]
|
||||
files: FileInfo[]
|
||||
onCancelClick: () => void
|
||||
setErrorMessage?: (error: string) => void
|
||||
setShowError: (show: boolean) => void
|
||||
}
|
||||
|
||||
export function ExpiringNotificationModal({
|
||||
bee,
|
||||
stamps,
|
||||
drives,
|
||||
files,
|
||||
onCancelClick,
|
||||
setErrorMessage,
|
||||
setShowError,
|
||||
}: ExpiringNotificationModalProps): ReactElement {
|
||||
const [showUpgradeDriveModal, setShowUpgradeDriveModal] = useState(false)
|
||||
const [actualStamp, setActualStamp] = useState<PostageBatch | undefined>(undefined)
|
||||
@@ -75,7 +80,18 @@ export function ExpiringNotificationModal({
|
||||
files={files}
|
||||
currentPage={currentPage}
|
||||
index={index}
|
||||
onUpgradeClick={(stamp, drive) => {
|
||||
onUpgradeClick={async (stamp, drive) => {
|
||||
const isStampValid = await validateStampStillExists(bee, stamp.batchID)
|
||||
|
||||
if (!isStampValid) {
|
||||
setErrorMessage?.(
|
||||
`Drive ${drive.name} has expired. Please clear the browser cache and reload the page.`,
|
||||
)
|
||||
setShowError(true)
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
setActualStamp(stamp)
|
||||
setActualDrive(drive)
|
||||
setShowUpgradeDriveModal(true)
|
||||
|
||||
@@ -10,6 +10,7 @@ import React, {
|
||||
useRef,
|
||||
useState,
|
||||
} from 'react'
|
||||
import { createPortal } from 'react-dom'
|
||||
|
||||
import { useSearch } from '../../../../pages/filemanager/SearchContext'
|
||||
import { useView } from '../../../../pages/filemanager/ViewContext'
|
||||
@@ -87,7 +88,9 @@ function ErrorModalBlock({
|
||||
return null
|
||||
}
|
||||
|
||||
return <ErrorModal label={label} onClick={onOk} />
|
||||
const modalRoot = document.querySelector('.fm-main') || document.body
|
||||
|
||||
return createPortal(<ErrorModal label={label} onClick={onOk} />, modalRoot)
|
||||
}
|
||||
|
||||
const extractFilesFromClipboardEvent = (e: React.ClipboardEvent): File[] => {
|
||||
@@ -431,8 +434,10 @@ export function FileBrowser({ errorMessage, setErrorMessage }: FileBrowserProps)
|
||||
if (rafIdRef.current) {
|
||||
cancelAnimationFrame(rafIdRef.current)
|
||||
}
|
||||
|
||||
setShowError(false)
|
||||
}
|
||||
}, [])
|
||||
}, [setShowError])
|
||||
|
||||
useEffect(() => {
|
||||
let title = currentDrive?.name || ''
|
||||
|
||||
+1
-2
@@ -3,8 +3,7 @@ import DownIcon from 'remixicon-react/ArrowDownSLineIcon'
|
||||
|
||||
import { BulkActionsResult } from '../../../hooks/useBulkActions'
|
||||
import { SortDir, SortKey } from '../../../hooks/useSorting'
|
||||
|
||||
import { capitalizeFirstLetter } from '@/modules/filemanager/utils/common'
|
||||
import { capitalizeFirstLetter } from '../../../utils/common'
|
||||
|
||||
interface FileBrowserHeaderProps {
|
||||
isSearchMode: boolean
|
||||
|
||||
@@ -30,7 +30,7 @@ export function NotificationBar({ setErrorMessage }: NotificationBarProps): Reac
|
||||
const [stampsToExpire, setStampsToExpire] = useState<PostageBatch[]>([])
|
||||
const [drivesToExpire, setDrivesToExpire] = useState<DriveInfo[]>([])
|
||||
const { beeApi } = useContext(SettingsContext)
|
||||
const { drives, files, adminDrive } = useContext(FMContext)
|
||||
const { drives, files, adminDrive, setShowError } = useContext(FMContext)
|
||||
|
||||
const showExpiration = stampsToExpire.length > 0
|
||||
|
||||
@@ -109,8 +109,9 @@ export function NotificationBar({ setErrorMessage }: NotificationBarProps): Reac
|
||||
<div className="fm-notification-bar fm-red-font" onClick={() => setShowExpiringModal(true)}>
|
||||
{stampsToExpire.length} drive{stampsToExpire.length > 1 ? 's' : ''} expiring soon <UpIcon size="16px" />
|
||||
</div>
|
||||
{showExpiringModal && (
|
||||
{showExpiringModal && beeApi && (
|
||||
<ExpiringNotificationModal
|
||||
bee={beeApi}
|
||||
stamps={stampsToExpire}
|
||||
drives={drivesToExpire}
|
||||
files={files}
|
||||
@@ -118,6 +119,7 @@ export function NotificationBar({ setErrorMessage }: NotificationBarProps): Reac
|
||||
setShowExpiringModal(false)
|
||||
}}
|
||||
setErrorMessage={setErrorMessage}
|
||||
setShowError={setShowError}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
|
||||
@@ -3,6 +3,7 @@ import { ReactElement, useState } from 'react'
|
||||
import CheckDoubleLineIcon from 'remixicon-react/CheckDoubleLineIcon'
|
||||
import ClipboardIcon from 'remixicon-react/FileCopyLineIcon'
|
||||
|
||||
import { uuidV4 } from '../../../../utils'
|
||||
import { TOOLTIPS } from '../../constants/tooltips'
|
||||
import { getSigner, setSignerPk } from '../../utils/common'
|
||||
import { Button } from '../Button/Button'
|
||||
@@ -10,8 +11,6 @@ import { Tooltip } from '../Tooltip/Tooltip'
|
||||
|
||||
import './PrivateKeyModal.scss'
|
||||
|
||||
import { uuidV4 } from '@/utils'
|
||||
|
||||
type Props = { onSaved: () => void }
|
||||
|
||||
const generateNewPrivateKey = (): string => {
|
||||
|
||||
@@ -305,7 +305,11 @@ export function Sidebar({ setErrorMessage, loading }: SidebarProps): ReactElemen
|
||||
</div>
|
||||
|
||||
{isDriveCreationInProgress && (
|
||||
<div className="fm-sidebar-drive-creation">Creating drive, please do not reload</div>
|
||||
<div className="fm-sidebar-drive-creation">
|
||||
Creating drive — please do not reload the page.
|
||||
<br />
|
||||
This may take a few minutes.
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -26,7 +26,7 @@ interface UseFileFilteringReturn {
|
||||
export function useFileFiltering(props: UseFileFilteringProps): UseFileFilteringReturn {
|
||||
const { files, currentDrive, view, isSearchMode, query, scope, includeActive, includeTrashed } = props
|
||||
|
||||
const q = query.trim().toLowerCase()
|
||||
const q = query.trim().toLowerCase().normalize('NFC')
|
||||
|
||||
const statusIncluded = useCallback(
|
||||
(fi: FileInfo): boolean => {
|
||||
@@ -44,9 +44,11 @@ export function useFileFiltering(props: UseFileFilteringProps): UseFileFiltering
|
||||
const matchesQuery = useCallback(
|
||||
(fi: FileInfo): boolean => {
|
||||
if (!q) return true
|
||||
const name = fi.name.toLowerCase()
|
||||
const mime = (fi.customMetadata?.mime || '').toLowerCase()
|
||||
const topic = String(fi.topic ?? '').toLowerCase()
|
||||
const name = fi.name.toLowerCase().normalize('NFC')
|
||||
const mime = (fi.customMetadata?.mime || '').toLowerCase().normalize('NFC')
|
||||
const topic = String(fi.topic ?? '')
|
||||
.toLowerCase()
|
||||
.normalize('NFC')
|
||||
|
||||
return name.includes(q) || mime.includes(q) || topic.includes(q)
|
||||
},
|
||||
|
||||
@@ -2,7 +2,7 @@ import { ReactElement } from 'react'
|
||||
import FileIcon from 'remixicon-react/FileTextLineIcon'
|
||||
import ImageIcon from 'remixicon-react/Image2LineIcon'
|
||||
|
||||
import { guessMime } from './view'
|
||||
import { guessMime } from '../../../utils/file'
|
||||
|
||||
interface ContextMenuProps {
|
||||
name: string
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
import { FileInfo, FileManager } from '@solarpunkltd/file-manager-lib'
|
||||
|
||||
import { guessMime, VIEWERS } from '../../../utils/file'
|
||||
import { DownloadProgress, DownloadState } from '../constants/transfers'
|
||||
|
||||
import { AbortManager } from './abortManager'
|
||||
import { isDirectoryPickerSupported, isPickerSupported } from './fileOperations'
|
||||
import { guessMime, VIEWERS } from './view'
|
||||
|
||||
const DefaultDownloadFolder = 'downloads'
|
||||
|
||||
|
||||
@@ -1,114 +0,0 @@
|
||||
const EXT_TO_MIME: Record<string, string> = {
|
||||
mp4: 'video/mp4',
|
||||
webm: 'video/webm',
|
||||
ogv: 'video/ogg',
|
||||
mp3: 'audio/mpeg',
|
||||
m4a: 'audio/mp4',
|
||||
aac: 'audio/aac',
|
||||
wav: 'audio/wav',
|
||||
ogg: 'audio/ogg',
|
||||
png: 'image/png',
|
||||
jpg: 'image/jpeg',
|
||||
jpeg: 'image/jpeg',
|
||||
gif: 'image/gif',
|
||||
webp: 'image/webp',
|
||||
avif: 'image/avif',
|
||||
svg: 'image/svg+xml',
|
||||
pdf: 'application/pdf',
|
||||
txt: 'text/plain',
|
||||
md: 'text/markdown',
|
||||
json: 'application/json',
|
||||
csv: 'text/csv',
|
||||
html: 'text/html',
|
||||
htm: 'text/html',
|
||||
}
|
||||
|
||||
export function getExtensionFromName(name: string): string {
|
||||
const ext = name.split('.').pop()?.toLowerCase() || ''
|
||||
const hasExtension = name.includes('.') && ext && ext !== name
|
||||
|
||||
return hasExtension ? ext : ''
|
||||
}
|
||||
|
||||
export function guessMime(name: string, mtdt?: Record<string, string> | undefined): { mime: string; ext: string } {
|
||||
const md = mtdt?.mimeType || mtdt?.mime || mtdt?.['content-type']
|
||||
const ext = getExtensionFromName(name)
|
||||
|
||||
if (md) return { mime: md, ext }
|
||||
|
||||
const mime = EXT_TO_MIME[ext] || 'application/octet-stream'
|
||||
|
||||
return { mime, ext }
|
||||
}
|
||||
|
||||
export type Viewer = {
|
||||
name: string
|
||||
test: (mime: string) => boolean
|
||||
render: (win: Window, url: string, mime: string, name: string) => void
|
||||
}
|
||||
|
||||
const VIDEO_HTML = (u: string, title: string) =>
|
||||
`<html><head><meta charset="utf-8"/><title>${title}</title></head><body style="margin:0;background:#000">
|
||||
<video controls autoplay style="width:100%;height:100%" src="${u}"></video>
|
||||
</body></html>`
|
||||
|
||||
const AUDIO_HTML = (u: string, title: string) =>
|
||||
`<html><head><meta charset="utf-8"/><title>${title}</title></head><body>
|
||||
<audio controls autoplay style="width:100%" src="${u}"></audio>
|
||||
</body></html>`
|
||||
|
||||
const IMAGE_HTML = (u: string, title: string) =>
|
||||
`<html><head><meta charset="utf-8"/><title>${title}</title></head><body style="margin:0;background:#111;display:grid;place-items:center;min-height:100vh">
|
||||
<img style="max-width:100%;max-height:100vh" src="${u}" />
|
||||
</body></html>`
|
||||
|
||||
export const VIEWERS: Viewer[] = [
|
||||
{
|
||||
name: 'video',
|
||||
test: m => m.startsWith('video/'),
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.write(VIDEO_HTML(url, name))
|
||||
w.document.title = name
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'audio',
|
||||
test: m => m.startsWith('audio/'),
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.write(AUDIO_HTML(url, name))
|
||||
w.document.title = name
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'image',
|
||||
test: m => m.startsWith('image/'),
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.write(IMAGE_HTML(url, name))
|
||||
w.document.title = name
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'pdf',
|
||||
test: m => m === 'application/pdf',
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.title = name
|
||||
w.location.href = url
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'html',
|
||||
test: m => m === 'text/html',
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.title = name
|
||||
w.location.href = url
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'text-like',
|
||||
test: m => m.startsWith('text/') || m === 'application/json' || m === 'text/markdown',
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.title = name
|
||||
w.location.href = url
|
||||
},
|
||||
},
|
||||
]
|
||||
@@ -104,7 +104,7 @@ export function AccountFeeds(): ReactElement {
|
||||
{x.feedHash && <ExpandableListItemKey label="Feed hash" value={x.feedHash} />}
|
||||
<Box mt={0.75}>
|
||||
<ExpandableListItemActions>
|
||||
<SwarmButton onClick={() => viewFeed(x.uuid)} iconType={Info}>
|
||||
<SwarmButton onClick={() => viewFeed(x.uuid)} iconType={Info} disabled={Boolean(!x.feedHash)}>
|
||||
View Feed Page
|
||||
</SwarmButton>
|
||||
<SwarmButton onClick={() => onShowExport(x)} iconType={Download}>
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { NULL_TOPIC } from '@ethersphere/bee-js'
|
||||
import { NULL_TOPIC, PostageBatch } from '@ethersphere/bee-js'
|
||||
import { Box, Grid, Typography } from '@mui/material'
|
||||
import { Wallet } from 'ethers'
|
||||
import { Form, Formik } from 'formik'
|
||||
import { useSnackbar } from 'notistack'
|
||||
import { ReactElement, useContext, useState } from 'react'
|
||||
@@ -12,7 +13,7 @@ import ExpandableListItemActions from '../../components/ExpandableListItemAction
|
||||
import ExpandableListItemKey from '../../components/ExpandableListItemKey'
|
||||
import { HistoryHeader } from '../../components/HistoryHeader'
|
||||
import { SwarmButton } from '../../components/SwarmButton'
|
||||
import { SwarmSelect } from '../../components/SwarmSelect'
|
||||
import { SelectEvent, SwarmSelect } from '../../components/SwarmSelect'
|
||||
import { SwarmTextInput } from '../../components/SwarmTextInput'
|
||||
import { Context as FeedsContext, IdentityType } from '../../providers/Feeds'
|
||||
import { Context as SettingsContext } from '../../providers/Settings'
|
||||
@@ -34,7 +35,8 @@ const initialValues: FormValues = {
|
||||
export default function CreateNewFeed(): ReactElement {
|
||||
const { beeApi } = useContext(SettingsContext)
|
||||
const { identities, setIdentities } = useContext(FeedsContext)
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [identityType, setIdentityType] = useState<IdentityType>(IdentityType.PrivateKey)
|
||||
const [loading, setLoading] = useState<boolean>(false)
|
||||
const { enqueueSnackbar } = useSnackbar()
|
||||
|
||||
const navigate = useNavigate()
|
||||
@@ -48,11 +50,24 @@ export default function CreateNewFeed(): ReactElement {
|
||||
|
||||
return
|
||||
}
|
||||
const wallet = generateWallet()
|
||||
const stamps = await beeApi.getPostageBatches()
|
||||
|
||||
let stamps: PostageBatch[] = []
|
||||
let wallet: Wallet
|
||||
|
||||
try {
|
||||
wallet = generateWallet()
|
||||
stamps = (await beeApi.getPostageBatches()).filter(s => s.usable)
|
||||
} catch (err) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(err)
|
||||
enqueueSnackbar(<span>Error during wallet generation or postage stamp retrieval!</span>, { variant: 'error' })
|
||||
setLoading(false)
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
if (!stamps || !stamps.length) {
|
||||
enqueueSnackbar(<span>No stamp available</span>, { variant: 'error' })
|
||||
enqueueSnackbar(<span>No usable stamp available</span>, { variant: 'error' })
|
||||
setLoading(false)
|
||||
|
||||
return
|
||||
@@ -65,17 +80,29 @@ export default function CreateNewFeed(): ReactElement {
|
||||
return
|
||||
}
|
||||
|
||||
const identity = await convertWalletToIdentity(wallet, values.type, values.identityName, values.password)
|
||||
persistIdentity(identities, identity)
|
||||
setIdentities(identities)
|
||||
navigate(ROUTES.ACCOUNT_FEEDS)
|
||||
setLoading(false)
|
||||
try {
|
||||
const identity = await convertWalletToIdentity(wallet, values.type, values.identityName, values.password)
|
||||
persistIdentity(identities, identity)
|
||||
setIdentities(identities)
|
||||
navigate(ROUTES.ACCOUNT_FEEDS)
|
||||
} catch (err) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(err)
|
||||
enqueueSnackbar(<span>Error identity creation!</span>, { variant: 'error' })
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
function cancel() {
|
||||
navigate(-1)
|
||||
}
|
||||
|
||||
function onIdentityTypeChange(event: SelectEvent) {
|
||||
const type = event.target.value as IdentityType
|
||||
setIdentityType(type)
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<HistoryHeader>Create new feed</HistoryHeader>
|
||||
@@ -102,10 +129,13 @@ export default function CreateNewFeed(): ReactElement {
|
||||
<SwarmSelect
|
||||
formik
|
||||
name="type"
|
||||
label={'type'}
|
||||
value={identityType}
|
||||
options={[
|
||||
{ label: 'Keypair Only', value: IdentityType.PrivateKey },
|
||||
{ label: 'Password Protected', value: IdentityType.V3 },
|
||||
]}
|
||||
onChange={onIdentityTypeChange}
|
||||
/>
|
||||
</Box>
|
||||
{values.type === IdentityType.V3 && <SwarmTextInput name="password" label="Password" password formik />}
|
||||
|
||||
@@ -26,8 +26,8 @@ export default function UpdateFeed(): ReactElement {
|
||||
const { status } = useContext(BeeContext)
|
||||
const { hash } = useParams()
|
||||
|
||||
const [selectedStamp, setSelectedStamp] = useState<string | null>(null)
|
||||
const [selectedIdentity, setSelectedIdentity] = useState<Identity | null>(null)
|
||||
const [selectedStamp, setSelectedStamp] = useState<string | null>(stamps ? stamps[0]?.batchID.toHex() : null)
|
||||
const [selectedIdentity, setSelectedIdentity] = useState<Identity | null>(identities[0] ?? null)
|
||||
const [loading, setLoading] = useState(false)
|
||||
const { enqueueSnackbar } = useSnackbar()
|
||||
const [showPasswordPrompt, setShowPasswordPrompt] = useState(false)
|
||||
@@ -119,19 +119,28 @@ export default function UpdateFeed(): ReactElement {
|
||||
<HistoryHeader>Update feed</HistoryHeader>
|
||||
<Box mb={2}>
|
||||
<Grid container>
|
||||
<SwarmSelect
|
||||
options={identities.map(x => ({ value: x.uuid, label: `${x.name} Website` }))}
|
||||
onChange={onFeedChange}
|
||||
label="Feed"
|
||||
/>
|
||||
{identities && identities.length ? (
|
||||
<SwarmSelect
|
||||
value={selectedIdentity?.uuid ?? ''}
|
||||
options={identities.map(x => ({ value: x.uuid, label: `${x.name} Website` }))}
|
||||
onChange={onFeedChange}
|
||||
label="Feed"
|
||||
/>
|
||||
) : (
|
||||
<Typography>You need to create an identiy first to be able to update its feed.</Typography>
|
||||
)}
|
||||
</Grid>
|
||||
</Box>
|
||||
|
||||
<Box mb={4}>
|
||||
<Grid container>
|
||||
{stamps ? (
|
||||
{stamps && stamps.length ? (
|
||||
<SwarmSelect
|
||||
options={stamps.map(x => ({ value: x.batchID.toHex(), label: x.batchID.toHex().slice(0, 8) }))}
|
||||
value={selectedStamp ?? ''}
|
||||
options={stamps.map(x => ({
|
||||
value: x.batchID.toHex(),
|
||||
label: x.label ? x.batchID.toHex().slice(0, 8) + ` (${x.label})` : x.batchID.toHex().slice(0, 8),
|
||||
}))}
|
||||
onChange={onStampChange}
|
||||
label="Stamp"
|
||||
/>
|
||||
|
||||
@@ -104,7 +104,7 @@ export default function Feeds(): ReactElement {
|
||||
{x.feedHash && <ExpandableListItemKey label="Feed hash" value={x.feedHash} />}
|
||||
<Box mt={0.75}>
|
||||
<ExpandableListItemActions>
|
||||
<SwarmButton onClick={() => viewFeed(x.uuid)} iconType={Info}>
|
||||
<SwarmButton onClick={() => viewFeed(x.uuid)} iconType={Info} disabled={Boolean(!x.feedHash)}>
|
||||
View Feed Page
|
||||
</SwarmButton>
|
||||
<SwarmButton onClick={() => onShowExport(x)} iconType={Download}>
|
||||
|
||||
@@ -1,26 +1,27 @@
|
||||
import { BeeModes } from '@ethersphere/bee-js'
|
||||
import { DriveInfo, FileManagerBase } from '@solarpunkltd/file-manager-lib'
|
||||
import { ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react'
|
||||
|
||||
import { AdminStatusBar } from '../../modules/filemanager/components/AdminStatusBar/AdminStatusBar'
|
||||
import { Button } from '../../modules/filemanager/components/Button/Button'
|
||||
import { ConfirmModal } from '../../modules/filemanager/components/ConfirmModal/ConfirmModal'
|
||||
import { ErrorModal } from '../../modules/filemanager/components/ErrorModal/ErrorModal'
|
||||
import { FileBrowser } from '../../modules/filemanager/components/FileBrowser/FileBrowser'
|
||||
import { FormbricksIntegration } from '../../modules/filemanager/components/FormbricksIntegration/FormbricksIntegration'
|
||||
import { Header } from '../../modules/filemanager/components/Header/Header'
|
||||
import { InitialModal } from '../../modules/filemanager/components/InitialModal/InitialModal'
|
||||
import { PrivateKeyModal } from '../../modules/filemanager/components/PrivateKeyModal/PrivateKeyModal'
|
||||
import { Sidebar } from '../../modules/filemanager/components/Sidebar/Sidebar'
|
||||
import { getSignerPk, removeSignerPk } from '../../modules/filemanager/utils/common'
|
||||
import { CheckState, Context as BeeContext } from '../../providers/Bee'
|
||||
import { Context as FMContext } from '../../providers/FileManager'
|
||||
import { BrowserPlatform, cacheClearUrls, detectBrowser } from '../../providers/Platform'
|
||||
|
||||
import { SearchProvider } from './SearchContext'
|
||||
import { ViewProvider } from './ViewContext'
|
||||
|
||||
import './FileManager.scss'
|
||||
|
||||
import { AdminStatusBar } from '@/modules/filemanager/components/AdminStatusBar/AdminStatusBar'
|
||||
import { Button } from '@/modules/filemanager/components/Button/Button'
|
||||
import { ConfirmModal } from '@/modules/filemanager/components/ConfirmModal/ConfirmModal'
|
||||
import { ErrorModal } from '@/modules/filemanager/components/ErrorModal/ErrorModal'
|
||||
import { FileBrowser } from '@/modules/filemanager/components/FileBrowser/FileBrowser'
|
||||
import { FormbricksIntegration } from '@/modules/filemanager/components/FormbricksIntegration/FormbricksIntegration'
|
||||
import { Header } from '@/modules/filemanager/components/Header/Header'
|
||||
import { InitialModal } from '@/modules/filemanager/components/InitialModal/InitialModal'
|
||||
import { PrivateKeyModal } from '@/modules/filemanager/components/PrivateKeyModal/PrivateKeyModal'
|
||||
import { Sidebar } from '@/modules/filemanager/components/Sidebar/Sidebar'
|
||||
import { getSignerPk, removeSignerPk } from '@/modules/filemanager/utils/common'
|
||||
import { CheckState, Context as BeeContext } from '@/providers/Bee'
|
||||
import { Context as FMContext } from '@/providers/FileManager'
|
||||
import { BrowserPlatform, cacheClearUrls, detectBrowser } from '@/providers/Platform'
|
||||
|
||||
function PrivateKeyModalBlock({ onSaved }: { onSaved: () => void }) {
|
||||
return (
|
||||
<div className="fm-main">
|
||||
@@ -44,6 +45,18 @@ function InitializationErrorBlock({ onOk }: { onOk: () => void }) {
|
||||
)
|
||||
}
|
||||
|
||||
function UltraLightNodeErrorBlock() {
|
||||
return (
|
||||
<div className="fm-main">
|
||||
<div className="fm-loading">
|
||||
<div className="fm-loading-title">
|
||||
File Manager is not available with an Ultra-light node. Please upgrade to a Light node to continue.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function ResetModalBlock({ cacheHelpUrl, onConfirm }: { cacheHelpUrl: string; onConfirm: () => void }) {
|
||||
return (
|
||||
<div className="fm-main">
|
||||
@@ -95,6 +108,22 @@ function LoadingBlock() {
|
||||
)
|
||||
}
|
||||
|
||||
function ChainSyncingBlock() {
|
||||
return (
|
||||
<div className="fm-main">
|
||||
<div className="fm-loading" aria-live="polite">
|
||||
<div className="fm-spinner" aria-hidden="true" />
|
||||
<div className="fm-loading-title">Bee node is syncing…</div>
|
||||
<div className="fm-loading-subtitle">
|
||||
Your Bee node is still syncing the postage batch state from the chain.
|
||||
<br />
|
||||
File Manager will be available once the sync is complete.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function ErrorModalBlock({ onClick, label }: { onClick: () => void; label: string }) {
|
||||
return <ErrorModal label={label} onClick={onClick} />
|
||||
}
|
||||
@@ -153,10 +182,12 @@ function FileManagerMainContent(props: {
|
||||
|
||||
enum PageState {
|
||||
Connecting = 'connecting', // still warming up — show nothing / loader
|
||||
UltraLightNode = 'ultra-light-node', // ultra-light node — file manager not available
|
||||
NoPrivateKey = 'no-pk', // private key not set
|
||||
Loading = 'loading', // bee ready, pk present, FM init in progress
|
||||
Reset = 'reset', // STATE_INVALID emitted and user has not yet acknowledged
|
||||
InitError = 'init-error', // FM init completed with an error (non-reset case)
|
||||
ChainSyncing = 'chain-syncing', // bee node is still syncing postage batch state from chain
|
||||
Initial = 'initial', // FM ready but no admin stamp/drive → show InitialModal
|
||||
AdminError = 'admin-error', // drive creation failed
|
||||
Ready = 'ready', // fully operational
|
||||
@@ -172,7 +203,7 @@ export function FileManagerPage(): ReactElement {
|
||||
const [connectionErrorDismissed, setConnectionErrorDismissed] = useState<boolean>(false)
|
||||
const [cacheHelpUrl, setCacheHelpUrl] = useState<string>(cacheClearUrls[BrowserPlatform.Chrome])
|
||||
|
||||
const { status } = useContext(BeeContext)
|
||||
const { status, chainState, nodeInfo } = useContext(BeeContext)
|
||||
const { fm, initDone, shallReset, adminDrive, initializationError, notifyPkSaved } = useContext(FMContext)
|
||||
|
||||
useEffect(() => {
|
||||
@@ -207,8 +238,12 @@ export function FileManagerPage(): ReactElement {
|
||||
}, [isConnectionError])
|
||||
|
||||
const pageState = useMemo((): PageState => {
|
||||
const isChainSyncing = chainState === null
|
||||
|
||||
if (!isBeeReady && !initDone) return PageState.Connecting
|
||||
|
||||
if (nodeInfo?.beeMode === BeeModes.ULTRA_LIGHT) return PageState.UltraLightNode
|
||||
|
||||
if (!hasPk) return PageState.NoPrivateKey
|
||||
|
||||
if (!initDone) return PageState.Loading
|
||||
@@ -217,12 +252,15 @@ export function FileManagerPage(): ReactElement {
|
||||
|
||||
if (initializationError && !shallReset) return PageState.InitError
|
||||
|
||||
if (showAdminErrorModal) return PageState.AdminError
|
||||
|
||||
const hasAdminStamp = Boolean(fm?.adminStamp)
|
||||
const hasAdminDrive = Boolean(adminDrive)
|
||||
const setupIncomplete = !hasAdminStamp && !hasAdminDrive
|
||||
|
||||
if (!hasAdminStamp && !hasAdminDrive && !isCreationInProgress) return PageState.Initial
|
||||
if (setupIncomplete && isChainSyncing) return PageState.ChainSyncing
|
||||
|
||||
if (showAdminErrorModal) return PageState.AdminError
|
||||
|
||||
if (setupIncomplete && !isCreationInProgress) return PageState.Initial
|
||||
|
||||
return PageState.Ready
|
||||
}, [
|
||||
@@ -236,6 +274,8 @@ export function FileManagerPage(): ReactElement {
|
||||
fm,
|
||||
adminDrive,
|
||||
isCreationInProgress,
|
||||
chainState,
|
||||
nodeInfo?.beeMode,
|
||||
])
|
||||
|
||||
const handlePrivateKeySaved = useCallback(() => {
|
||||
@@ -251,10 +291,18 @@ export function FileManagerPage(): ReactElement {
|
||||
const loading = !fm?.adminStamp || !adminDrive
|
||||
const isFormbricksActive = Boolean(fm && fm.adminStamp && adminDrive && !loading)
|
||||
|
||||
if (pageState === PageState.UltraLightNode) {
|
||||
return <UltraLightNodeErrorBlock />
|
||||
}
|
||||
|
||||
if (pageState === PageState.Connecting || pageState === PageState.Loading) {
|
||||
return <LoadingBlock />
|
||||
}
|
||||
|
||||
if (pageState === PageState.ChainSyncing) {
|
||||
return <ChainSyncingBlock />
|
||||
}
|
||||
|
||||
if (pageState === PageState.NoPrivateKey) {
|
||||
return <PrivateKeyModalBlock onSaved={handlePrivateKeySaved} />
|
||||
}
|
||||
@@ -289,12 +337,15 @@ export function FileManagerPage(): ReactElement {
|
||||
}
|
||||
|
||||
if (pageState === PageState.AdminError) {
|
||||
const adminErrorLabel =
|
||||
chainState === null
|
||||
? 'Your Bee node is still syncing the postage batch state from the chain. Please wait for the sync to complete and try again.'
|
||||
: errorMessage ||
|
||||
'Error creating Admin Drive. Please try again. Possible causes include insufficient xDAI balance or a lost connection to the RPC.'
|
||||
|
||||
return (
|
||||
<ErrorModalBlock
|
||||
label={
|
||||
errorMessage ||
|
||||
'Error creating Admin Drive. Please try again. Possible causes include insufficient xDAI balance or a lost connection to the RPC.'
|
||||
}
|
||||
label={adminErrorLabel}
|
||||
onClick={() => {
|
||||
setAdminShowErrorModal(false)
|
||||
setErrorMessage('')
|
||||
|
||||
@@ -8,7 +8,7 @@ import { FitAudio } from '../../components/FitAudio'
|
||||
import { FitImage } from '../../components/FitImage'
|
||||
import { FitVideo } from '../../components/FitVideo'
|
||||
import { shortenText } from '../../utils'
|
||||
import { getHumanReadableFileSize } from '../../utils/file'
|
||||
import { getHumanReadableFileSize, guessMime } from '../../utils/file'
|
||||
import { shortenHash } from '../../utils/hash'
|
||||
|
||||
import { AssetIcon } from './AssetIcon'
|
||||
@@ -18,16 +18,20 @@ interface Props {
|
||||
metadata?: Metadata
|
||||
}
|
||||
|
||||
const getPreviewElement = (previewUri?: string, metadata?: Metadata) => {
|
||||
if (metadata?.isVideo) {
|
||||
const getPreviewElement = (previewUri?: string, metadata?: Metadata, type?: string) => {
|
||||
const isVideoType = Boolean(type && /.*\.(mp4|webm|ogv)$/i.test(type))
|
||||
const isAudioType = Boolean(type && /.*\.(mp3|ogg|oga|wav|webm|m4a|aac|flac)$/i.test(type))
|
||||
const isImageType = Boolean(type && /.*\.(jpg|jpeg|png|gif|webp|svg|ico)$/i.test(type))
|
||||
|
||||
if (metadata?.isVideo || isVideoType) {
|
||||
return <FitVideo src={previewUri} maxWidth="250px" maxHeight="175px" />
|
||||
}
|
||||
|
||||
if (metadata?.isAudio) {
|
||||
if (metadata?.isAudio || isAudioType) {
|
||||
return <FitAudio src={previewUri} maxWidth="250px" />
|
||||
}
|
||||
|
||||
if (metadata?.isImage) {
|
||||
if (metadata?.isImage || isImageType) {
|
||||
return <FitImage maxWidth="250px" maxHeight="175px" alt="Upload Preview" src={previewUri} />
|
||||
}
|
||||
|
||||
@@ -42,18 +46,26 @@ const getPreviewElement = (previewUri?: string, metadata?: Metadata) => {
|
||||
return <AssetIcon icon={<File />} />
|
||||
}
|
||||
|
||||
const getType = (metadata?: Metadata) => {
|
||||
export const getType = (metadata?: Metadata): string => {
|
||||
if (metadata?.isWebsite) return 'Website'
|
||||
|
||||
if (metadata?.type === 'folder') return 'Folder'
|
||||
|
||||
return metadata?.type
|
||||
let metadataType = metadata?.type || 'unknown'
|
||||
let typeFromExtension: string | undefined
|
||||
|
||||
if (metadataType === 'unknown' && metadata?.name) {
|
||||
const { mime } = guessMime(metadata.name)
|
||||
typeFromExtension = mime === 'application/octet-stream' ? 'file' : mime
|
||||
}
|
||||
|
||||
return typeFromExtension || metadataType
|
||||
}
|
||||
|
||||
// TODO: add optional prop for indexDocument when it is already known (e.g. downloading a manifest)
|
||||
export function AssetPreview({ metadata, previewUri }: Props): ReactElement | null {
|
||||
const previewElement = useMemo(() => getPreviewElement(previewUri, metadata), [metadata, previewUri])
|
||||
const type = useMemo(() => getType(metadata), [metadata])
|
||||
const previewElement = useMemo(() => getPreviewElement(previewUri, metadata, type), [metadata, type, previewUri])
|
||||
|
||||
return (
|
||||
<Box mb={4}>
|
||||
|
||||
@@ -16,7 +16,7 @@ import { ROUTES } from '../../routes'
|
||||
import { determineHistoryName, LocalStorageKeys, putHistory } from '../../utils/localStorage'
|
||||
import { loadManifest } from '../../utils/manifest'
|
||||
|
||||
import { AssetPreview } from './AssetPreview'
|
||||
import { AssetPreview, getType } from './AssetPreview'
|
||||
import { AssetSummary } from './AssetSummary'
|
||||
import { AssetSyncing } from './AssetSyncing'
|
||||
import { DownloadActionBar } from './DownloadActionBar'
|
||||
@@ -46,7 +46,7 @@ export function Share(): ReactElement {
|
||||
const count = Object.keys(entries).length
|
||||
const isVideo = Boolean(indexDocument && /.*\.(mp4|webm|ogv)$/i.test(indexDocument))
|
||||
const isAudio = Boolean(indexDocument && /.*\.(mp3|ogg|oga|wav|webm|m4a|aac|flac)$/i.test(indexDocument))
|
||||
const isImage = Boolean(indexDocument && /.*\.(jpg|jpeg|png|gif|webp|svg)$/i.test(indexDocument))
|
||||
const isImage = Boolean(indexDocument && /.*\.(jpg|jpeg|png|gif|webp|svg|ico)$/i.test(indexDocument))
|
||||
|
||||
if (isImage || isVideo || isAudio) {
|
||||
setPreview(`${apiUrl}/bzz/${hash}`)
|
||||
@@ -54,7 +54,7 @@ export function Share(): ReactElement {
|
||||
|
||||
setMetadata({
|
||||
hash,
|
||||
type: count > 1 ? 'folder' : 'unknown',
|
||||
type: count > 1 ? 'folder' : getType(),
|
||||
name: indexDocument || hash || '',
|
||||
count,
|
||||
isWebsite: Boolean(indexDocument && /.*\.html?$/i.test(indexDocument)),
|
||||
|
||||
@@ -14,10 +14,10 @@ import { Context as FileContext } from '../../providers/File'
|
||||
import { Context as SettingsContext } from '../../providers/Settings'
|
||||
import { Context as StampsContext, EnrichedPostageBatch } from '../../providers/Stamps'
|
||||
import { ROUTES } from '../../routes'
|
||||
import { waitUntilStampUsable } from '../../utils'
|
||||
import { detectIndexHtml, getAssetNameFromFiles, packageFile } from '../../utils/file'
|
||||
import { persistIdentity, updateFeed } from '../../utils/identity'
|
||||
import { LocalStorageKeys, putHistory } from '../../utils/localStorage'
|
||||
import { waitUntilStampUsable } from '../../utils/stamp'
|
||||
import { FeedPasswordDialog } from '../feeds/FeedPasswordDialog'
|
||||
import { PostageStampAdvancedCreation } from '../stamps/PostageStampAdvancedCreation'
|
||||
import { PostageStampSelector } from '../stamps/PostageStampSelector'
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { BeeModes } from '@ethersphere/bee-js'
|
||||
import { useContext } from 'react'
|
||||
import { useNavigate } from 'react-router'
|
||||
import Upload from 'remixicon-react/UploadLineIcon'
|
||||
@@ -19,7 +20,7 @@ export function WalletInfoCard() {
|
||||
)} xBZZ | ${walletBalance.nativeTokenBalance.toSignificantDigits(4)} xDAI`
|
||||
}
|
||||
|
||||
if (nodeInfo?.beeMode && ['light', 'full', 'dev'].includes(nodeInfo.beeMode)) {
|
||||
if (nodeInfo?.beeMode && [BeeModes.LIGHT, BeeModes.FULL, BeeModes.DEV].includes(nodeInfo.beeMode)) {
|
||||
return (
|
||||
<Card
|
||||
buttonProps={{
|
||||
|
||||
@@ -15,7 +15,7 @@ import NodeInfoCard from './NodeInfoCard'
|
||||
import { WalletInfoCard } from './WalletInfoCard'
|
||||
|
||||
export default function Status(): ReactElement {
|
||||
const { beeVersion, status, topology, nodeInfo, walletBalance } = useContext(BeeContext)
|
||||
const { beeVersion, status, topology, nodeInfo, nodeStatus, walletBalance } = useContext(BeeContext)
|
||||
const { isDesktop, desktopUrl } = useContext(SettingsContext)
|
||||
const { beeDesktopVersion } = useBeeDesktop(isDesktop, desktopUrl)
|
||||
const { newBeeDesktopVersion } = useNewBeeDesktopVersion(isDesktop, desktopUrl, false)
|
||||
@@ -40,7 +40,10 @@ export default function Status(): ReactElement {
|
||||
<div style={{ height: '2px' }} />
|
||||
<ExpandableListItem label="Connected peers" value={topology?.connected ?? '-'} />
|
||||
<ExpandableListItem label="Population" value={topology?.population ?? '-'} />
|
||||
<ExpandableListItem label="Pullsync rate" value={nodeStatus?.pullsyncRate} />
|
||||
<ExpandableListItem label="Depth" value={topology?.depth ?? '-'} />
|
||||
<ExpandableListItem label="Neighborhood size" value={nodeStatus?.neighborhoodSize} />
|
||||
<ExpandableListItem label="Node is reachable" value={nodeStatus?.isReachable?.toString()} />
|
||||
<ChainSync />
|
||||
|
||||
<div style={{ height: '16px' }} />
|
||||
|
||||
@@ -0,0 +1,26 @@
|
||||
import CircularProgress from '@mui/material/CircularProgress'
|
||||
import { ReactElement, useContext } from 'react'
|
||||
|
||||
import ExpandableList from '../../components/ExpandableList'
|
||||
import { Redistribution } from '../../components/Redistribution'
|
||||
import { Context as SettingsContext } from '../../providers/Settings'
|
||||
|
||||
export default function RedistributionPage(): ReactElement {
|
||||
const { isLoading } = useContext(SettingsContext)
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div style={{ textAlign: 'center', width: '100%' }}>
|
||||
<CircularProgress />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<ExpandableList label="Redistribution" defaultOpen>
|
||||
<Redistribution />
|
||||
</ExpandableList>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
import { PostageBatchOptions, Utils } from '@ethersphere/bee-js'
|
||||
import { PostageBatchOptions, RedundancyLevel, Utils } from '@ethersphere/bee-js'
|
||||
import { Box, Grid, IconButton, Typography } from '@mui/material'
|
||||
import BigNumber from 'bignumber.js'
|
||||
import { useSnackbar } from 'notistack'
|
||||
@@ -11,12 +11,14 @@ import { makeStyles } from 'tss-react/mui'
|
||||
import { SwarmButton } from '../../components/SwarmButton'
|
||||
import { SwarmSelect } from '../../components/SwarmSelect'
|
||||
import { SwarmTextInput } from '../../components/SwarmTextInput'
|
||||
import { MAX_STAMP_DEPTH, MIN_STAMP_DEPTH } from '../../constants'
|
||||
import { Context as BeeContext } from '../../providers/Bee'
|
||||
import { Context as SettingsContext } from '../../providers/Settings'
|
||||
import { Context as StampsContext } from '../../providers/Stamps'
|
||||
import { ROUTES } from '../../routes'
|
||||
import { secondsToTimeString } from '../../utils'
|
||||
import { getHumanReadableFileSize } from '../../utils/file'
|
||||
import { validateDepthInput } from '../../utils/stamp'
|
||||
|
||||
interface Props {
|
||||
onFinished: () => void
|
||||
@@ -80,7 +82,7 @@ export function PostageStampAdvancedCreation({ onFinished }: Props): ReactElemen
|
||||
}
|
||||
|
||||
function getPrice(depth: number, amount: bigint): string {
|
||||
const hasInvalidInput = amount <= 0 || isNaN(depth) || depth < 17 || depth > 255
|
||||
const hasInvalidInput = amount <= 0 || isNaN(depth) || depth < MIN_STAMP_DEPTH || depth > MAX_STAMP_DEPTH
|
||||
|
||||
if (hasInvalidInput) {
|
||||
return '-'
|
||||
@@ -147,38 +149,15 @@ export function PostageStampAdvancedCreation({ onFinished }: Props): ReactElemen
|
||||
setAmountInput(validAmountInput)
|
||||
}
|
||||
|
||||
function validateDepthInput(depthInput: string) {
|
||||
let validDepthInput = '0'
|
||||
|
||||
if (!depthInput) {
|
||||
setDepthError('Required field')
|
||||
} else {
|
||||
const depth = new BigNumber(depthInput)
|
||||
|
||||
if (!depth.isInteger()) {
|
||||
setDepthError('Depth must be an integer')
|
||||
} else if (depth.isLessThan(17)) {
|
||||
setDepthError('Minimal depth is 17')
|
||||
} else if (depth.isGreaterThan(255)) {
|
||||
setDepthError('Depth has to be at most 255')
|
||||
} else {
|
||||
setDepthError('')
|
||||
validDepthInput = depthInput
|
||||
}
|
||||
}
|
||||
|
||||
setDepthInput(validDepthInput)
|
||||
}
|
||||
|
||||
function renderStampVolumesInfo() {
|
||||
const depth = parseInt(depthInput, 10)
|
||||
|
||||
if (depthError || isNaN(depth) || depth < 17 || depth > 255) {
|
||||
if (depthError || isNaN(depth) || depth < MIN_STAMP_DEPTH || depth > MAX_STAMP_DEPTH) {
|
||||
return '-'
|
||||
}
|
||||
|
||||
const theoreticalMaximumVolume = getHumanReadableFileSize(Utils.getStampTheoreticalBytes(depth))
|
||||
const effectiveVolume = getHumanReadableFileSize(Utils.getStampEffectiveBytes(depth))
|
||||
const effectiveVolume = getHumanReadableFileSize(Utils.getStampEffectiveBytes(depth, false, RedundancyLevel.OFF))
|
||||
|
||||
return (
|
||||
<Grid container alignItems="center" className={classes.stampVolumeWrapper}>
|
||||
@@ -217,7 +196,11 @@ export function PostageStampAdvancedCreation({ onFinished }: Props): ReactElemen
|
||||
</Typography>
|
||||
</Box>
|
||||
<Box mb={2}>
|
||||
<SwarmTextInput name="depth" label="Depth" onChange={event => validateDepthInput(event.target.value)} />
|
||||
<SwarmTextInput
|
||||
name="depth"
|
||||
label="Depth"
|
||||
onChange={event => validateDepthInput(event.target.value, setDepthError, setDepthInput)}
|
||||
/>
|
||||
<Box mt={0.25} sx={{ bgcolor: '#f6f6f6' }} p={2}>
|
||||
<Grid container justifyContent="space-between" alignItems="center">
|
||||
<Typography>Corresponding file size</Typography>
|
||||
@@ -242,7 +225,7 @@ export function PostageStampAdvancedCreation({ onFinished }: Props): ReactElemen
|
||||
<Box mb={2}>
|
||||
<SwarmSelect
|
||||
label="Immutable"
|
||||
value="No"
|
||||
value={immutable ? 'Yes' : 'No'}
|
||||
onChange={event => setImmutable(event.target.value === 'Yes')}
|
||||
options={[
|
||||
{ value: 'Yes', label: 'Yes' },
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Duration, PostageBatchOptions, Size, Utils } from '@ethersphere/bee-js'
|
||||
import { Duration, RedundancyLevel, Size, Utils } from '@ethersphere/bee-js'
|
||||
import { Box, Button, Grid, Slider, Typography } from '@mui/material'
|
||||
import { useSnackbar } from 'notistack'
|
||||
import { ReactElement, useContext, useState } from 'react'
|
||||
@@ -8,10 +8,12 @@ import { makeStyles } from 'tss-react/mui'
|
||||
|
||||
import { SwarmButton } from '../../components/SwarmButton'
|
||||
import { SwarmTextInput } from '../../components/SwarmTextInput'
|
||||
import { Context as BeeContext } from '../../providers/Bee'
|
||||
import { Context as SettingsContext } from '../../providers/Settings'
|
||||
import { Context as StampsContext } from '../../providers/Stamps'
|
||||
import { ROUTES } from '../../routes'
|
||||
import { secondsToTimeString } from '../../utils'
|
||||
import { validateDepthInput } from '../../utils/stamp'
|
||||
|
||||
interface Props {
|
||||
onFinished: () => void
|
||||
@@ -48,12 +50,17 @@ export function PostageStampStandardCreation({ onFinished }: Props): ReactElemen
|
||||
const { classes } = useStyles()
|
||||
const { refresh } = useContext(StampsContext)
|
||||
const { beeApi } = useContext(SettingsContext)
|
||||
|
||||
const { chainState } = useContext(BeeContext)
|
||||
const [depthInput, setDepthInput] = useState<number>(Utils.getDepthForSize(Size.fromGigabytes(4)))
|
||||
const [amountInput, setAmountInput] = useState<bigint>(Utils.getAmountForDuration(Duration.fromDays(30), 26500, 5))
|
||||
const [labelInput, setLabelInput] = useState('')
|
||||
const [submitting, setSubmitting] = useState(false)
|
||||
const [buttonValue, setButtonValue] = useState(4)
|
||||
const [depthError, setDepthError] = useState<string>('')
|
||||
const [sliderValue, setSliderValue] = useState(30)
|
||||
|
||||
const pricePerBlockDefault = 24000
|
||||
const currentPrice = chainState?.currentPrice ?? pricePerBlockDefault
|
||||
|
||||
const getBatchValue = (value: number) => {
|
||||
return (
|
||||
@@ -74,18 +81,18 @@ export function PostageStampStandardCreation({ onFinished }: Props): ReactElemen
|
||||
if (typeof newValue !== 'number') {
|
||||
return
|
||||
}
|
||||
const amountValue = Utils.getAmountForDuration(Duration.fromDays(newValue), 26500, 5)
|
||||
const amountValue = Utils.getAmountForDuration(Duration.fromDays(newValue), currentPrice, 5)
|
||||
|
||||
setAmountInput(amountValue)
|
||||
setSliderValue(newValue)
|
||||
}
|
||||
|
||||
const { enqueueSnackbar } = useSnackbar()
|
||||
|
||||
function getTtl(amount: bigint): string {
|
||||
const pricePerBlock = 24000
|
||||
|
||||
return `${secondsToTimeString(
|
||||
Utils.getStampDuration(amount, pricePerBlock, 5).toSeconds(),
|
||||
)} (with price of ${pricePerBlock} PLUR per block)`
|
||||
Utils.getStampDuration(amount, currentPrice, 5).toSeconds(),
|
||||
)} (with price of ${currentPrice} PLUR per block)`
|
||||
}
|
||||
|
||||
function getPrice(depth: number, amount: bigint): string {
|
||||
@@ -106,15 +113,15 @@ export function PostageStampStandardCreation({ onFinished }: Props): ReactElemen
|
||||
}
|
||||
|
||||
setSubmitting(true)
|
||||
const amount = BigInt(amountInput)
|
||||
const depth = depthInput
|
||||
const options: PostageBatchOptions = {
|
||||
waitForUsable: false,
|
||||
label: labelInput || undefined,
|
||||
immutableFlag: true,
|
||||
}
|
||||
|
||||
await beeApi.createPostageBatch(amount.toString(), depth, options)
|
||||
await beeApi.buyStorage(
|
||||
Size.fromGigabytes(buttonValue),
|
||||
Duration.fromDays(sliderValue),
|
||||
{ label: labelInput, immutableFlag: true },
|
||||
undefined,
|
||||
false,
|
||||
RedundancyLevel.OFF,
|
||||
)
|
||||
await refresh()
|
||||
onFinished()
|
||||
} catch (e) {
|
||||
@@ -127,8 +134,8 @@ export function PostageStampStandardCreation({ onFinished }: Props): ReactElemen
|
||||
|
||||
function handleBatchSize(gigabytes: number) {
|
||||
setButtonValue(gigabytes)
|
||||
const capacity = Utils.getDepthForSize(Size.fromGigabytes(gigabytes))
|
||||
setDepthInput(capacity)
|
||||
const capacity = Utils.getDepthForSize(Size.fromGigabytes(gigabytes), false, RedundancyLevel.OFF)
|
||||
validateDepthInput(String(capacity), setDepthError, (v: string) => setDepthInput(Number(v)))
|
||||
}
|
||||
|
||||
return (
|
||||
@@ -162,6 +169,7 @@ export function PostageStampStandardCreation({ onFinished }: Props): ReactElemen
|
||||
{getBatchValue(32)}
|
||||
{getBatchValue(256)}
|
||||
</Box>
|
||||
{depthError && <Typography>{depthError}</Typography>}
|
||||
</Box>
|
||||
<Box mb={1}>
|
||||
<Typography variant="h2">Data persistence</Typography>
|
||||
@@ -187,7 +195,7 @@ export function PostageStampStandardCreation({ onFinished }: Props): ReactElemen
|
||||
</Box>
|
||||
<Box display="flex" justifyContent={'right'} mt={0.5}>
|
||||
<Typography style={{ fontSize: '10px', color: 'rgba(0, 0, 0, 0.26)' }}>
|
||||
Current price of 24000 PLUR per block
|
||||
Current price of {currentPrice} PLUR per block
|
||||
</Typography>
|
||||
</Box>
|
||||
</Box>
|
||||
@@ -200,7 +208,7 @@ export function PostageStampStandardCreation({ onFinished }: Props): ReactElemen
|
||||
<Grid container justifyContent="space-between" alignItems="center">
|
||||
<Grid>
|
||||
<SwarmButton
|
||||
disabled={submitting || !depthInput || !amountInput}
|
||||
disabled={submitting || !depthInput || Boolean(depthError) || !amountInput}
|
||||
onClick={submit}
|
||||
iconType={Check}
|
||||
loading={submitting}
|
||||
|
||||
@@ -7,8 +7,9 @@ import ExpandableList from '../../components/ExpandableList'
|
||||
import ExpandableListItem from '../../components/ExpandableListItem'
|
||||
import ExpandableListItemActions from '../../components/ExpandableListItemActions'
|
||||
import ExpandableListItemKey from '../../components/ExpandableListItemKey'
|
||||
import StampExtensionModal from '../../components/StampExtensionModal'
|
||||
import { Context } from '../../providers/Settings'
|
||||
import StampExtensionModal, { StampExtensionType } from '../../components/StampExtensionModal'
|
||||
import { Context as BeeContext } from '../../providers/Bee'
|
||||
import { Context as SettingsContext } from '../../providers/Settings'
|
||||
import { EnrichedPostageBatch } from '../../providers/Stamps'
|
||||
import { secondsToTimeString } from '../../utils'
|
||||
import { getHumanReadableFileSize } from '../../utils/file'
|
||||
@@ -20,7 +21,8 @@ interface Props {
|
||||
}
|
||||
|
||||
function StampsTable({ postageStamps }: Props): ReactElement | null {
|
||||
const { beeApi } = useContext(Context)
|
||||
const { beeApi } = useContext(SettingsContext)
|
||||
const { status } = useContext(BeeContext)
|
||||
|
||||
if (!postageStamps || !beeApi) {
|
||||
return null
|
||||
@@ -37,8 +39,8 @@ function StampsTable({ postageStamps }: Props): ReactElement | null {
|
||||
<ExpandableListItem label="Depth" value={String(stamp.depth)} />
|
||||
<ExpandableListItem
|
||||
label="Capacity"
|
||||
value={`${getHumanReadableFileSize(2 ** stamp.depth * 4096 * stamp.usage)} / ${getHumanReadableFileSize(
|
||||
2 ** stamp.depth * 4096,
|
||||
value={`${getHumanReadableFileSize(stamp.size.toBytes() - stamp.remainingSize.toBytes())} / ${getHumanReadableFileSize(
|
||||
stamp.size.toBytes(),
|
||||
)}`}
|
||||
/>
|
||||
<ExpandableListItem label="Amount" value={parseInt(stamp.amount, 10).toLocaleString()} />
|
||||
@@ -49,16 +51,18 @@ function StampsTable({ postageStamps }: Props): ReactElement | null {
|
||||
<ExpandableListItem label="Purchase Block Number" value={stamp.blockNumber} />
|
||||
<ExpandableListItemActions>
|
||||
<StampExtensionModal
|
||||
type="Topup"
|
||||
type={StampExtensionType.Topup}
|
||||
icon={<TimerFlashFill size="1rem" />}
|
||||
bee={beeApi}
|
||||
stamp={stamp.batchID}
|
||||
stamp={stamp}
|
||||
status={status.all}
|
||||
/>
|
||||
<StampExtensionModal
|
||||
type="Dilute"
|
||||
type={StampExtensionType.Dilute}
|
||||
icon={<TimerFlashLine size="1rem" />}
|
||||
bee={beeApi}
|
||||
stamp={stamp.batchID}
|
||||
stamp={stamp}
|
||||
status={status.all}
|
||||
/>
|
||||
</ExpandableListItemActions>
|
||||
</>
|
||||
|
||||
@@ -5,11 +5,13 @@ import {
|
||||
ChainState,
|
||||
ChequebookAddressResponse,
|
||||
ChequebookBalanceResponse,
|
||||
DebugStatus,
|
||||
LastChequesResponse,
|
||||
NodeAddresses,
|
||||
NodeInfo,
|
||||
Peer,
|
||||
PeerBalance,
|
||||
RedistributionState,
|
||||
Topology,
|
||||
WalletBalance,
|
||||
} from '@ethersphere/bee-js'
|
||||
@@ -61,6 +63,7 @@ interface ContextInterface {
|
||||
apiHealth: boolean
|
||||
nodeAddresses: NodeAddresses | null
|
||||
nodeInfo: NodeInfo | null
|
||||
nodeStatus: DebugStatus | null
|
||||
topology: Topology | null
|
||||
chequebookAddress: ChequebookAddressResponse | null
|
||||
peers: Peer[] | null
|
||||
@@ -71,6 +74,7 @@ interface ContextInterface {
|
||||
settlements: AllSettlements | null
|
||||
chainState: ChainState | null
|
||||
walletBalance: WalletBalance | null
|
||||
redistributionState: RedistributionState | null
|
||||
latestBeeRelease: LatestBeeRelease | null
|
||||
isLoading: boolean
|
||||
lastUpdate: number | null
|
||||
@@ -91,6 +95,7 @@ const initialValues: ContextInterface = {
|
||||
apiHealth: false,
|
||||
nodeAddresses: null,
|
||||
nodeInfo: null,
|
||||
nodeStatus: null,
|
||||
topology: null,
|
||||
chequebookAddress: null,
|
||||
stake: null,
|
||||
@@ -101,6 +106,7 @@ const initialValues: ContextInterface = {
|
||||
settlements: null,
|
||||
chainState: null,
|
||||
walletBalance: null,
|
||||
redistributionState: null,
|
||||
latestBeeRelease: null,
|
||||
isLoading: true,
|
||||
lastUpdate: null,
|
||||
@@ -199,6 +205,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
const [isWarmingUp, setIsWarmingUp] = useState<boolean>(true)
|
||||
const [nodeAddresses, setNodeAddresses] = useState<NodeAddresses | null>(null)
|
||||
const [nodeInfo, setNodeInfo] = useState<NodeInfo | null>(null)
|
||||
const [nodeStatus, setNodeStatus] = useState<DebugStatus | null>(null)
|
||||
const [topology, setNodeTopology] = useState<Topology | null>(null)
|
||||
const [chequebookAddress, setChequebookAddress] = useState<ChequebookAddressResponse | null>(null)
|
||||
const [peers, setPeers] = useState<Peer[] | null>(null)
|
||||
@@ -209,6 +216,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
const [settlements, setSettlements] = useState<AllSettlements | null>(null)
|
||||
const [chainState, setChainState] = useState<ChainState | null>(null)
|
||||
const [walletBalance, setWalletBalance] = useState<WalletBalance | null>(null)
|
||||
const [redistributionState, setRedistributionState] = useState<RedistributionState | null>(null)
|
||||
const [startedAt, setStartedAt] = useState(() => Date.now())
|
||||
|
||||
const { latestBeeRelease } = useLatestBeeRelease()
|
||||
@@ -257,6 +265,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
walletResult,
|
||||
chequebookBalanceResult,
|
||||
stakeResult,
|
||||
redistributionStateResult,
|
||||
peerBalancesResult,
|
||||
settlementsResult,
|
||||
] = await Promise.allSettled([
|
||||
@@ -272,6 +281,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
beeApi.getWalletBalance({ timeout: TIMEOUT }),
|
||||
beeApi.getChequebookBalance({ timeout: TIMEOUT }),
|
||||
beeApi.getStake({ timeout: TIMEOUT }),
|
||||
beeApi.getRedistributionState({ timeout: TIMEOUT }),
|
||||
beeApi.getAllBalances({ timeout: TIMEOUT }),
|
||||
beeApi.getAllSettlements(),
|
||||
])
|
||||
@@ -282,6 +292,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
setApiHealth(Boolean(health))
|
||||
|
||||
setIsWarmingUp(getFulfilledValue(statusResult)?.isWarmingUp ?? false)
|
||||
setNodeStatus(getFulfilledValue(statusResult))
|
||||
setNodeAddresses(getFulfilledValue(nodeAddressesResult))
|
||||
setNodeInfo(getFulfilledValue(nodeInfoResult))
|
||||
setNodeTopology(getFulfilledValue(topologyResult))
|
||||
@@ -292,6 +303,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
setWalletBalance(getFulfilledValue(walletResult))
|
||||
setChequebookBalance(getFulfilledValue(chequebookBalanceResult))
|
||||
setStake(getFulfilledValue(stakeResult))
|
||||
setRedistributionState(getFulfilledValue(redistributionStateResult))
|
||||
setPeerBalances(getFulfilledValue(peerBalancesResult)?.balances ?? null)
|
||||
setSettlements(getFulfilledValue(settlementsResult))
|
||||
setError(null)
|
||||
@@ -332,6 +344,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
setNodeAddresses(null)
|
||||
setNodeTopology(null)
|
||||
setNodeInfo(null)
|
||||
setNodeStatus(null)
|
||||
setPeers(null)
|
||||
setChequebookAddress(null)
|
||||
setChequebookBalance(null)
|
||||
@@ -339,6 +352,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
setPeerCheques(null)
|
||||
setSettlements(null)
|
||||
setChainState(null)
|
||||
setRedistributionState(null)
|
||||
|
||||
if (beeApi !== null) {
|
||||
refresh()
|
||||
@@ -381,6 +395,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
apiHealth,
|
||||
nodeAddresses,
|
||||
nodeInfo,
|
||||
nodeStatus,
|
||||
topology,
|
||||
chequebookAddress,
|
||||
peers,
|
||||
@@ -391,6 +406,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
settlements,
|
||||
chainState,
|
||||
walletBalance,
|
||||
redistributionState,
|
||||
latestBeeRelease,
|
||||
isLoading,
|
||||
lastUpdate,
|
||||
@@ -405,6 +421,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
apiHealth,
|
||||
nodeAddresses,
|
||||
nodeInfo,
|
||||
nodeStatus,
|
||||
topology,
|
||||
chequebookAddress,
|
||||
peers,
|
||||
@@ -415,6 +432,7 @@ export function Provider({ children }: Props): ReactElement {
|
||||
settlements,
|
||||
chainState,
|
||||
walletBalance,
|
||||
redistributionState,
|
||||
latestBeeRelease,
|
||||
isLoading,
|
||||
lastUpdate,
|
||||
|
||||
@@ -1,11 +1,10 @@
|
||||
import { createContext, ReactElement, ReactNode, useEffect, useState } from 'react'
|
||||
|
||||
import { PREVIEW_DIMENSIONS } from '../constants'
|
||||
import { FileOrigin } from '../pages/files/FileNavigation'
|
||||
import { getMetadata } from '../utils/file'
|
||||
import { resize } from '../utils/image'
|
||||
|
||||
import { FileOrigin } from '@/pages/files/FileNavigation'
|
||||
|
||||
export type UploadOrigin = { origin: FileOrigin.Upload | FileOrigin.Feed; uuid?: string }
|
||||
|
||||
export const defaultUploadOrigin: UploadOrigin = { origin: FileOrigin.Upload }
|
||||
|
||||
@@ -17,6 +17,7 @@ import { UploadLander } from './pages/files/UploadLander'
|
||||
import GiftCards from './pages/giftCode'
|
||||
import Info from './pages/info'
|
||||
import PageNotFound from './pages/notFound/PageNotFound'
|
||||
import RedistributionPage from './pages/redistribution'
|
||||
import LightModeRestart from './pages/restart/LightModeRestart'
|
||||
import Settings from './pages/settings'
|
||||
import { CreatePostageStampPage } from './pages/stamps/CreatePostageStampAdvancedPage'
|
||||
@@ -38,6 +39,7 @@ export enum ROUTES {
|
||||
UPLOAD_IN_PROGRESS = '/files/upload/workflow',
|
||||
DOWNLOAD = '/files/download',
|
||||
HASH = '/files/hash/:hash',
|
||||
REDISTRIBUTION = '/redistribution',
|
||||
SETTINGS = '/settings',
|
||||
STATUS = '/status',
|
||||
TOP_UP = '/account/wallet/top-up',
|
||||
@@ -82,6 +84,7 @@ const BaseRouter = (): ReactElement => {
|
||||
<Route path={ROUTES.SETTINGS} element={<Settings />} />
|
||||
<Route path={ROUTES.STATUS} element={<Status />} />
|
||||
<Route path={ROUTES.INFO} element={<Info />} />
|
||||
<Route path={ROUTES.REDISTRIBUTION} element={<RedistributionPage />} />
|
||||
<Route path={ROUTES.TOP_UP} element={<TopUp />} />
|
||||
<Route path={ROUTES.TOP_UP_CRYPTO} element={<CryptoTopUpIndex />} />
|
||||
<Route path={ROUTES.TOP_UP_CRYPTO_SWAP} element={<Swap header="Top-up with cryptocurrencies" />} />
|
||||
|
||||
+25
-3
@@ -1,5 +1,5 @@
|
||||
import { EthAddress } from '@ethersphere/bee-js'
|
||||
import { getAddress, JsonRpcProvider, Networkish } from 'ethers'
|
||||
import { getAddress, JsonRpcPayload, JsonRpcProvider, JsonRpcResult, Networkish } from 'ethers'
|
||||
|
||||
export const GNOIS_NETWORK_ID = 100
|
||||
export const GnosisNetwork: Networkish = { chainId: GNOIS_NETWORK_ID, name: 'gnosis', ensAddress: undefined }
|
||||
@@ -39,6 +39,28 @@ export function ethAddressString(address: EthAddress | string): string {
|
||||
return typeof address === 'string' ? getAddress(address) : getAddress(address.toHex())
|
||||
}
|
||||
|
||||
export function newGnosisProvider(url: string): JsonRpcProvider {
|
||||
return new JsonRpcProvider(url, GnosisNetwork, { staticNetwork: true })
|
||||
/**
|
||||
* Some RPC endpoints always return id:1 in their JSON-RPC responses regardless of the id in the request.
|
||||
* Ethers v6 validates that response ids match request ids, so we patch them.
|
||||
*/
|
||||
class FixedIdJsonRpcProvider extends JsonRpcProvider {
|
||||
async _send(payload: JsonRpcPayload | Array<JsonRpcPayload>): Promise<Array<JsonRpcResult>> {
|
||||
const results = await super._send(payload)
|
||||
const payloads = Array.isArray(payload) ? payload : [payload]
|
||||
|
||||
return results.map((result, i) => ({ ...result, id: payloads[i]?.id ?? result.id }))
|
||||
}
|
||||
}
|
||||
|
||||
export function newGnosisProvider(url: string): JsonRpcProvider {
|
||||
return new FixedIdJsonRpcProvider(url, GnosisNetwork, { staticNetwork: true, batchMaxCount: 1 })
|
||||
}
|
||||
|
||||
/**
|
||||
* Provider for RPC validation only — no staticNetwork so getNetwork() actually
|
||||
* calls eth_chainId, but still uses FixedIdJsonRpcProvider to handle endpoints
|
||||
* that return a fixed/wrong id in their responses.
|
||||
*/
|
||||
export function newGnosisProviderForValidation(url: string): JsonRpcProvider {
|
||||
return new FixedIdJsonRpcProvider(url, undefined, { batchMaxCount: 1 })
|
||||
}
|
||||
|
||||
@@ -137,3 +137,119 @@ export function packageFile(file: FilePath, pathOverwrite?: string): FilePath {
|
||||
bytes: file.bytes,
|
||||
}
|
||||
}
|
||||
|
||||
export function getExtensionFromName(name: string): string {
|
||||
const ext = name.split('.').pop()?.toLowerCase() || ''
|
||||
const hasExtension = name.includes('.') && ext && ext !== name
|
||||
|
||||
return hasExtension ? ext : ''
|
||||
}
|
||||
|
||||
const EXT_TO_MIME: Record<string, string> = {
|
||||
mp4: 'video/mp4',
|
||||
webm: 'video/webm',
|
||||
ogv: 'video/ogg',
|
||||
mp3: 'audio/mpeg',
|
||||
m4a: 'audio/mp4',
|
||||
aac: 'audio/aac',
|
||||
wav: 'audio/wav',
|
||||
ogg: 'audio/ogg',
|
||||
png: 'image/png',
|
||||
jpg: 'image/jpeg',
|
||||
jpeg: 'image/jpeg',
|
||||
gif: 'image/gif',
|
||||
webp: 'image/webp',
|
||||
avif: 'image/avif',
|
||||
svg: 'image/svg+xml',
|
||||
pdf: 'application/pdf',
|
||||
txt: 'text/plain',
|
||||
md: 'text/markdown',
|
||||
json: 'application/json',
|
||||
csv: 'text/csv',
|
||||
html: 'text/html',
|
||||
htm: 'text/html',
|
||||
ico: 'image/vnd.microsoft.icon',
|
||||
}
|
||||
|
||||
export function guessMime(name: string, mtdt?: Record<string, string> | undefined): { mime: string; ext: string } {
|
||||
const md = mtdt?.mimeType || mtdt?.mime || mtdt?.['content-type']
|
||||
const ext = getExtensionFromName(name)
|
||||
|
||||
if (md) return { mime: md, ext }
|
||||
|
||||
const mime = EXT_TO_MIME[ext] || 'application/octet-stream'
|
||||
|
||||
return { mime, ext }
|
||||
}
|
||||
|
||||
export type Viewer = {
|
||||
name: string
|
||||
test: (mime: string) => boolean
|
||||
render: (win: Window, url: string, mime: string, name: string) => void
|
||||
}
|
||||
|
||||
const VIDEO_HTML = (u: string, title: string) =>
|
||||
`<html><head><meta charset="utf-8"/><title>${title}</title></head><body style="margin:0;background:#000">
|
||||
<video controls autoplay style="width:100%;height:100%" src="${u}"></video>
|
||||
</body></html>`
|
||||
|
||||
const AUDIO_HTML = (u: string, title: string) =>
|
||||
`<html><head><meta charset="utf-8"/><title>${title}</title></head><body>
|
||||
<audio controls autoplay style="width:100%" src="${u}"></audio>
|
||||
</body></html>`
|
||||
|
||||
const IMAGE_HTML = (u: string, title: string) =>
|
||||
`<html><head><meta charset="utf-8"/><title>${title}</title></head><body style="margin:0;background:#111;display:grid;place-items:center;min-height:100vh">
|
||||
<img style="max-width:100%;max-height:100vh" src="${u}" />
|
||||
</body></html>`
|
||||
|
||||
export const VIEWERS: Viewer[] = [
|
||||
{
|
||||
name: 'video',
|
||||
test: m => m.startsWith('video/'),
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.write(VIDEO_HTML(url, name))
|
||||
w.document.title = name
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'audio',
|
||||
test: m => m.startsWith('audio/'),
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.write(AUDIO_HTML(url, name))
|
||||
w.document.title = name
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'image',
|
||||
test: m => m.startsWith('image/'),
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.write(IMAGE_HTML(url, name))
|
||||
w.document.title = name
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'pdf',
|
||||
test: m => m === 'application/pdf',
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.title = name
|
||||
w.location.href = url
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'html',
|
||||
test: m => m === 'text/html',
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.title = name
|
||||
w.location.href = url
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'text-like',
|
||||
test: m => m.startsWith('text/') || m === 'application/json' || m === 'text/markdown',
|
||||
render: (w, url, mime, name) => {
|
||||
w.document.title = name
|
||||
w.location.href = url
|
||||
},
|
||||
},
|
||||
]
|
||||
|
||||
@@ -1,13 +1,14 @@
|
||||
import { BatchId, Bee, NULL_TOPIC, PrivateKey, Reference } from '@ethersphere/bee-js'
|
||||
import { BatchId, Bee, Bytes, NULL_TOPIC, PrivateKey, Reference } from '@ethersphere/bee-js'
|
||||
import { randomBytes, Wallet } from 'ethers'
|
||||
|
||||
import { Identity, IdentityType } from '../providers/Feeds'
|
||||
|
||||
import { LocalStorageKeys } from './localStorage'
|
||||
import { uuidV4, waitUntilStampUsable } from '.'
|
||||
import { waitUntilStampUsable } from './stamp'
|
||||
import { uuidV4 } from '.'
|
||||
|
||||
export function generateWallet(): Wallet {
|
||||
const privateKey = randomBytes(PrivateKey.LENGTH).toString()
|
||||
const privateKey = new Bytes(randomBytes(PrivateKey.LENGTH)).toString()
|
||||
|
||||
return new Wallet(privateKey)
|
||||
}
|
||||
|
||||
+1
-34
@@ -1,4 +1,4 @@
|
||||
import { BatchId, Bee, PostageBatch, Reference } from '@ethersphere/bee-js'
|
||||
import { Reference } from '@ethersphere/bee-js'
|
||||
import { BigNumber } from 'bignumber.js'
|
||||
|
||||
import { BZZ_LINK_DOMAIN } from '../constants'
|
||||
@@ -207,36 +207,3 @@ export function shortenText(text: string, length = 20, separator = '[…]'): str
|
||||
|
||||
return `${text.slice(0, length)}${separator}${text.slice(-length)}`
|
||||
}
|
||||
|
||||
const DEFAULT_POLLING_FREQUENCY = 1_000
|
||||
const DEFAULT_STAMP_USABLE_TIMEOUT = 5 * 60_000
|
||||
|
||||
interface Options {
|
||||
pollingFrequency?: number
|
||||
timeout?: number
|
||||
}
|
||||
|
||||
export function waitUntilStampUsable(batchId: BatchId | string, bee: Bee, options?: Options): Promise<PostageBatch> {
|
||||
return waitForStamp(batchId, bee, options)
|
||||
}
|
||||
|
||||
async function waitForStamp(batchId: BatchId | string, bee: Bee, options?: Options): Promise<PostageBatch> {
|
||||
const timeout = options?.timeout || DEFAULT_STAMP_USABLE_TIMEOUT
|
||||
const pollingFrequency = options?.pollingFrequency || DEFAULT_POLLING_FREQUENCY
|
||||
|
||||
for (let i = 0; i < timeout; i += pollingFrequency) {
|
||||
try {
|
||||
const stamp = await bee.getPostageBatch(batchId)
|
||||
|
||||
if (stamp.usable) {
|
||||
return stamp
|
||||
}
|
||||
} catch {
|
||||
// ignore
|
||||
}
|
||||
|
||||
await sleepMs(pollingFrequency)
|
||||
}
|
||||
|
||||
throw new Error('Wait until stamp usable timeout has been reached')
|
||||
}
|
||||
|
||||
+4
-4
@@ -3,10 +3,10 @@ import { debounce } from '@mui/material'
|
||||
import { Contract, JsonRpcProvider, TransactionReceipt, TransactionResponse, Wallet } from 'ethers'
|
||||
|
||||
import { BZZ_TOKEN_ADDRESS, bzzABI } from './bzzAbi'
|
||||
import { ethAddressString, newGnosisProvider } from './chain'
|
||||
import { ethAddressString, newGnosisProvider, newGnosisProviderForValidation } from './chain'
|
||||
|
||||
async function getNetworkChainId(url: string): Promise<bigint> {
|
||||
const provider = newGnosisProvider(url)
|
||||
const provider = newGnosisProviderForValidation(url)
|
||||
const network = await provider.getNetwork()
|
||||
|
||||
return network.chainId
|
||||
@@ -84,7 +84,7 @@ export async function sendNativeTransaction(
|
||||
const feedData = await signer.provider.getFeeData()
|
||||
const gasPrice = externalGasPrice ?? DAI.fromWei(feedData.gasPrice?.toString() || '0')
|
||||
const transaction = await signer.sendTransaction({
|
||||
to: to.toHex(),
|
||||
to: to.toChecksum(),
|
||||
value: BigInt(value.toWeiString()),
|
||||
gasPrice: BigInt(gasPrice.toWeiString()),
|
||||
gasLimit: BigInt(21000),
|
||||
@@ -117,7 +117,7 @@ export async function sendBzzTransaction(
|
||||
const feeData = await signer.provider.getFeeData()
|
||||
const gasPrice = feeData.gasPrice || BigInt(0)
|
||||
const bzz = new Contract(BZZ_TOKEN_ADDRESS, bzzABI, signer)
|
||||
const transaction = await bzz.transfer(to.toChecksum(), value, { gasPrice })
|
||||
const transaction = await bzz.transfer(to.toChecksum(), value.toPLURBigInt(), { gasPrice })
|
||||
const receipt = await transaction.wait(1)
|
||||
|
||||
if (!receipt) {
|
||||
|
||||
@@ -0,0 +1,63 @@
|
||||
import { BatchId, Bee, PostageBatch } from '@ethersphere/bee-js'
|
||||
import BigNumber from 'bignumber.js'
|
||||
|
||||
import { MAX_STAMP_DEPTH, MIN_STAMP_DEPTH } from '../constants'
|
||||
|
||||
import { sleepMs } from '.'
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
export function validateDepthInput(depthInput: string, onError: (v: any) => void, onSuccess: (v: any) => void) {
|
||||
let validDepthInput = '0'
|
||||
|
||||
if (!depthInput) {
|
||||
onError('Required field')
|
||||
} else {
|
||||
const depth = new BigNumber(depthInput)
|
||||
|
||||
if (!depth.isInteger()) {
|
||||
onError('Depth must be an integer')
|
||||
} else if (depth.isLessThan(MIN_STAMP_DEPTH)) {
|
||||
onError(`Minimal depth is ${MIN_STAMP_DEPTH}`)
|
||||
} else if (depth.isGreaterThan(MAX_STAMP_DEPTH)) {
|
||||
onError(`Depth has to be at most ${MAX_STAMP_DEPTH}`)
|
||||
} else {
|
||||
onError('')
|
||||
validDepthInput = depthInput
|
||||
}
|
||||
}
|
||||
|
||||
onSuccess(validDepthInput)
|
||||
}
|
||||
|
||||
const DEFAULT_POLLING_FREQUENCY = 1_000
|
||||
const DEFAULT_STAMP_USABLE_TIMEOUT = 5 * 60_000
|
||||
|
||||
interface Options {
|
||||
pollingFrequency?: number
|
||||
timeout?: number
|
||||
}
|
||||
|
||||
export function waitUntilStampUsable(batchId: BatchId | string, bee: Bee, options?: Options): Promise<PostageBatch> {
|
||||
return waitForStamp(batchId, bee, options)
|
||||
}
|
||||
|
||||
async function waitForStamp(batchId: BatchId | string, bee: Bee, options?: Options): Promise<PostageBatch> {
|
||||
const timeout = options?.timeout || DEFAULT_STAMP_USABLE_TIMEOUT
|
||||
const pollingFrequency = options?.pollingFrequency || DEFAULT_POLLING_FREQUENCY
|
||||
|
||||
for (let i = 0; i < timeout; i += pollingFrequency) {
|
||||
try {
|
||||
const stamp = await bee.getPostageBatch(batchId)
|
||||
|
||||
if (stamp.usable) {
|
||||
return stamp
|
||||
}
|
||||
} catch {
|
||||
// ignore
|
||||
}
|
||||
|
||||
await sleepMs(pollingFrequency)
|
||||
}
|
||||
|
||||
throw new Error('Wait until stamp usable timeout has been reached')
|
||||
}
|
||||
+52
-4
@@ -1,6 +1,6 @@
|
||||
import { BZZ } from '@ethersphere/bee-js'
|
||||
import { BZZ, DAI } from '@ethersphere/bee-js'
|
||||
|
||||
import { sendBzzTransaction } from '../../src/utils/rpc'
|
||||
import { sendBzzTransaction, sendNativeTransaction } from '../../src/utils/rpc'
|
||||
|
||||
interface MockProvider {
|
||||
getFeeData: jest.Mock
|
||||
@@ -11,12 +11,14 @@ const mockWait = jest.fn()
|
||||
const mockTransfer = jest.fn()
|
||||
const mockGetFeeData = jest.fn()
|
||||
const mockGetNetwork = jest.fn()
|
||||
const mockSendTransaction = jest.fn()
|
||||
const mockProvider: MockProvider = {
|
||||
getFeeData: mockGetFeeData,
|
||||
getNetwork: mockGetNetwork,
|
||||
}
|
||||
|
||||
const value = BZZ.fromDecimalString('1')
|
||||
const bzzValue = BZZ.fromDecimalString('1')
|
||||
const daiValue = DAI.fromDecimalString('1')
|
||||
const privateKey = 'FFFF000000000000000000000000000000000000000000000000000000000000'
|
||||
const jsonRpcProvider = 'http://mock-json-rpc-provider'
|
||||
|
||||
@@ -39,6 +41,7 @@ jest.mock('ethers', () => {
|
||||
|
||||
class Wallet {
|
||||
provider: MockProvider
|
||||
sendTransaction = mockSendTransaction
|
||||
|
||||
constructor(_privateKey: string, provider: MockProvider) {
|
||||
this.provider = provider
|
||||
@@ -64,8 +67,53 @@ describe('sendBzzTransaction', () => {
|
||||
})
|
||||
|
||||
it.each(addresses)('sendBzzTransaction to address: %s', async (address: string) => {
|
||||
await sendBzzTransaction(privateKey, address, value, jsonRpcProvider)
|
||||
await sendBzzTransaction(privateKey, address, bzzValue, jsonRpcProvider)
|
||||
const to = mockTransfer.mock.calls[0][0] as string
|
||||
expect(to.startsWith('0x')).toBe(true)
|
||||
})
|
||||
|
||||
it('passes BZZ value as bigint (not BZZ object)', async () => {
|
||||
await sendBzzTransaction(privateKey, '0x52908400098527886e0f7030069857d2e4169ee7', bzzValue, jsonRpcProvider)
|
||||
const transferredValue = mockTransfer.mock.calls[0][1]
|
||||
expect(typeof transferredValue).toBe('bigint')
|
||||
expect(transferredValue).toBe(bzzValue.toPLURBigInt())
|
||||
})
|
||||
})
|
||||
|
||||
describe('sendNativeTransaction', () => {
|
||||
const addresses = ['52908400098527886e0f7030069857d2e4169ee7', '0x52908400098527886e0f7030069857d2e4169ee7']
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks()
|
||||
mockWait.mockResolvedValue({ status: 1 })
|
||||
mockSendTransaction.mockResolvedValue({ wait: mockWait })
|
||||
mockGetFeeData.mockResolvedValue({ gasPrice: BigInt(1) })
|
||||
mockGetNetwork.mockResolvedValue({ chainId: BigInt(100) })
|
||||
})
|
||||
|
||||
it.each(addresses)('sendNativeTransaction to address: %s passes 0x-prefixed address', async (address: string) => {
|
||||
await sendNativeTransaction(privateKey, address, daiValue, jsonRpcProvider)
|
||||
const tx = mockSendTransaction.mock.calls[0][0] as { to: string }
|
||||
expect(tx.to.startsWith('0x')).toBe(true)
|
||||
})
|
||||
|
||||
it('passes DAI value as bigint', async () => {
|
||||
await sendNativeTransaction(privateKey, '0x52908400098527886e0f7030069857d2e4169ee7', daiValue, jsonRpcProvider)
|
||||
const tx = mockSendTransaction.mock.calls[0][0] as { value: bigint }
|
||||
expect(typeof tx.value).toBe('bigint')
|
||||
expect(tx.value).toBe(BigInt(daiValue.toWeiString()))
|
||||
})
|
||||
|
||||
it('uses externalGasPrice when provided', async () => {
|
||||
const externalGasPrice = DAI.fromWei('9999')
|
||||
await sendNativeTransaction(
|
||||
privateKey,
|
||||
'0x52908400098527886e0f7030069857d2e4169ee7',
|
||||
daiValue,
|
||||
jsonRpcProvider,
|
||||
externalGasPrice,
|
||||
)
|
||||
const tx = mockSendTransaction.mock.calls[0][0] as { gasPrice: bigint }
|
||||
expect(tx.gasPrice).toBe(BigInt(externalGasPrice.toWeiString()))
|
||||
})
|
||||
})
|
||||
|
||||
+1
-1
@@ -59,7 +59,7 @@ export default defineConfig(({ mode }) => {
|
||||
plugins: [
|
||||
react(),
|
||||
nodePolyfills({
|
||||
include: ['util', 'buffer'],
|
||||
include: ['util', 'buffer', 'stream'],
|
||||
globals: {
|
||||
Buffer: true,
|
||||
global: true,
|
||||
|
||||
Reference in New Issue
Block a user