- {`You did not send a Stellar transaction in time, or the transferred amount did not meet the requested amount of ${amountToSend}
- ${stellarAsset}.`}
-
-
- {'Your redeem request failed but you decided to burn ' +
- stellarAsset +
- ' in return for ' +
- convertCurrencyToStellarAsset(collateralAsset)?.getCode()}
-
- ();
-
- useEffect(() => {
- getActiveBlockNumber().then((active) => {
- setDeadline(
- calculateDeadline(active as number, transfer.original.opentime.toNumber(), transfer.original.period.toNumber()),
- );
- });
- }, [getActiveBlockNumber, setDeadline, transfer.original.opentime, transfer.original.period]);
-
- const expectedStellarMemo = useMemo(() => {
- // For issue requests we use a shorter identifier for the memo
- return deriveShortenedRequestId(hexToU8a(transfer.transactionId));
- }, [transfer]);
-
- const issueContent = (
- <>
- <>
- {`Send ${amountToSend.toNumber()} ${stellarAsset}`}
-
-
-
-
In a single transaction to
-
-
-
- Within
-
- >
-
-
-
- Note: Estimated time for issuing is in a minute after submitting the Stellar payment to the vault, contact
-
- support
-
- if your transaction is still pending after 10 minutes.
-
-
- >
- );
- const redeemContent = (
- <>
- {`${amountToSend} ${stellarAsset}`}
- The vault has to complete the transaction in:
-
-
-
-
- >
- );
- return (
- }
- onClose={onClose}
- onConfirm={onClose}
- />
- );
-}
-
-export function FailedTransactionDialog(props: TransactionDialogProps) {
- const { transfer, visible, onClose } = props;
- const { tenantName } = useGlobalState();
- const stellarAsset = convertCurrencyToStellarAsset(transfer.original.asset)?.getCode();
- const amountToSend = nativeToDecimal(transfer.original.amount.add(transfer.original.fee).toNumber()).toNumber();
- const compensation = 0.05;
- const content = (
- <>
- {`${amountToSend} ${stellarAsset}`}
-
- >
- );
- const footer = (
-
-
- The vault did not send PEN to you on time. Don`t worry - your funds are safe! You`ll get {compensation} PEN
- compensation.
-
-
-
- To redeem your {stellarAsset}, you must now pick one of the two options:
-
-
- 1. Receive compensation of {compensation} {stellarAsset} and retry with another vault.{' '}
- Compensate
-
-
- 2. Burn {stellarAsset} and get {amountToSend} {stellarAsset} with added {compensation} {stellarAsset} as
- compensation. Reimburse
-
-
- );
- return (
- }
- onClose={onClose}
- onConfirm={onClose}
- />
- );
-}
-
-export default BaseTransactionDialog;
diff --git a/src/pages/spacewalk/transactions/TransferDialog/BridgeFeeCollapse/index.tsx b/src/pages/spacewalk/transactions/TransferDialog/BridgeFeeCollapse/index.tsx
new file mode 100644
index 00000000..0b0da43b
--- /dev/null
+++ b/src/pages/spacewalk/transactions/TransferDialog/BridgeFeeCollapse/index.tsx
@@ -0,0 +1,48 @@
+import { nativeToDecimal } from '../../../../../shared/parseNumbers/metric';
+import { Collapse } from '../../../../../components/Collapse';
+import { AddressDisplay } from '../../../../../components/LabeledCopyablePublicKey';
+import { TTransfer } from '../../TransactionsColumns';
+
+interface BridgeFeeCollapseProps {
+ transfer: TTransfer;
+ showMemo?: boolean;
+ destinationStellarAddress: string;
+ tenantName: string;
+ vaultStellarPublicKey?: string;
+ expectedStellarMemo: string;
+}
+
+export function BridgeFeeCollapse({
+ transfer,
+ showMemo,
+ destinationStellarAddress,
+ tenantName,
+ vaultStellarPublicKey,
+ expectedStellarMemo,
+}: BridgeFeeCollapseProps) {
+ const title = (
+ <>
+ Bridge fee
+ {nativeToDecimal(transfer.original.fee.toNumber()).toString()}
+ >
+ );
+ return (
+
+ <>
+
+
+ {vaultStellarPublicKey && }
+ {showMemo && }
+ >
+
+ );
+}
diff --git a/src/pages/spacewalk/transactions/TransferDialog/TransferDialog.tsx b/src/pages/spacewalk/transactions/TransferDialog/TransferDialog.tsx
index ebb52219..a67b4e4b 100644
--- a/src/pages/spacewalk/transactions/TransferDialog/TransferDialog.tsx
+++ b/src/pages/spacewalk/transactions/TransferDialog/TransferDialog.tsx
@@ -1,5 +1,5 @@
import { hexToU8a } from '@polkadot/util';
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
import { Divider } from 'react-daisyui';
import { useGlobalState } from '../../../../GlobalStateProvider';
@@ -7,10 +7,9 @@ import { deriveShortenedRequestId } from '../../../../helpers/spacewalk';
import { convertRawHexKeyToPublicKey } from '../../../../helpers/stellar';
import { toTitle } from '../../../../helpers/string';
import { useVaultRegistryPallet } from '../../../../hooks/spacewalk/useVaultRegistryPallet';
-import { nativeToDecimal } from '../../../../shared/parseNumbers/metric';
-import { CopyablePublicKey } from '../../../../components/PublicKey/CopyablePublicKey';
import { Dialog } from '../../../../components/Dialog';
import { TTransfer } from '../TransactionsColumns';
+import { BridgeFeeCollapse } from './BridgeFeeCollapse';
export interface BaseTransferDialogProps {
id: string;
@@ -33,19 +32,6 @@ export function BaseTransferDialog(props: BaseTransferDialogProps) {
const tenantNameCapitalized = tenantName ? toTitle(tenantName) : 'Pendulum';
const [vaultStellarPublicKey, setVaultStellarPublicKey] = useState(undefined);
- const [collapseVisibility, setCollapseVisibility] = useState('');
-
- const toggle = useCallback(() => {
- if (collapseVisibility === '') {
- setCollapseVisibility('collapse-open');
- } else {
- setCollapseVisibility('');
- const elem = document.activeElement;
- if (elem && elem instanceof HTMLElement) {
- elem.blur();
- }
- }
- }, [collapseVisibility, setCollapseVisibility]);
// The `stellarAddress` contained in the request will either be the user's Stellar address or the vault's Stellar address (i.e. equal to `vaultStellarPublicKey`).
const destinationStellarAddress = convertRawHexKeyToPublicKey(transfer.original.stellarAddress.toHex()).publicKey();
@@ -73,62 +59,17 @@ export function BaseTransferDialog(props: BaseTransferDialogProps) {
{statusIcon}
-
{title}
+
{title}
{content}
-
-
-
-
Bridge fee
-
{nativeToDecimal(transfer.original.fee.toNumber()).toString()}
-
-
-
-
Destination Address (Stellar)
-
-
-
-
Vault Address ({tenantNameCapitalized})
-
-
- {vaultStellarPublicKey && (
-
-
Vault Address (Stellar)
-
-
- )}
- {showMemo && (
-
- )}
-
-
+
+
{footer}
>
diff --git a/src/pages/spacewalk/transactions/index.tsx b/src/pages/spacewalk/transactions/index.tsx
index 6ab15c70..6628d583 100644
--- a/src/pages/spacewalk/transactions/index.tsx
+++ b/src/pages/spacewalk/transactions/index.tsx
@@ -14,12 +14,12 @@ import { useSecurityPallet } from '../../../hooks/spacewalk/useSecurityPallet';
import { nativeToDecimal } from '../../../shared/parseNumbers/metric';
import {
- CancelledTransactionDialog,
- CompletedTransactionDialog,
- FailedTransactionDialog,
- PendingTransactionDialog,
- ReimbursedTransactionDialog,
-} from './TransactionDialog';
+ CancelledTransferDialog,
+ CompletedTransferDialog,
+ FailedTransferDialog,
+ PendingTransferDialog,
+ ReimbursedTransferDialog,
+} from './TransferDialog';
import {
TTransfer,
TransferType,
@@ -132,11 +132,11 @@ function Transactions(): JSX.Element {
);
const dialogs: Record = {
- Pending: getDialog(PendingTransactionDialog),
- Completed: getDialog(CompletedTransactionDialog),
- Reimbursed: getDialog(ReimbursedTransactionDialog),
- Cancelled: getDialog(CancelledTransactionDialog),
- Failed: getDialog(FailedTransactionDialog),
+ Pending: getDialog(PendingTransferDialog),
+ Completed: getDialog(CompletedTransferDialog),
+ Reimbursed: getDialog(ReimbursedTransferDialog),
+ Cancelled: getDialog(CancelledTransferDialog),
+ Failed: getDialog(FailedTransferDialog),
};
return (