Breakdown tab for payments and offercreates

package.json

@@ -10,6 +10,8 @@
     "@vitejs/plugin-react": "^4.2.1",
     "@xrplf/isomorphic": "^1.0.0-beta.1",
     "@xrplf/prettier-config": "^1.9.1",
+    "@xrplkit/txmeta": "^1.3.1",
+    "@xrplkit/xfl": "^2.1.0",
     "assert": "^2.1.0",
     "autoprefixer": "^10.4.17",
     "axios": "^1.6.5",
@@ -54,7 +56,8 @@
     "vite-plugin-html": "^3.2.0",
     "vite-plugin-svgr": "^4.2.0",
     "vite-tsconfig-paths": "^4.2.0",
-    "xrpl-client": "^2.1.0"
+    "xrpl-client": "^2.1.0",
+    "xrpl-tx-path-parser": "^1.0.5"
   },
   "devDependencies": {
     "@babel/eslint-parser": "^7.22.6",

public/locales/ca-CA/translations.json

@@ -75,6 +75,7 @@
   "not_found_default_title": "No s'ha trobat la pàgina",
   "not_found_check_url": "Si us plau, comproba l'URL",
   "not_found": "No s'ha trobat",
+  "breakdown": "Breakdown",
   "buy": "Compra",
   "sell": "Ven",
   "price": "Preu",
@@ -525,6 +526,17 @@
   "indicate_unl": "indica un validador en una UNL",
   "transaction_tokens_involved": "<Currency/> i <Currency2/>",
   "transaction_tokens_swapped": "<Currency/> per <Currency2/>",
+  "graph_dependent_currency": "*Graph is dependent on the currency used.",
+  "incomplete_transaction": "Incomplete transaction",
+  "liquidity_source": "Liquidity Source",
+  "balance_changes": "Balance Changes",
+  "direct": "direct",
+  "dex": "dex",
+  "amm": "amm",
+  "rippling": "rippling",
+  "sold": "sold",
+  "bought": "bought",
+  "no_cross": "The offer has not crossed anything yet",
   "oracle_document_id": null,
   "provider": null,
   "last_update_time": null,

public/locales/en-US/translations.json

@@ -76,6 +76,7 @@
   "not_found_default_title": "Page Not Found",
   "not_found_check_url": "Please double check your URL",
   "not_found": "Not found",
+  "breakdown": "Breakdown",
   "buy": "Buy",
   "sell": "Sell",
   "price": "Price",
@@ -525,6 +526,17 @@
   "indicate_unl": "indicates a validator on an UNL",
   "transaction_tokens_involved": "<Currency/> and <Currency2/>",
   "transaction_tokens_swapped": "<Currency/> for <Currency2/>",
+  "graph_dependent_currency": "*Graph is dependent on the currency used.",
+  "incomplete_transaction": "Incomplete transaction",
+  "liquidity_source": "Liquidity Source",
+  "balance_changes": "Balance Changes",
+  "direct": "direct",
+  "dex": "dex",
+  "amm": "amm",
+  "rippling": "rippling",
+  "sold": "sold",
+  "bought": "bought",
+  "no_cross": "The offer has not crossed anything yet",
   "oracle_document_id": "Oracle Document ID",
   "provider": "Provider",
   "last_update_time": "Last Update Time",