woggioni-opencode-agent/bee-dashboard
1
0
Fork 0
Code Actions Packages Releases Activity

chore(deps): update react router from v5 to v6 (#280)

Browse Source 
* chore(deps): update react router from v5 to v6

* fix: correctly choose navigate target if there is no history
This commit is contained in:
Vojtech Simetka
2022-01-17 14:47:26 +01:00
committed by GitHub
parent 2187b9001c
commit a90b4c439b
18 changed files with 110 additions and 246 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+31 -158
View File
@@ -31,8 +31,8 @@
"react-dom": ">= 17.0.2",
"react-feather": "2.0.9",
"react-identicons": "1.2.5",
"react-router": "5.2.0",
"react-router-dom": "5.2.0",
"react-router": "6.2.1",
"react-router-dom": "6.2.1",
"react-syntax-highlighter": "15.4.4",
"semver": "7.3.5",
"serve-handler": "6.1.3"
@@ -11867,16 +11867,11 @@
}
},
"node_modules/history": {
"version": "4.10.1",
"resolved": "https://registry.npmjs.org/history/-/history-4.10.1.tgz",
"integrity": "sha512-36nwAD620w12kuzPAsyINPWJqlNbij+hpK1k9XRloDtym8mxzGYl2c17LnV6IAGB2Dmg4tEa7G7DlawS0+qjew==",
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/history/-/history-5.2.0.tgz",
"integrity": "sha512-uPSF6lAJb3nSePJ43hN3eKj1dTWpN9gMod0ZssbFTIsen+WehTmEadgL+kg78xLJFdRfrrC//SavDzmRVdE+Ig==",
"dependencies": {
"@babel/runtime": "^7.1.2",
"loose-envify": "^1.2.0",
"resolve-pathname": "^3.0.0",
"tiny-invariant": "^1.0.2",
"tiny-warning": "^1.0.0",
"value-equal": "^1.0.1"
"@babel/runtime": "^7.7.6"
}
},
"node_modules/hmac-drbg": {
@@ -13220,11 +13215,6 @@
"node": ">=8"
}
},
"node_modules/isarray": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
"integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
},
"node_modules/isexe": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
@@ -16287,19 +16277,6 @@
"node": ">=4"
}
},
"node_modules/mini-create-react-context": {
"version": "0.4.1",
"resolved": "https://registry.npmjs.org/mini-create-react-context/-/mini-create-react-context-0.4.1.tgz",
"integrity": "sha512-YWCYEmd5CQeHGSAKrYvXgmzzkrvssZcuuQDDeqkT+PziKGMgE+0MCCtcKbROzocGBG1meBLl2FotlRwf4gAzbQ==",
"dependencies": {
"@babel/runtime": "^7.12.1",
"tiny-warning": "^1.0.3"
},
"peerDependencies": {
"prop-types": "^15.0.0",
"react": "^0.14.0 || ^15.0.0 || ^16.0.0 || ^17.0.0"
}
},
"node_modules/mini-css-extract-plugin": {
"version": "0.11.3",
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.11.3.tgz",
@@ -17523,14 +17500,6 @@
"integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
"dev": true
},
"node_modules/path-to-regexp": {
"version": "1.8.0",
"resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz",
"integrity": "sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==",
"dependencies": {
"isarray": "0.0.1"
}
},
"node_modules/path-type": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
@@ -21899,47 +21868,29 @@
}
},
"node_modules/react-router": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.0.tgz",
"integrity": "sha512-smz1DUuFHRKdcJC0jobGo8cVbhO3x50tCL4icacOlcwDOEQPq4TMqwx3sY1TP+DvtTgz4nm3thuo7A+BK2U0Dw==",
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.2.1.tgz",
"integrity": "sha512-2fG0udBtxou9lXtK97eJeET2ki5//UWfQSl1rlJ7quwe6jrktK9FCCc8dQb5QY6jAv3jua8bBQRhhDOM/kVRsg==",
"dependencies": {
"@babel/runtime": "^7.1.2",
"history": "^4.9.0",
"hoist-non-react-statics": "^3.1.0",
"loose-envify": "^1.3.1",
"mini-create-react-context": "^0.4.0",
"path-to-regexp": "^1.7.0",
"prop-types": "^15.6.2",
"react-is": "^16.6.0",
"tiny-invariant": "^1.0.2",
"tiny-warning": "^1.0.0"
"history": "^5.2.0"
},
"peerDependencies": {
"react": ">=15"
"react": ">=16.8"
}
},
"node_modules/react-router-dom": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.2.0.tgz",
"integrity": "sha512-gxAmfylo2QUjcwxI63RhQ5G85Qqt4voZpUXSEqCwykV0baaOTQDR1f0PmY8AELqIyVc0NEZUj0Gov5lNGcXgsA==",
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.2.1.tgz",
"integrity": "sha512-I6Zax+/TH/cZMDpj3/4Fl2eaNdcvoxxHoH1tYOREsQ22OKDYofGebrNm6CTPUcvLvZm63NL/vzCYdjf9CUhqmA==",
"dependencies": {
"@babel/runtime": "^7.1.2",
"history": "^4.9.0",
"loose-envify": "^1.3.1",
"prop-types": "^15.6.2",
"react-router": "5.2.0",
"tiny-invariant": "^1.0.2",
"tiny-warning": "^1.0.0"
"history": "^5.2.0",
"react-router": "6.2.1"
},
"peerDependencies": {
"react": ">=15"
"react": ">=16.8",
"react-dom": ">=16.8"
}
},
"node_modules/react-router/node_modules/react-is": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
},
"node_modules/react-scripts": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-4.0.3.tgz",
@@ -22636,11 +22587,6 @@
"node": ">=4"
}
},
"node_modules/resolve-pathname": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/resolve-pathname/-/resolve-pathname-3.0.0.tgz",
"integrity": "sha512-C7rARubxI8bXFNB/hqcp/4iUeIXJhJZvFPFPiSPRnhU5UPxzMFIl+2E6yY6c4k9giDJAhtV+enfA+G89N6Csng=="
},
"node_modules/resolve-url": {
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
@@ -25523,11 +25469,6 @@
"integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=",
"dev": true
},
"node_modules/tiny-invariant": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.2.0.tgz",
"integrity": "sha512-1Uhn/aqw5C6RI4KejVeTg6mIS7IqxnLJ8Mv2tV5rTc0qWobay7pDUz6Wi392Cnc8ak1H0F2cjoRzb2/AW4+Fvg=="
},
"node_modules/tiny-warning": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
@@ -26326,11 +26267,6 @@
"spdx-expression-parse": "^3.0.0"
}
},
"node_modules/value-equal": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/value-equal/-/value-equal-1.0.1.tgz",
"integrity": "sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw=="
},
"node_modules/vary": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
@@ -37639,16 +37575,11 @@
"integrity": "sha512-tzcUFauisWKNHaRkN4Wjl/ZA07gENAjFl3J/c480dprkGTg5EQstgaNFqBfUqCq54kZRIEcreTsAgF/m2quD7A=="
},
"history": {
"version": "4.10.1",
"resolved": "https://registry.npmjs.org/history/-/history-4.10.1.tgz",
"integrity": "sha512-36nwAD620w12kuzPAsyINPWJqlNbij+hpK1k9XRloDtym8mxzGYl2c17LnV6IAGB2Dmg4tEa7G7DlawS0+qjew==",
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/history/-/history-5.2.0.tgz",
"integrity": "sha512-uPSF6lAJb3nSePJ43hN3eKj1dTWpN9gMod0ZssbFTIsen+WehTmEadgL+kg78xLJFdRfrrC//SavDzmRVdE+Ig==",
"requires": {
"@babel/runtime": "^7.1.2",
"loose-envify": "^1.2.0",
"resolve-pathname": "^3.0.0",
"tiny-invariant": "^1.0.2",
"tiny-warning": "^1.0.0",
"value-equal": "^1.0.1"
"@babel/runtime": "^7.7.6"
}
},
"hmac-drbg": {
@@ -38664,11 +38595,6 @@
"is-docker": "^2.0.0"
}
},
"isarray": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
"integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
},
"isexe": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
@@ -41131,15 +41057,6 @@
"integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==",
"dev": true
},
"mini-create-react-context": {
"version": "0.4.1",
"resolved": "https://registry.npmjs.org/mini-create-react-context/-/mini-create-react-context-0.4.1.tgz",
"integrity": "sha512-YWCYEmd5CQeHGSAKrYvXgmzzkrvssZcuuQDDeqkT+PziKGMgE+0MCCtcKbROzocGBG1meBLl2FotlRwf4gAzbQ==",
"requires": {
"@babel/runtime": "^7.12.1",
"tiny-warning": "^1.0.3"
}
},
"mini-css-extract-plugin": {
"version": "0.11.3",
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.11.3.tgz",
@@ -42109,14 +42026,6 @@
"integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
"dev": true
},
"path-to-regexp": {
"version": "1.8.0",
"resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz",
"integrity": "sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==",
"requires": {
"isarray": "0.0.1"
}
},
"path-type": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
@@ -45497,41 +45406,20 @@
"dev": true
},
"react-router": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.0.tgz",
"integrity": "sha512-smz1DUuFHRKdcJC0jobGo8cVbhO3x50tCL4icacOlcwDOEQPq4TMqwx3sY1TP+DvtTgz4nm3thuo7A+BK2U0Dw==",
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.2.1.tgz",
"integrity": "sha512-2fG0udBtxou9lXtK97eJeET2ki5//UWfQSl1rlJ7quwe6jrktK9FCCc8dQb5QY6jAv3jua8bBQRhhDOM/kVRsg==",
"requires": {
"@babel/runtime": "^7.1.2",
"history": "^4.9.0",
"hoist-non-react-statics": "^3.1.0",
"loose-envify": "^1.3.1",
"mini-create-react-context": "^0.4.0",
"path-to-regexp": "^1.7.0",
"prop-types": "^15.6.2",
"react-is": "^16.6.0",
"tiny-invariant": "^1.0.2",
"tiny-warning": "^1.0.0"
},
"dependencies": {
"react-is": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
}
"history": "^5.2.0"
}
},
"react-router-dom": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.2.0.tgz",
"integrity": "sha512-gxAmfylo2QUjcwxI63RhQ5G85Qqt4voZpUXSEqCwykV0baaOTQDR1f0PmY8AELqIyVc0NEZUj0Gov5lNGcXgsA==",
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.2.1.tgz",
"integrity": "sha512-I6Zax+/TH/cZMDpj3/4Fl2eaNdcvoxxHoH1tYOREsQ22OKDYofGebrNm6CTPUcvLvZm63NL/vzCYdjf9CUhqmA==",
"requires": {
"@babel/runtime": "^7.1.2",
"history": "^4.9.0",
"loose-envify": "^1.3.1",
"prop-types": "^15.6.2",
"react-router": "5.2.0",
"tiny-invariant": "^1.0.2",
"tiny-warning": "^1.0.0"
"history": "^5.2.0",
"react-router": "6.2.1"
}
},
"react-scripts": {
@@ -46074,11 +45962,6 @@
"integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
"dev": true
},
"resolve-pathname": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/resolve-pathname/-/resolve-pathname-3.0.0.tgz",
"integrity": "sha512-C7rARubxI8bXFNB/hqcp/4iUeIXJhJZvFPFPiSPRnhU5UPxzMFIl+2E6yY6c4k9giDJAhtV+enfA+G89N6Csng=="
},
"resolve-url": {
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
@@ -48406,11 +48289,6 @@
"integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=",
"dev": true
},
"tiny-invariant": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.2.0.tgz",
"integrity": "sha512-1Uhn/aqw5C6RI4KejVeTg6mIS7IqxnLJ8Mv2tV5rTc0qWobay7pDUz6Wi392Cnc8ak1H0F2cjoRzb2/AW4+Fvg=="
},
"tiny-warning": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
@@ -49034,11 +48912,6 @@
"spdx-expression-parse": "^3.0.0"
}
},
"value-equal": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/value-equal/-/value-equal-1.0.1.tgz",
"integrity": "sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw=="
},
"vary": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
package.json
+2 -2
View File
@@ -48,8 +48,8 @@
"react-dom": ">= 17.0.2",
"react-feather": "2.0.9",
"react-identicons": "1.2.5",
"react-router": "5.2.0",
"react-router-dom": "5.2.0",
"react-router": "6.2.1",
"react-router-dom": "6.2.1",
"react-syntax-highlighter": "15.4.4",
"semver": "7.3.5",
"serve-handler": "6.1.3"
src/components/ExpandableListItemLink.tsx
+3 -3
View File
@@ -3,7 +3,7 @@ import { createStyles, makeStyles, Theme } from '@material-ui/core/styles'
import { ArrowForward, OpenInNewSharp } from '@material-ui/icons'
import { ReactElement, useState } from 'react'
import CopyToClipboard from 'react-copy-to-clipboard'
import { useHistory } from 'react-router'
import { useNavigate } from 'react-router'
const useStyles = makeStyles((theme: Theme) =>
createStyles({
@@ -61,7 +61,7 @@ export default function ExpandableListItemLink({
}: Props): ReactElement | null {
const classes = useStyles()
const [copied, setCopied] = useState(false)
const history = useHistory()
const navigate = useNavigate()
const tooltipClickHandler = () => setCopied(true)
const tooltipCloseHandler = () => setCopied(false)
@@ -72,7 +72,7 @@ export default function ExpandableListItemLink({
if (navigationType === 'NEW_WINDOW') {
window.open(link || value)
} else {
history.push(link || value)
navigate(link || value)
}
}
src/components/HistoryHeader.tsx
+3 -3
View File
@@ -1,7 +1,7 @@
import { Box, createStyles, Grid, makeStyles, Typography } from '@material-ui/core'
import { ArrowBack } from '@material-ui/icons'
import { ReactElement } from 'react'
import { useHistory } from 'react-router-dom'
import { useNavigate } from 'react-router-dom'
interface Props {
children: string
@@ -20,10 +20,10 @@ const useStyles = makeStyles(() =>
export function HistoryHeader({ children }: Props): ReactElement {
const classes = useStyles()
const history = useHistory()
const navigate = useNavigate()
function goBack() {
history.goBack()
navigate(-1)
}
return (
src/components/SideBarItem.tsx
+1 -1
View File
@@ -50,7 +50,7 @@ interface Props {
export default function SideBarItem({ iconStart, iconEnd, path, label }: Props): ReactElement {
const classes = useStyles()
const location = useLocation()
const isSelected = Boolean(matchPath(location.pathname, { path, exact: true }))
const isSelected = Boolean(path && matchPath(location.pathname, path))
return (
<StyledListItem button selected={isSelected} disableRipple>
src/components/SideBarStatus.tsx
+1 -1
View File
@@ -56,7 +56,7 @@ export default function SideBarItem({ path }: Props): ReactElement {
const { status, isLoading } = useContext(Context)
const classes = useStyles()
const location = useLocation()
const isSelected = Boolean(matchPath(location.pathname, { path, exact: true }))
const isSelected = Boolean(path && matchPath(location.pathname, path))
return (
<ListItem
src/pages/feeds/CreateNewFeed.tsx
+4 -4
View File
@@ -3,7 +3,7 @@ import { Form, Formik } from 'formik'
import { useSnackbar } from 'notistack'
import { ReactElement, useContext, useState } from 'react'
import { Check, X } from 'react-feather'
import { useHistory } from 'react-router'
import { useNavigate } from 'react-router'
import { DocumentationText } from '../../components/DocumentationText'
import ExpandableListItemActions from '../../components/ExpandableListItemActions'
import ExpandableListItemKey from '../../components/ExpandableListItemKey'
@@ -34,7 +34,7 @@ export default function CreateNewFeed(): ReactElement {
const [loading, setLoading] = useState(false)
const { enqueueSnackbar } = useSnackbar()
const history = useHistory()
const navigate = useNavigate()
async function onSubmit(values: FormValues) {
setLoading(true)
@@ -65,12 +65,12 @@ export default function CreateNewFeed(): ReactElement {
const identity = await convertWalletToIdentity(wallet, values.type, values.identityName, values.password)
persistIdentity(identities, identity)
setIdentities(identities)
history.push(ROUTES.FEEDS)
navigate(ROUTES.FEEDS)
setLoading(false)
}
function cancel() {
history.goBack()
navigate(-1)
}
return (
src/pages/feeds/FeedSubpage.tsx
+6 -10
View File
@@ -2,7 +2,7 @@ import * as swarmCid from '@ethersphere/swarm-cid'
import { Box } from '@material-ui/core'
import { ReactElement, useContext, useEffect, useState } from 'react'
import { X } from 'react-feather'
import { RouteComponentProps, useHistory } from 'react-router-dom'
import { useParams, useNavigate } from 'react-router-dom'
import { DocumentationText } from '../../components/DocumentationText'
import ExpandableListItemActions from '../../components/ExpandableListItemActions'
import ExpandableListItemKey from '../../components/ExpandableListItemKey'
@@ -15,20 +15,16 @@ import { Context as SettingsContext } from '../../providers/Settings'
import { ROUTES } from '../../routes'
import { UploadArea } from '../files/UploadArea'
interface MatchParams {
uuid: string
}
export function FeedSubpage(props: RouteComponentProps<MatchParams>): ReactElement {
export function FeedSubpage(): ReactElement {
const { identities } = useContext(IdentityContext)
const { uuid } = useParams()
const { beeApi } = useContext(SettingsContext)
const { status } = useContext(BeeContext)
const history = useHistory()
const navigate = useNavigate()
const [available, setAvailable] = useState(false)
const uuid = props.match.params.uuid
const identity = identities.find(x => x.uuid === uuid)
useEffect(() => {
@@ -44,13 +40,13 @@ export function FeedSubpage(props: RouteComponentProps<MatchParams>): ReactEleme
}, [beeApi, uuid, identity])
if (!identity || !status.all) {
history.replace(ROUTES.FEEDS)
navigate(ROUTES.FEEDS, { replace: true })
return <></>
}
function onClose() {
history.push(ROUTES.FEEDS)
navigate(ROUTES.FEEDS)
}
return (
src/pages/feeds/UpdateFeed.tsx
+7 -10
View File
@@ -2,7 +2,7 @@ import { Box, Grid, Typography } from '@material-ui/core'
import { useSnackbar } from 'notistack'
import { ReactElement, useContext, useEffect, useState } from 'react'
import { Bookmark, X } from 'react-feather'
import { RouteComponentProps, useHistory } from 'react-router'
import { useParams, useNavigate } from 'react-router'
import ExpandableListItemActions from '../../components/ExpandableListItemActions'
import { HistoryHeader } from '../../components/HistoryHeader'
import { SwarmButton } from '../../components/SwarmButton'
@@ -16,15 +16,12 @@ import { ROUTES } from '../../routes'
import { persistIdentity, updateFeed } from '../../utils/identity'
import { FeedPasswordDialog } from './FeedPasswordDialog'
interface MatchParams {
hash: string
}
export default function UpdateFeed(props: RouteComponentProps<MatchParams>): ReactElement {
export default function UpdateFeed(): ReactElement {
const { identities, setIdentities } = useContext(IdentityContext)
const { beeApi, beeDebugApi } = useContext(SettingsContext)
const { stamps, refresh } = useContext(StampContext)
const { status } = useContext(BeeContext)
const { hash } = useParams()
const [selectedStamp, setSelectedStamp] = useState<string | null>(null)
const [selectedIdentity, setSelectedIdentity] = useState<Identity | null>(null)
@@ -32,7 +29,7 @@ export default function UpdateFeed(props: RouteComponentProps<MatchParams>): Rea
const { enqueueSnackbar } = useSnackbar()
const [showPasswordPrompt, setShowPasswordPrompt] = useState(false)
const history = useHistory()
const navigate = useNavigate()
useEffect(() => {
refresh()
@@ -50,7 +47,7 @@ export default function UpdateFeed(props: RouteComponentProps<MatchParams>): Rea
}
function onCancel() {
history.goBack()
navigate(-1)
}
function onBeginUpdatingFeed() {
@@ -76,10 +73,10 @@ export default function UpdateFeed(props: RouteComponentProps<MatchParams>): Rea
}
try {
await updateFeed(beeApi, identity, props.match.params.hash, selectedStamp, password as string)
await updateFeed(beeApi, identity, hash!, selectedStamp, password as string) // eslint-disable-line
persistIdentity(identities, identity)
setIdentities([...identities])
history.push(ROUTES.FEEDS_PAGE.replace(':uuid', identity.uuid))
navigate(ROUTES.FEEDS_PAGE.replace(':uuid', identity.uuid))
} catch (error: unknown) {
setLoading(false)
src/pages/feeds/index.tsx
+4 -4
View File
@@ -1,7 +1,7 @@
import { Box, Typography } from '@material-ui/core'
import { ReactElement, useContext, useState } from 'react'
import { Download, Info, PlusSquare, Trash } from 'react-feather'
import { useHistory } from 'react-router'
import { useNavigate } from 'react-router'
import ExpandableList from '../../components/ExpandableList'
import ExpandableListItem from '../../components/ExpandableListItem'
import ExpandableListItemActions from '../../components/ExpandableListItemActions'
@@ -20,7 +20,7 @@ export default function Feeds(): ReactElement {
const { identities, setIdentities } = useContext(IdentityContext)
const { status } = useContext(BeeContext)
const history = useHistory()
const navigate = useNavigate()
const [selectedIdentity, setSelectedIdentity] = useState<Identity | null>(null)
const [showImport, setShowImport] = useState(false)
@@ -28,11 +28,11 @@ export default function Feeds(): ReactElement {
const [showDelete, setShowDelete] = useState(false)
function createNewFeed() {
return history.push(ROUTES.FEEDS_NEW)
return navigate(ROUTES.FEEDS_NEW)
}
function viewFeed(uuid: string) {
history.push(ROUTES.FEEDS_PAGE.replace(':uuid', uuid))
navigate(ROUTES.FEEDS_PAGE.replace(':uuid', uuid))
}
function onDialogClose() {
src/pages/files/Download.tsx
+3 -3
View File
@@ -2,7 +2,7 @@ import { Utils } from '@ethersphere/bee-js'
import { ManifestJs } from '@ethersphere/manifest-js'
import { useSnackbar } from 'notistack'
import { ReactElement, useContext, useState } from 'react'
import { useHistory } from 'react-router-dom'
import { useNavigate } from 'react-router-dom'
import ExpandableListItemInput from '../../components/ExpandableListItemInput'
import { History } from '../../components/History'
import { Context, defaultUploadOrigin } from '../../providers/File'
@@ -20,7 +20,7 @@ export function Download(): ReactElement {
const { setUploadOrigin } = useContext(Context)
const { enqueueSnackbar } = useSnackbar()
const history = useHistory()
const navigate = useNavigate()
const validateChange = (value: string) => {
if (Utils.isHexString(value, 64) || Utils.isHexString(value, 128) || !value.trim().length) {
@@ -54,7 +54,7 @@ export function Download(): ReactElement {
const indexDocument = await manifestJs.getIndexDocumentPath(identifier)
putHistory(HISTORY_KEYS.DOWNLOAD_HISTORY, identifier, determineHistoryName(identifier, indexDocument))
setUploadOrigin(defaultUploadOrigin)
history.push(ROUTES.HASH.replace(':hash', identifier))
navigate(ROUTES.HASH.replace(':hash', identifier))
} catch (error: unknown) {
let message = typeof error === 'object' && error !== null && Reflect.get(error, 'message')
src/pages/files/FileNavigation.tsx
+3 -3
View File
@@ -1,6 +1,6 @@
import { createStyles, makeStyles, Tab, Tabs, Theme } from '@material-ui/core'
import { ReactElement } from 'react'
import { useHistory } from 'react-router-dom'
import { useNavigate } from 'react-router-dom'
import { ROUTES } from '../../routes'
interface Props {
@@ -24,10 +24,10 @@ const useStyles = makeStyles((theme: Theme) =>
export function FileNavigation({ active }: Props): ReactElement {
const classes = useStyles()
const history = useHistory()
const navigate = useNavigate()
function onChange(event: React.ChangeEvent<Record<string, never>>, newValue: number) {
history.push(newValue === 1 ? ROUTES.DOWNLOAD : ROUTES.UPLOAD)
navigate(newValue === 1 ? ROUTES.DOWNLOAD : ROUTES.UPLOAD)
}
return (
src/pages/files/Share.tsx
+11 -13
View File
@@ -4,7 +4,7 @@ import { saveAs } from 'file-saver'
import JSZip from 'jszip'
import { useSnackbar } from 'notistack'
import { ReactElement, useContext, useEffect, useState } from 'react'
import { RouteComponentProps, useHistory } from 'react-router-dom'
import { useParams, useNavigate } from 'react-router-dom'
import { HistoryHeader } from '../../components/HistoryHeader'
import { Loading } from '../../components/Loading'
import TroubleshootConnectionCard from '../../components/TroubleshootConnectionCard'
@@ -19,17 +19,14 @@ import { AssetPreview } from './AssetPreview'
import { AssetSummary } from './AssetSummary'
import { DownloadActionBar } from './DownloadActionBar'
interface MatchParams {
hash: string
}
export function Share(props: RouteComponentProps<MatchParams>): ReactElement {
export function Share(): ReactElement {
const { apiUrl, beeApi } = useContext(SettingsContext)
const { status } = useContext(BeeContext)
const reference = props.match.params.hash
const { hash } = useParams()
const reference = hash! // eslint-disable-line
const history = useHistory()
const navigate = useNavigate()
const { enqueueSnackbar } = useSnackbar()
const [loading, setLoading] = useState(true)
@@ -71,16 +68,17 @@ export function Share(props: RouteComponentProps<MatchParams>): ReactElement {
}
function onClose() {
// POP means there is no history - nowhere to go back yet
if (history.action === 'POP') {
history.push(ROUTES.UPLOAD)
if (navigate.length > 0) {
// There is at least one different route in browser history that we can return to
navigate(-1)
} else {
history.goBack()
// This is the first page user opened, navigate to upload page instead of going back
navigate(ROUTES.UPLOAD)
}
}
function onUpdateFeed() {
history.push(ROUTES.FEEDS_UPDATE.replace(':hash', reference))
navigate(ROUTES.FEEDS_UPDATE.replace(':hash', reference))
}
useEffect(() => {
src/pages/files/Upload.tsx
+5 -5
View File
@@ -1,7 +1,7 @@
import { Box } from '@material-ui/core'
import { useSnackbar } from 'notistack'
import { ReactElement, useContext, useEffect, useState } from 'react'
import { useHistory } from 'react-router-dom'
import { useNavigate } from 'react-router-dom'
import { DocumentationText } from '../../components/DocumentationText'
import { HistoryHeader } from '../../components/HistoryHeader'
import { ProgressIndicator } from '../../components/ProgressIndicator'
@@ -36,7 +36,7 @@ export function Upload(): ReactElement {
const { status } = useContext(BeeContext)
const { enqueueSnackbar } = useSnackbar()
const history = useHistory()
const navigate = useNavigate()
useEffect(() => {
refresh()
@@ -46,7 +46,7 @@ export function Upload(): ReactElement {
if (!files.length) {
setFiles([])
history.replace(ROUTES.UPLOAD)
navigate(ROUTES.UPLOAD, { replace: true })
return <></>
}
@@ -80,12 +80,12 @@ export function Upload(): ReactElement {
putHistory(HISTORY_KEYS.UPLOAD_HISTORY, hash.reference, getAssetNameFromFiles(files))
if (uploadOrigin.origin === 'UPLOAD') {
history.replace(ROUTES.HASH.replace(':hash', hash.reference))
navigate(ROUTES.HASH.replace(':hash', hash.reference), { replace: true })
} else {
updateFeed(beeApi, identity as Identity, hash.reference, stamp.batchID, password as string).then(() => {
persistIdentity(identities, identity as Identity)
setIdentities([...identities])
history.replace(ROUTES.FEEDS_PAGE.replace(':uuid', uploadOrigin.uuid as string))
navigate(ROUTES.FEEDS_PAGE.replace(':uuid', uploadOrigin.uuid as string), { replace: true })
})
}
})
src/pages/files/UploadArea.tsx
+3 -3
View File
@@ -3,7 +3,7 @@ import { DropzoneArea } from 'material-ui-dropzone'
import { useSnackbar } from 'notistack'
import { ReactElement, useContext, useState } from 'react'
import { FilePlus, FolderPlus, PlusCircle } from 'react-feather'
import { useHistory } from 'react-router-dom'
import { useNavigate } from 'react-router-dom'
import { DocumentationText } from '../../components/DocumentationText'
import { SwarmButton } from '../../components/SwarmButton'
import { Context, UploadOrigin } from '../../providers/File'
@@ -51,7 +51,7 @@ const useStyles = makeStyles((theme: Theme) =>
export function UploadArea({ uploadOrigin, showHelp }: Props): ReactElement {
const { setFiles, setUploadOrigin } = useContext(Context)
const classes = useStyles()
const history = useHistory()
const navigate = useNavigate()
const { enqueueSnackbar } = useSnackbar()
const [strictWebsiteMode, setStrictWebsiteMode] = useState(false)
const [version, setVersion] = useState(0)
@@ -115,7 +115,7 @@ export function UploadArea({ uploadOrigin, showHelp }: Props): ReactElement {
if (files.length) {
setUploadOrigin(uploadOrigin)
history.push(ROUTES.UPLOAD_IN_PROGRESS)
navigate(ROUTES.UPLOAD_IN_PROGRESS)
}
}
}
src/pages/stamps/CreatePostageStampPage.tsx
+3 -3
View File
@@ -1,14 +1,14 @@
import { ReactElement } from 'react'
import { useHistory } from 'react-router'
import { useNavigate } from 'react-router'
import { HistoryHeader } from '../../components/HistoryHeader'
import { ROUTES } from '../../routes'
import { PostageStampCreation } from './PostageStampCreation'
export function CreatePostageStampPage(): ReactElement {
const history = useHistory()
const navigate = useNavigate()
function onFinished() {
history.push(ROUTES.STAMPS)
navigate(ROUTES.STAMPS)
}
return (
src/pages/stamps/index.tsx
+3 -3
View File
@@ -2,7 +2,7 @@ import { CircularProgress, Container } from '@material-ui/core'
import { createStyles, makeStyles } from '@material-ui/core/styles'
import { ReactElement, useContext, useEffect } from 'react'
import { PlusSquare } from 'react-feather'
import { useHistory } from 'react-router'
import { useNavigate } from 'react-router'
import { SwarmButton } from '../../components/SwarmButton'
import TroubleshootConnectionCard from '../../components/TroubleshootConnectionCard'
import { Context as BeeContext } from '../../providers/Bee'
@@ -29,7 +29,7 @@ const useStyles = makeStyles(() =>
export default function Stamp(): ReactElement {
const classes = useStyles()
const history = useHistory()
const navigate = useNavigate()
const { stamps, isLoading, error, start, stop } = useContext(StampsContext)
const { status } = useContext(BeeContext)
@@ -44,7 +44,7 @@ export default function Stamp(): ReactElement {
if (!status.all) return <TroubleshootConnectionCard />
function navigateToNewStamp() {
history.push(ROUTES.STAMPS_NEW)
navigate(ROUTES.STAMPS_NEW)
}
return (
src/routes.tsx
+17 -17
View File
@@ -1,5 +1,5 @@
import type { ReactElement } from 'react'
import { Route, Switch } from 'react-router-dom'
import { Route, Routes } from 'react-router-dom'
import Accounting from './pages/accounting'
import Feeds from './pages/feeds'
import CreateNewFeed from './pages/feeds/CreateNewFeed'
@@ -34,22 +34,22 @@ export enum ROUTES {
}
const BaseRouter = (): ReactElement => (
<Switch>
<Route exact path={ROUTES.UPLOAD_IN_PROGRESS} component={Upload} />
<Route exact path={ROUTES.UPLOAD} component={UploadLander} />
<Route exact path={ROUTES.DOWNLOAD} component={Download} />
<Route exact path={ROUTES.HASH} component={Share} />
<Route exact path={ROUTES.ACCOUNTING} component={Accounting} />
<Route exact path={ROUTES.SETTINGS} component={Settings} />
<Route exact path={ROUTES.STAMPS} component={Stamps} />
<Route exact path={ROUTES.STAMPS_NEW} component={CreatePostageStampPage} />
<Route exact path={ROUTES.STATUS} component={Status} />
<Route exact path={ROUTES.FEEDS} component={Feeds} />
<Route exact path={ROUTES.FEEDS_NEW} component={CreateNewFeed} />
<Route exact path={ROUTES.FEEDS_UPDATE} component={UpdateFeed} />
<Route exact path={ROUTES.FEEDS_PAGE} component={FeedSubpage} />
<Route path={ROUTES.INFO} component={Info} />
</Switch>
<Routes>
<Route path={ROUTES.UPLOAD_IN_PROGRESS} element={<Upload />} />
<Route path={ROUTES.UPLOAD} element={<UploadLander />} />
<Route path={ROUTES.DOWNLOAD} element={<Download />} />
<Route path={ROUTES.HASH} element={<Share />} />
<Route path={ROUTES.ACCOUNTING} element={<Accounting />} />
<Route path={ROUTES.SETTINGS} element={<Settings />} />
<Route path={ROUTES.STAMPS} element={<Stamps />} />
<Route path={ROUTES.STAMPS_NEW} element={<CreatePostageStampPage />} />
<Route path={ROUTES.STATUS} element={<Status />} />
<Route path={ROUTES.FEEDS} element={<Feeds />} />
<Route path={ROUTES.FEEDS_NEW} element={<CreateNewFeed />} />
<Route path={ROUTES.FEEDS_UPDATE} element={<UpdateFeed />} />
<Route path={ROUTES.FEEDS_PAGE} element={<FeedSubpage />} />
<Route path={ROUTES.INFO} element={<Info />} />
</Routes>
)
export default BaseRouter