Merge branch 'staging' into upgrade-status-stablize

package.json

@@ -17,11 +17,11 @@
     "bunyan": "^1.8.15",
     "classnames": "^2.5.1",
     "compression": "^1.7.4",
-    "d3": "^7.8.5",
+    "d3": "^7.9.0",
     "d3-geo": "^3.1.0",
     "d3-hexbin": "^0.2.2",
     "d3-scale": "^4.0.2",
-    "debug": "^4.3.1",
+    "debug": "^4.3.6",
     "dotenv": "^16.4.5",
     "enzyme": "3.11.0",
     "enzyme-adapter-react-17-updated": "^1.0.2",
@@ -40,7 +40,7 @@
     "react-query": "^3.39.3",
     "react-redux": "^8.1.3",
     "react-router": "^6.12.1",
-    "react-router-dom": "^6.24.0",
+    "react-router-dom": "^6.26.1",
     "react18-json-view": "^0.2.7",
     "recharts": "^2.12.6",
     "redux": "^5.0.1",
@@ -58,7 +58,7 @@
   },
   "devDependencies": {
     "@babel/eslint-parser": "^7.22.6",
-    "@babel/preset-env": "^7.24.5",
+    "@babel/preset-env": "^7.25.3",
     "@babel/preset-react": "^7.24.7",
     "@types/create-hash": "^1.2.2",
     "@types/enzyme": "^3.10.12",
@@ -89,7 +89,7 @@
     "lint-staged": "^15.2.5",
     "mock-socket": "^9.1.5",
     "moxios": "^0.4.0",
-    "nodemon": "^3.0.1",
+    "nodemon": "^3.1.4",
     "npm-run-all": "^4.1.5",
     "prettier": "^3.3.2",
     "react-error-overlay": "6.0.11",
@@ -105,7 +105,7 @@
     "stylelint-scss": "^5.3.2",
     "ts-jest": "^26.5.6",
     "ts-node": "^10.9.2",
-    "typescript": "^4.9.4",
+    "typescript": "^4.9.5",
     "xrpl": "^3.1.0"
   },
   "resolutions": {

src/containers/App/index.tsx

@@ -104,6 +104,14 @@ export const AppWrapper = () => {
                   path={updatePath('/ledgers')}
                   element={<Navigate to={updatePath('/')} replace />}
                 />
+                <Route
+                  path={updatePath('/index.html')}
+                  element={<Navigate to={updatePath('/')} replace />}
+                />
+                <Route
+                  path={updatePath('/index.htm')}
+                  element={<Navigate to={updatePath('/')} replace />}
+                />
                 {/* End: Redirects */}
                 {mode === 'custom' && (
                   <Route path="/" element={<CustomNetworkHome />} />

src/containers/App/test/App.test.jsx

@@ -43,7 +43,7 @@ jest.mock('../../../rippled', () => {
     ...originalModule,
     getTransaction: () =>
       Promise.resolve({
-        raw: formatTransaction({
+        processed: formatTransaction({
           TransactionType: 'OfferCreate',
           meta: {
             TransactionResult: 'tecKILLED',
@@ -161,6 +161,40 @@ describe('App container', () => {
     ])
   })
 
+  it('renders ledger explorer page from index.html redirect', async () => {
+    wrapper = createWrapper('/index.html')
+    await flushPromises()
+    await flushPromises()
+    wrapper.update()
+
+    expect(document.title).toEqual('xrpl_explorer | ledgers')
+    expect(window.dataLayer).toEqual([
+      {
+        page_path: '/',
+        page_title: `xrpl_explorer | ledgers`,
+        event: 'screen_view',
+        network: 'mainnet',
+      },
+    ])
+  })
+
+  it('renders ledger explorer page from index.htm redirect', async () => {
+    wrapper = createWrapper('/index.html')
+    await flushPromises()
+    await flushPromises()
+    wrapper.update()
+
+    expect(document.title).toEqual('xrpl_explorer | ledgers')
+    expect(window.dataLayer).toEqual([
+      {
+        page_path: '/',
+        page_title: `xrpl_explorer | ledgers`,
+        event: 'screen_view',
+        network: 'mainnet',
+      },
+    ])
+  })
+
   it('renders not found page', () => {
     wrapper = createWrapper('/zzz')
     return new Promise((r) => setTimeout(r, 10)).then(() => {

src/containers/Transactions/SimpleTab.tsx

@@ -72,13 +72,13 @@ export const SimpleTab: FC<{ data: any; width: number }> = ({
     </>
   )
 
-  const { raw } = data
+  const { processed } = data
   const numberOptions = { ...CURRENCY_OPTIONS, currency: 'XRP' }
-  const time = localizeDate(new Date(raw.date), language, DATE_OPTIONS)
-  const ledgerIndex = raw.ledger_index
-  const fee = raw.tx.Fee
+  const time = localizeDate(new Date(processed.date), language, DATE_OPTIONS)
+  const ledgerIndex = processed.ledger_index
+  const fee = processed.tx.Fee
     ? localizeNumber(
-        Number.parseFloat(raw.tx.Fee) / XRP_BASE,
+        Number.parseFloat(processed.tx.Fee) / XRP_BASE,
         language,
         numberOptions,
       )
@@ -88,16 +88,16 @@ export const SimpleTab: FC<{ data: any; width: number }> = ({
     time,
     ledgerIndex,
     fee,
-    raw.tx.Account,
-    raw.tx.Sequence,
-    raw.tx.TicketSequence,
-    !!raw.tx.EmitDetails,
+    processed.tx.Account,
+    processed.tx.Sequence,
+    processed.tx.TicketSequence,
+    !!processed.tx.EmitDetails,
   )
 
   return (
     <div className="simple-body simple-body-tx">
       <div className="rows">
-        <Simple type={raw.tx.TransactionType} data={data.summary} />
+        <Simple type={processed.tx.TransactionType} data={data.summary} />
         {width < BREAKPOINTS.landscape && rowIndex}
       </div>
       {width >= BREAKPOINTS.landscape && (

src/containers/Transactions/index.tsx

@@ -75,10 +75,10 @@ export const Transaction = () => {
   const { width } = useWindowSize()
 
   useEffect(() => {
-    if (!data?.raw) return
+    if (!data?.processed) return
 
-    const type = data?.raw.tx.TransactionType
-    const status = data?.raw.meta.TransactionResult
+    const type = data?.processed.tx.TransactionType
+    const status = data?.processed.meta.TransactionResult
 
     const transactionProperties: AnalyticsFields = {
       transaction_action: getAction(type),
@@ -91,22 +91,22 @@ export const Transaction = () => {
     }
 
     trackScreenLoaded(transactionProperties)
-  }, [identifier, data?.raw, tab, trackScreenLoaded])
+  }, [identifier, data?.processed, tab, trackScreenLoaded])
 
   function renderSummary() {
-    const type = data?.raw.tx.TransactionType
+    const type = data?.processed.tx.TransactionType
     return (
       <div className="summary">
         <div className="type">{type}</div>
-        <TxStatus status={data?.raw.meta.TransactionResult} />
-        <div className="txid" title={data?.raw.hash}>
+        <TxStatus status={data?.processed.meta.TransactionResult} />
+        <div className="txid" title={data?.processed.hash}>
           <div className="title">{t('hash')}: </div>
-          {data?.raw.hash}
+          {data?.processed.hash}
         </div>
-        {data?.raw.tx.ctid && (
-          <div className="txid" title={data.raw.tx.ctid}>
+        {data?.processed.tx.ctid && (
+          <div className="txid" title={data.processed.tx.ctid}>
             <div className="title">CTID: </div>
-            {data.raw.tx.ctid}
+            {data.processed.tx.ctid}
           </div>
         )}
       </div>
@@ -126,7 +126,7 @@ export const Transaction = () => {
 
     switch (tab) {
       case 'detailed':
-        body = <DetailTab data={data.raw} />
+        body = <DetailTab data={data.processed} />
         break
       case 'raw':
         body = <JsonView data={data.raw} />
@@ -149,7 +149,7 @@ export const Transaction = () => {
   if (isError) {
     const message = getErrorMessage(error)
     body = <NoMatch title={message.title} hints={message.hints} />
-  } else if (data?.raw && data?.raw.hash) {
+  } else if (data?.processed && data?.processed.hash) {
     body = renderTransaction()
   } else if (!identifier) {
     body = (

src/containers/Transactions/test/SimpleTab.test.tsx

@@ -15,7 +15,7 @@ describe('SimpleTab container', () => {
       <Router>
         <I18nextProvider i18n={i18n}>
           <SimpleTab
-            data={{ raw: tx, summary: summarize(tx, true).details }}
+            data={{ processed: tx, summary: summarize(tx, true).details }}
             width={width}
           />
         </I18nextProvider>

src/containers/Transactions/test/Transaction.test.tsx

@@ -104,7 +104,7 @@ describe('Transaction container', () => {
 
     beforeEach(async () => {
       const transaction = {
-        raw: mockTransaction,
+        processed: mockTransaction,
         summary: mockTransactionSummary,
       }
 

src/containers/shared/components/Transaction/UNLModify/test/UNLModifySimple.test.tsx

@@ -44,7 +44,7 @@ describe('UNLModify: Simple', () => {
       <QuickHarness i18n={i18n}>
         <SimpleTab
           data={{
-            raw: mockUNLModifyDisable,
+            processed: mockUNLModifyDisable,
             summary: summarizeTransaction(mockUNLModifyDisable, true).details,
           }}
           width={800}

src/index.html

@@ -8,6 +8,7 @@
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="google-site-verification" content="k8jb6KQfitguHqeR97svoRnnsgzvs3a0FliHbESVDk4" />
+  <meta name="description" content="Discover the XRP Ledger with this open source explorer. Check account balances, transactions, validators, nodes and analyze blockchain activity.">
   <!--
       manifest.json provides metadata used when your web app is added to the
       homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/

src/rippled/transactions.js

@@ -8,11 +8,14 @@ const log = logger({ name: 'transactions' })
 const getTransaction = (transactionId, rippledSocket) => {
   log.info(`get tx: ${transactionId}`)
   return getRippledTransaction(rippledSocket, transactionId)
-    .then((response) => formatTransaction(response))
-    .then((data) => ({
-      summary: summarizeTransaction(data, true).details,
-      raw: data,
-    }))
+    .then((data) => {
+      const formattedTransaction = formatTransaction(data)
+      return {
+        summary: summarizeTransaction(formattedTransaction, true).details,
+        processed: formattedTransaction,
+        raw: data,
+      }
+    })
     .catch((error) => {
       log.error(error.toString())
       throw error