Syncing with upstream, fixing merge conflicts

src/components/app-body/index.js

@@ -37,7 +37,7 @@ function AppBody (props) {
         <Route path='/servers' element={<ServerSelectView appData={appData} />} />
       </Routes>
       {/** Show in all paths except the servers view */}
-      {appData.currentPath !== '/servers' && <SelectServerButton linkTo='/servers' />}
+      {appData.currentPath !== '/servers' && <SelectServerButton linkTo='/servers' appData={appData} />}
     </>
   )
 }

src/components/app-body/servers/select-server-button.js

@@ -9,7 +9,7 @@ import { Container, Row, Col, Button } from 'react-bootstrap'
 import { useNavigate } from 'react-router-dom'
 
 const ServerSelect = (props) => {
-  const { linkTo } = props
+  const { linkTo, appData } = props
 
   // Use the navigate function to navigate to the servers view
   const navigate = useNavigate()
@@ -31,6 +31,7 @@ const ServerSelect = (props) => {
             <h5>
               Having trouble loading? Try selecting a different back-end server.
             </h5>
+            <p style={{ fontStyle: 'italic' }}>Current Server : {appData.serverUrl}</p>
             <Button variant='warning' onClick={handleServerSelect}>
               Select a different back end server
             </Button>

src/components/app-body/servers/select-server-view.js

@@ -16,8 +16,9 @@ function ServerSelectView (props) {
   const handleReloadServer = (event) => {
     const target = event.target.id
     console.log('server target: ', target)
-
-    window.location.href = `/?restURL=${target}`
+    appData.updateLocalStorage({ serverUrl: target })
+    // Reload the page
+    window.location.href = '/'
   }
 
   return (

src/hooks/state.js

@@ -1,5 +1,5 @@
 import { useState } from 'react'
-import { useQueryParam, StringParam } from 'use-query-params'
+// import { useQueryParam, StringParam } from 'use-query-params'
 import useLocalStorageState from 'use-local-storage-state'
 import AppUtil from '../util'
 
@@ -8,11 +8,18 @@ import { useLocation } from 'react-router-dom'
 function useAppState () {
   const location = useLocation()
 
-  // Get the CashStack URL from query parameter or use default
-  let [restURL] = useQueryParam('restURL', StringParam)
-  if (!restURL) restURL = 'https://free-bch.fullstack.cash'
+  // Load Local storage Data
+  const [lsState, setLSState, { removeItem }] = useLocalStorageState('bchWalletState-template', {
+    ssr: true,
+    defaultValue: {
+      serverUrl: 'https://free-bch.fullstack.cash' // Default server
+    }
+  })
 
-  const [serverUrl, setServerUrl] = useState(restURL)
+  console.log('lsState: ', lsState)
+
+  // Initialize  data states
+  const [serverUrl, setServerUrl] = useState(lsState.serverUrl) // Default server url
   const [menuState, setMenuState] = useState(0)
   const [wallet, setWallet] = useState(false)
   const [servers, setServers] = useState([])
@@ -33,11 +40,11 @@ function useAppState () {
   // properties are enumerated here for the purpose of documentation.
 
   // Local storage
-  const [lsState, setLSState, { removeItem }] = useLocalStorageState('bchWalletState', {
-    ssr: true,
-    defaultValue: {}
-  })
-  console.log('lsState: ', lsState)
+  // const [lsState, setLSState, { removeItem }] = useLocalStorageState('bchWalletState', {
+  //   ssr: true,
+  //   defaultValue: {}
+  // })
+  // console.log('lsState: ', lsState)
   const removeLocalStorageItem = removeItem
   const updateLocalStorage = (lsObj) => {
     // console.log(`updateLocalStorage() input: ${JSON.stringify(lsObj, null, 2)}`)