Created a new route for pending transactions to live for now

apps/explorer/src/app/routes/pending/index.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import { DATA_SOURCES } from '../../config';
+import useFetch from '../../hooks/use-fetch';
+import { TendermintUnconfirmedTransactionsResponse } from '../txs/tendermint-unconfirmed-transactions-response.d';
+import { TxList } from '../../components/txs';
+
+const PendingTxs = () => {
+  const {
+    state: { data: unconfirmedTransactions },
+  } = useFetch<TendermintUnconfirmedTransactionsResponse>(
+    `${DATA_SOURCES.tendermintUrl}/unconfirmed_txs`
+  );
+
+  return (
+    <section>
+      <h1>Unconfirmed transactions</h1>
+      https://lb.testnet.vega.xyz/tm/unconfirmed_txs
+      <br />
+      <div>Number: {unconfirmedTransactions?.result?.n_txs || 0}</div>
+      <br />
+      <div>
+        <br />
+        <TxList data={unconfirmedTransactions} />
+      </div>
+    </section>
+  );
+};
+
+export { PendingTxs };

apps/explorer/src/app/routes/router-config.tsx

@@ -14,10 +14,12 @@ import { Block } from './blocks/id';
 import { Blocks } from './blocks/home';
 import { Tx } from './txs/id';
 import { Txs as TxHome } from './txs/home';
+import { PendingTxs } from './pending';
 
 export const Routes = {
   HOME: '/',
   TX: 'txs',
+  PENDING: 'pending',
   BLOCKS: 'blocks',
   PARTIES: 'parties',
   VALIDATORS: 'validators',
@@ -50,6 +52,17 @@ const routerConfig = [
       },
     ],
   },
+  {
+    path: Routes.PENDING,
+    name: 'Pending txs',
+    element: <Txs />,
+    children: [
+      {
+        index: true,
+        element: <PendingTxs />,
+      },
+    ],
+  },
   {
     path: Routes.BLOCKS,
     name: 'Blocks',

apps/explorer/src/app/routes/txs/home/index.tsx

@@ -1,27 +1,7 @@
-import React from 'react';
-import { DATA_SOURCES } from '../../../config';
-import useFetch from '../../../hooks/use-fetch';
-import { TendermintUnconfirmedTransactionsResponse } from '../tendermint-unconfirmed-transactions-response.d';
-import { TxList } from '../../../components/txs';
-
 const Txs = () => {
-  const {
-    state: { data: unconfirmedTransactions },
-  } = useFetch<TendermintUnconfirmedTransactionsResponse>(
-    `${DATA_SOURCES.tendermintUrl}/unconfirmed_txs`
-  );
-
   return (
     <section>
-      <h1>Unconfirmed transactions</h1>
-      https://lb.testnet.vega.xyz/tm/unconfirmed_txs
-      <br />
-      <div>Number: {unconfirmedTransactions?.result?.n_txs || 0}</div>
-      <br />
-      <div>
-        <br />
-        <TxList data={unconfirmedTransactions} />
-      </div>
+      <h1>Transactions</h1>
     </section>
   );
 };