feat: changing API urls does not need the app refresh (#173)

* feat: changing API urls does not need the app refresh

* fix: propagate beeDebugApi and beeApi change to the refresh interval

* fix: any failed request on the Bee provider does not stop the execution of other requests

* fix: error handling for incorrect bee and bee debug urls

* fix: change debug API in the settings tab

src/pages/files/Download.tsx

@@ -1,8 +1,8 @@
-import { ReactElement, useState } from 'react'
+import { ReactElement, useState, useContext } from 'react'
 import { makeStyles, Theme, createStyles } from '@material-ui/core/styles'
 import { Paper, InputBase, IconButton, FormHelperText } from '@material-ui/core'
 import { Search } from '@material-ui/icons'
-import { apiHost } from '../../constants'
+import { Context as SettingsContext } from '../../providers/Settings'
 import { Utils } from '@ethersphere/bee-js'
 
 const useStyles = makeStyles((theme: Theme) =>
@@ -28,6 +28,7 @@ const useStyles = makeStyles((theme: Theme) =>
 
 export default function Files(): ReactElement {
   const classes = useStyles()
+  const { apiUrl } = useContext(SettingsContext)
 
   const [referenceInput, setReferenceInput] = useState('')
   const [referenceError, setReferenceError] = useState<Error | null>(null)
@@ -50,7 +51,7 @@ export default function Files(): ReactElement {
           onChange={handleReferenceChange}
         />
         <IconButton
-          href={`${apiHost}/bzz/${referenceInput}`}
+          href={`${apiUrl}/bzz/${referenceInput}`}
           target="_blank"
           disabled={referenceError !== null || !referenceInput}
           className={classes.iconButton}

src/pages/files/Upload.tsx

@@ -8,7 +8,7 @@ import UploadSizeAlert from '../../components/AlertUploadSize'
 import ClipboardCopy from '../../components/ClipboardCopy'
 import PeerDetailDrawer from '../../components/PeerDetail'
 import { Context, EnrichedPostageBatch } from '../../providers/Stamps'
-import { beeApi } from '../../services/bee'
+import { Context as SettingsContext } from '../../providers/Settings'
 import CreatePostageStamp from '../stamps/CreatePostageStampModal'
 import SelectStamp from './SelectStamp'
 
@@ -23,6 +23,7 @@ export default function Files(): ReactElement {
   const [selectedStamp, setSelectedStamp] = useState<EnrichedPostageBatch | null>(null)
 
   const { isLoading, error, stamps } = useContext(Context)
+  const { beeApi } = useContext(SettingsContext)
   const { enqueueSnackbar } = useSnackbar()
 
   // Choose a postage stamp that has the lowest usage
@@ -40,8 +41,11 @@ export default function Files(): ReactElement {
 
   const uploadFile = () => {
     if (file === null || selectedStamp === null) return
+
+    if (!beeApi) return
+
     setIsUploadingFile(true)
-    beeApi.files
+    beeApi
       .uploadFile(selectedStamp.batchID, file)
       .then(hash => {
         window.setTimeout(() => {