feat(gui): transaction history for bitcoin wallet, transaction details (fee and txid, splits for bitcoin), fully-featured send dialog for bitcoin, bitcoin withdrawal confirmation dialog, more addresses button

monero-sys/src/lib.rs

@@ -2395,7 +2395,7 @@ impl FfiWallet {
         let history_handle = TransactionHistoryHandle(history_ptr);
         let count = history_handle.count();
 
-        let mut transactions = Vec::new();
+        let mut transactions = Vec::with_capacity(count as _);
         for i in 0..count {
             if let Some(tx_info_handle) = history_handle.transaction(i) {
                 if let Some(serialized_tx) = tx_info_handle.serialize() {

src-gui/src/models/tauriModelExt.ts

@@ -7,6 +7,7 @@ import {
   TauriBackgroundProgress,
   TauriSwapProgressEvent,
   SendMoneroDetails,
+  WithdrawBitcoinDetails,
   ContextStatus,
   QuoteWithAddress,
   ExportBitcoinWalletResponse,
@@ -319,6 +320,10 @@ export type PendingSendMoneroApprovalRequest = PendingApprovalRequest & {
   request: { type: "SendMonero"; content: SendMoneroDetails };
 };
 
+export type PendingWithdrawBitcoinApprovalRequest = PendingApprovalRequest & {
+  request: { type: "WithdrawBitcoin"; content: WithdrawBitcoinDetails };
+};
+
 export type PendingPasswordApprovalRequest = PendingApprovalRequest & {
   request: { type: "PasswordRequest"; content: { wallet_path: string } };
 };
@@ -335,16 +340,21 @@ export function isPendingSelectMakerApprovalEvent(
   return event.request.type === "SelectMaker";
 }
 
-export function isPendingSendMoneroApprovalEvent(
+export function isPendingSendCurrencyApprovalEvent(
   event: ApprovalRequest,
-): event is PendingSendMoneroApprovalRequest {
+  currency: "monero" | "bitcoin",
+): event is
+  | PendingSendMoneroApprovalRequest
+  | PendingWithdrawBitcoinApprovalRequest {
   // Check if the request is pending
   if (event.request_status.state !== "Pending") {
     return false;
   }
 
+  const type = currency === "monero" ? "SendMonero" : "WithdrawBitcoin";
+
   // Check if the request is a SendMonero request
-  return event.request.type === "SendMonero";
+  return event.request.type === type;
 }
 
 export function isPendingPasswordApprovalEvent(

src-gui/src/renderer/background.ts

@@ -7,7 +7,10 @@ import {
   approvalEventReceived,
   backgroundProgressEventReceived,
 } from "store/features/rpcSlice";
-import { setBitcoinBalance } from "store/features/bitcoinWalletSlice";
+import {
+  setBitcoinBalance,
+  setBitcoinHistory,
+} from "store/features/bitcoinWalletSlice";
 import { receivedCliLog } from "store/features/logsSlice";
 import { poolStatusReceived } from "store/features/poolSlice";
 import { swapProgressEventReceived } from "store/features/swapSlice";
@@ -135,6 +138,7 @@ listen<TauriEvent>(TAURI_UNIFIED_EVENT_CHANNEL_NAME, (event) => {
 
     case "BalanceChange":
       store.dispatch(setBitcoinBalance(eventData.balance));
+      store.dispatch(setBitcoinHistory(eventData.transactions));
       break;
 
     case "SwapDatabaseStateUpdate":

src-gui/src/renderer/components/PromiseInvokeButton.tsx

@@ -132,11 +132,11 @@ export default function PromiseInvokeButton<T>({
           <IconButton
             onClick={handleClick}
             disabled={isDisabled}
-            {...(rest as IconButtonProps)}
-            size="large"
             sx={{
               padding: "0.25rem",
             }}
+            size="large"
+            {...(rest as IconButtonProps)}
           >
             {isLoading
               ? resolvedLoadingIcon

src-gui/src/renderer/components/inputs/BitcoinAddressTextField.tsx

@@ -3,22 +3,22 @@ import { useEffect } from "react";
 import { isTestnet } from "store/config";
 import { isBtcAddressValid } from "utils/conversionUtils";
 
-type BitcoinAddressTextFieldProps = {
+type BitcoinAddressTextFieldProps = TextFieldProps & {
   address: string;
   onAddressChange: (address: string) => void;
-  helperText: string;
   onAddressValidityChange?: (valid: boolean) => void;
+  helperText?: string;
   allowEmpty?: boolean;
 };
 
 export default function BitcoinAddressTextField({
   address,
   onAddressChange,
+  onAddressValidityChange,
   helperText,
   allowEmpty = true,
-  onAddressValidityChange,
   ...props
-}: BitcoinAddressTextFieldProps & TextFieldProps) {
+}: BitcoinAddressTextFieldProps) {
   const placeholder = isTestnet() ? "tb1q4aelwalu..." : "bc18ociqZ9mZ...";
 
   function errorText() {

src-gui/src/renderer/components/inputs/MoneroAddressTextField.tsx

@@ -8,8 +8,8 @@ import {
   List,
   ListItemText,
   TextField,
+  TextFieldProps,
 } from "@mui/material";
-import { TextFieldProps } from "@mui/material";
 import { useEffect, useState } from "react";
 import { getMoneroAddresses } from "renderer/rpc";
 import { isTestnet } from "store/config";

src-gui/src/renderer/components/other/ActionableMonospaceTextBox.tsx

@@ -18,6 +18,7 @@ type Props = {
   enableQrCode?: boolean;
   light?: boolean;
   spoilerText?: string;
+  centered?: boolean;
 };
 
 function QRCodeModal({ open, onClose, content }: ModalProps) {
@@ -65,6 +66,7 @@ export default function ActionableMonospaceTextBox({
   enableQrCode = true,
   light = false,
   spoilerText,
+  centered = false,
 }: Props) {
   const [copied, setCopied] = useState(false);
   const [qrCodeOpen, setQrCodeOpen] = useState(false);
@@ -101,6 +103,7 @@ export default function ActionableMonospaceTextBox({
           >
             <MonospaceTextBox
               light={light}
+              centered={centered}
               actions={
                 <>
                   {displayCopyIcon && (

src-gui/src/renderer/components/other/MonospaceTextBox.tsx

@@ -3,12 +3,14 @@ import { Box, Typography } from "@mui/material";
 type Props = {
   children: React.ReactNode;
   light?: boolean;
+  centered?: boolean;
   actions?: React.ReactNode;
 };
 
 export default function MonospaceTextBox({
   children,
   light = false,
+  centered = false,
   actions,
 }: Props) {
   return (
@@ -33,6 +35,7 @@ export default function MonospaceTextBox({
           fontFamily: "monospace",
           lineHeight: 1.5,
           flex: 1,
+          ...(centered ? { textAlign: "center" } : {}),
         }}
       >
         {children}