Implement ledger integration improvements

Consolidate approval views for all tx types

Hook up Ledger transfer

Remove unused address from messages

Consolidate tx build calls

Clean up Message and component props

apps/extension/src/Approvals/Approvals.tsx

@@ -3,6 +3,7 @@ import { ThemeProvider } from "styled-components";
 import { Routes, Route } from "react-router-dom";
 
 import { getTheme } from "@namada/utils";
+import { TxType } from "@namada/shared";
 
 import {
   AppContainer,
@@ -11,23 +12,29 @@ import {
   TopSection,
   Heading,
 } from "./Approvals.components";
-import { ApproveTransfer, ConfirmTransfer } from "./ApproveTransfer";
 import { ApproveConnection } from "./ApproveConnection";
 import { TopLevelRoute } from "Approvals/types";
-import { ConfirmLedgerTransfer } from "./ApproveTransfer/ConfirmLedgerTransfer";
-import { ApproveBond, ConfirmBond, ConfirmLedgerBond } from "./ApproveBond";
+import { ConfirmLedgerTx } from "./ApproveTx/ConfirmLedgerTx";
+import { ConfirmTx } from "./ApproveTx/ConfirmTx";
+import { ApproveTx } from "./ApproveTx/ApproveTx";
 
 export enum Status {
   Completed,
   Pending,
   Failed,
 }
 
+export type ApprovalDetails = {
+  source: string;
+  msgId: string;
+  txType: TxType;
+  publicKey?: string;
+  target?: string;
+};
+
 export const Approvals: React.FC = () => {
   const theme = getTheme("dark");
-  const [msgId, setMsgId] = useState("");
-  const [address, setAddress] = useState("");
-  const [publicKey, setPublicKey] = useState("");
+  const [details, setDetails] = useState<ApprovalDetails>();
 
   return (
     <ThemeProvider theme={theme}>
@@ -39,44 +46,17 @@ export const Approvals: React.FC = () => {
           </TopSection>
           <Routes>
             <Route
-              path={TopLevelRoute.ApproveTransfer}
-              element={
-                <ApproveTransfer setMsgId={setMsgId} setAddress={setAddress} />
-              }
+              path={`${TopLevelRoute.ApproveTx}/:type`}
+              element={<ApproveTx setDetails={setDetails} />}
             />
             <Route
-              path={TopLevelRoute.ConfirmTransfer}
-              element={<ConfirmTransfer msgId={msgId} address={address} />}
+              path={TopLevelRoute.ConfirmTx}
+              element={<ConfirmTx details={details} />}
             />
             <Route
-              path={TopLevelRoute.ConfirmLedgerTransfer}
-              element={<ConfirmLedgerTransfer msgId={msgId} />}
+              path={TopLevelRoute.ConfirmLedgerTx}
+              element={<ConfirmLedgerTx details={details} />}
             />
-            <Route
-              path={TopLevelRoute.ApproveBond}
-              element={
-                <ApproveBond
-                  setAddress={setAddress}
-                  setMsgId={setMsgId}
-                  setPublicKey={setPublicKey}
-                />
-              }
-            />
-            <Route
-              path={TopLevelRoute.ConfirmBond}
-              element={<ConfirmBond msgId={msgId} address={address} />}
-            />
-            <Route
-              path={TopLevelRoute.ConfirmLedgerBond}
-              element={
-                <ConfirmLedgerBond
-                  address={address}
-                  msgId={msgId}
-                  publicKey={publicKey}
-                />
-              }
-            />
-
             <Route
               path={TopLevelRoute.ApproveConnection}
               element={<ApproveConnection />}