@stellar-expert/ui-framework 1.10.3 → 1.10.5

package/api/explorer-api-hooks.js

@@ -2,7 +2,7 @@ import {useEffect, useState} from 'react'
 import isEqual from 'react-fast-compare'
 import {stringifyQuery} from '@stellar-expert/navigation'
 import {addVisibilityChangeListener, isDocumentVisible} from '../state/page-visibility-helpers'
-import {getCurrentStellarNetwork} from '../state/stellar-network-hooks'
+import {useStellarNetwork} from '../state/stellar-network-hooks'
 import {fetchExplorerApi} from './explorer-api-call'
 import apiCache from './api-cache'
 
@@ -148,7 +148,8 @@ export function fetchData(url, ttl, processResult) {
  * @return {ExplorerApiResult}
  */
 export function useExplorerApi(apiEndpoint, {refreshInterval, ttl = 60, processResult, allowStaleDataTransition = false} = {}) {
-    const endpointWithQuery = `${getCurrentStellarNetwork()}/${apiEndpoint}`
+    const network = useStellarNetwork()
+    const endpointWithQuery = `${network}/${apiEndpoint}`
     const [apiResponseData, updateApiResponseData] = useState(buildApiResult(endpointWithQuery))
     useEffect(() => {
         let componentUnmounted = false

package/api/explorer-api-paginated-list-hooks.js

@@ -1,7 +1,7 @@
 import {useRef} from 'react'
 import isEqual from 'react-fast-compare'
 import {parseQuery, stringifyQuery, navigation} from '@stellar-expert/navigation'
-import {getCurrentStellarNetwork} from '../state/stellar-network-hooks'
+import {getCurrentStellarNetwork, useStellarNetwork} from '../state/stellar-network-hooks'
 import {useDependantState} from '../state/state-hooks'
 import {fetchExplorerApi} from './explorer-api-call'
 import apiCache from './api-cache'
@@ -397,6 +397,7 @@ export function useExplorerPaginatedApi(apiEndpoint,
                                         dependencies = []) {
     if (!apiEndpoint)
         throw new Error(`Invalid API endpoint: ${apiEndpoint}`)
+    const network = useStellarNetwork()
     const pinRef = useRef(null)
     if (typeof apiEndpoint === 'string') {
         const [path, query] = apiEndpoint.split('?')
@@ -408,7 +409,7 @@ export function useExplorerPaginatedApi(apiEndpoint,
     if (defaultQueryParams.order) {
         defaultSortOrder = defaultQueryParams.order
     }
-    const endpoint = includeNetwork ? `${getCurrentStellarNetwork()}/${apiEndpoint.path}` : apiEndpoint.path
+    const endpoint = includeNetwork ? `${network}/${apiEndpoint.path}` : apiEndpoint.path
 
     const [apiResponseData, updateApiResponseData] = useDependantState(() => {
         const res = new PaginatedListViewModel(endpoint, {

package/errors/error-boundary.js

@@ -57,7 +57,7 @@ ${navigator.userAgent}`
                 <BlockSelect as="div">
                     <div className="micro-space">{text}</div>
                     <div className="text-tiny">
-                        <pre>{stack}</pre>
+                        <pre style={{whiteSpace: 'pre-wrap'}}>{stack}</pre>
                         <div>{navigator.userAgent}</div>
                     </div>
                 </BlockSelect>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stellar-expert/ui-framework",
-  "version": "1.10.3",
+  "version": "1.10.5",
   "description": "StellarExpert shared UI components library",
   "main": "index.js",
   "module": "./index.js",
@@ -21,7 +21,7 @@
     "@stellar-expert/client-cache": "github:stellar-expert/client-cache",
     "@stellar-expert/formatter": "^2.3.0",
     "@stellar-expert/navigation": "github:stellar-expert/navigation#v1.0.2",
-    "@stellar-expert/tx-meta-effects-parser": "^5.0.4",
+    "@stellar-expert/tx-meta-effects-parser": "^5.2.0",
     "classnames": ">=2",
     "prop-types": ">=15",
     "qrcode.react": "^3.1.0",

package/tx/op-description-view.js

@@ -117,8 +117,10 @@ function PathPaymentDescriptionView({op, compact}) {
     if (sendMax !== undefined) {
         if (isSwap && sendAssetId === destAssetId && effects.length) { //circular trades yield accountCredited/Debited effect
             const changeEffect = effects.find(e => e.source === source && e.asset === sendAssetId && (e.type === 'accountCredited' || e.type === 'accountDebited'))
-            const change = BigInt(changeEffect.amount)
-            src = fromStroops(toStroops(destAmount) + (changeEffect.type === 'accountCredited' ? -change : change))
+            if (changeEffect) { //arbitrage successful, otherwise src = dst and no account changes happened
+                const change = BigInt(changeEffect.amount)
+                src = fromStroops(toStroops(destAmount) + (changeEffect.type === 'accountCredited' ? -change : change))
+            }
         } else {
             const debitedEffect = effects.find(e => e.source === source && e.type === 'accountDebited' && e.asset === sendAssetId)
             if (debitedEffect) {
@@ -129,8 +131,10 @@ function PathPaymentDescriptionView({op, compact}) {
     if (destMin !== undefined) {
         if (isSwap && sendAssetId === destAssetId && effects.length) { //circular trades yield accountCredited/Debited effect
             const changeEffect = effects.find(e => e.source === source && e.asset === destAssetId && (e.type === 'accountCredited' || e.type === 'accountDebited'))
-            const change = BigInt(changeEffect.amount)
-            dst = fromStroops(toStroops(destAmount) + (changeEffect.type === 'accountCredited' ? change : -change))
+            if (changeEffect) { //arbitrage successful, otherwise src = dst and no account changes happened
+                const change = BigInt(changeEffect.amount)
+                dst = fromStroops(toStroops(destAmount) + (changeEffect.type === 'accountCredited' ? change : -change))
+            }
         } else {
             const creditedEffect = effects.find(e => e.source === destination && e.type === 'accountCredited' && e.asset === destAssetId)
             if (creditedEffect) {