Skip to content

Commit

Permalink
refactor: enable hints for multipayments on transaction summary modal (…
Browse files Browse the repository at this point in the history 
…#803)

Co-authored-by: shahin-hq <[email protected]>
  • Loading branch information
@patricio0312rev @shahin-hq
patricio0312rev and shahin-hq authored Nov 18, 2024
1 parent 29273b3 commit 89d8c0d
Show file tree
Hide file tree
Showing 12 changed files with 98 additions and 56 deletions.
8 changes: 4 additions & 4 deletions src/app/components/Notifications/__snapshots__/NotificationsDropdown.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -533,18 +533,18 @@ exports[`Notifications > should open and close transaction details modal 1`] = `
Amount
</div>
<div
class="flex h-full items-center justify-center rounded px-1.5 css-xqt0aw"
color="danger-bg"
class="flex items-center justify-center px-1.5 h-[21px] rounded dark:border css-1sycv4s"
color="secondary"
data-testid="AmountLabel__wrapper"
>
<div
class="flex h-full items-center space-x-1"
>
<span
class="whitespace-nowrap text-sm leading-[17px] sm:text-base sm:leading-5"
class="whitespace-nowrap text-sm"
data-testid="Amount"
>
- 1 DARK
0.71370675 DARK
</span>
</div>
</div>
Expand Down
8 changes: 4 additions & 4 deletions ...nsaction/components/MultiSignatureDetail/__snapshots__/MultiSignatureDetail.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -498,18 +498,18 @@ exports[`MultiSignatureDetail > should not broadcast if wallet is not ready to d
Amount
</div>
<div
class="flex h-full items-center justify-center rounded px-1.5 css-1jspzfx"
color="success-bg"
class="flex items-center justify-center px-1.5 h-[21px] rounded dark:border css-xqt0aw"
color="danger-bg"
data-testid="AmountLabel__wrapper"
>
<div
class="flex h-full items-center space-x-1"
>
<span
class="whitespace-nowrap text-sm leading-[17px] sm:text-base sm:leading-5"
class="whitespace-nowrap text-sm"
data-testid="Amount"
>
+ 1 DARK
- 2 DARK
</span>
</div>
</div>
Expand Down
6 changes: 3 additions & 3 deletions src/domains/transaction/components/MultiSignatureDetail/__snapshots__/SentStep.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -546,18 +546,18 @@ exports[`Multisignature Detail Sent Step > should render sent step %s 1`] = `
Amount
</div>
<div
class="flex h-full items-center justify-center rounded px-1.5 css-xqt0aw"
class="flex items-center justify-center px-1.5 h-[21px] rounded dark:border css-xqt0aw"
color="danger-bg"
data-testid="AmountLabel__wrapper"
>
<div
class="flex h-full items-center space-x-1"
>
<span
class="whitespace-nowrap text-sm leading-[17px] sm:text-base sm:leading-5"
class="whitespace-nowrap text-sm"
data-testid="Amount"
>
- 100 DARK
- 121 DARK
</span>
</div>
</div>
Expand Down
10 changes: 3 additions & 7 deletions ...omains/transaction/components/TransactionDetail/TransactionSummary/TransactionSummary.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,9 @@ import React, { ReactElement } from "react";
import { useTranslation } from "react-i18next";
import { Contracts, DTO } from "@ardenthq/sdk-profiles";
import { DetailDivider, DetailLabelText, DetailWrapper } from "@/app/components/DetailWrapper";
import { Amount, AmountLabel } from "@/app/components/Amount";
import { Amount } from "@/app/components/Amount";
import { BigNumber } from "@ardenthq/sdk-helpers";
import { TransactionAmountLabel } from "@/domains/transaction/components/TransactionTable/TransactionRow/TransactionAmount.blocks";

interface Properties {
transaction: DTO.ExtendedSignedTransactionData | DTO.ExtendedConfirmedTransactionData;
Expand All @@ -20,12 +21,7 @@ export const TransactionSummary = ({ transaction, senderWallet, labelClassName }
<>
<div className="flex w-full justify-between sm:justify-start">
<DetailLabelText className={labelClassName}>{t("COMMON.AMOUNT")}</DetailLabelText>
<AmountLabel
isNegative={transaction.isSent()}
value={transaction.amount()}
ticker={senderWallet.currency()}
textClassName="text-sm leading-[17px] sm:text-base sm:leading-5"
/>
<TransactionAmountLabel transaction={transaction} />
</div>

<DetailDivider />
Expand Down
76 changes: 55 additions & 21 deletions ...tion/components/TransactionDetailModal/__snapshots__/TransactionDetailModal.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -467,18 +467,18 @@ exports[`TransactionDetailModal > should render a ipfs modal 1`] = `
Amount
</div>
<div
class="flex h-full items-center justify-center rounded px-1.5 css-xqt0aw"
class="flex items-center justify-center px-1.5 h-[21px] rounded dark:border css-xqt0aw"
color="danger-bg"
data-testid="AmountLabel__wrapper"
>
<div
class="flex h-full items-center space-x-1"
>
<span
class="whitespace-nowrap text-sm leading-[17px] sm:text-base sm:leading-5"
class="whitespace-nowrap text-sm"
data-testid="Amount"
>
- 100 DARK
- 121 DARK
</span>
</div>
</div>
Expand Down Expand Up @@ -1195,18 +1195,18 @@ exports[`TransactionDetailModal > should render a magistrate modal 1`] = `
Amount
</div>
<div
class="flex h-full items-center justify-center rounded px-1.5 css-xqt0aw"
class="flex items-center justify-center px-1.5 h-[21px] rounded dark:border css-xqt0aw"
color="danger-bg"
data-testid="AmountLabel__wrapper"
>
<div
class="flex h-full items-center space-x-1"
>
<span
class="whitespace-nowrap text-sm leading-[17px] sm:text-base sm:leading-5"
class="whitespace-nowrap text-sm"
data-testid="Amount"
>
- 100 DARK
- 121 DARK
</span>
</div>
</div>
Expand Down Expand Up @@ -2005,18 +2005,52 @@ exports[`TransactionDetailModal > should render a multi payment modal 1`] = `
Amount
</div>
<div
class="flex h-full items-center justify-center rounded px-1.5 css-xqt0aw"
class="flex items-center justify-center pr-1.5 h-[21px] rounded dark:border css-xqt0aw"
color="danger-bg"
data-testid="AmountLabel__wrapper"
>
<div
class="flex h-full items-center space-x-1"
>
<div
class="flex items-center justify-center bg-theme-danger-info-border text-theme-danger-info-text dark:text-white/70 w-5 self-stretch"
data-testid="AmountLabel__hint"
>
<div
class="dark:text-white css-15txs7d"
height="10"
width="10"
>
<svg
id="hint-small"
viewBox="0 0 10 10"
x="0"
xml:space="preserve"
xmlns="http://www.w3.org/2000/svg"
y="0"
>
<path
d="M7 9H5.503A.503.503 0 0 1 5 8.497V4.503A.503.503 0 0 0 4.497 4H3.5"
fill="none"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
/>
<circle
cx="4.5"
cy="1"
fill="currentColor"
r="1"
/>
</svg>
</div>
</div>
<span
class="whitespace-nowrap text-sm leading-[17px] sm:text-base sm:leading-5"
class="whitespace-nowrap text-sm"
data-testid="Amount"
>
- 100 DARK
- 119 DARK
</span>
</div>
</div>
Expand Down Expand Up @@ -2928,18 +2962,18 @@ exports[`TransactionDetailModal > should render a multi signature modal 1`] = `
Amount
</div>
<div
class="flex h-full items-center justify-center rounded px-1.5 css-xqt0aw"
class="flex items-center justify-center px-1.5 h-[21px] rounded dark:border css-xqt0aw"
color="danger-bg"
data-testid="AmountLabel__wrapper"
>
<div
class="flex h-full items-center space-x-1"
>
<span
class="whitespace-nowrap text-sm leading-[17px] sm:text-base sm:leading-5"
class="whitespace-nowrap text-sm"
data-testid="Amount"
>
- 100 DARK
- 121 DARK
</span>
</div>
</div>
Expand Down Expand Up @@ -3936,18 +3970,18 @@ exports[`TransactionDetailModal > should render a transfer modal 1`] = `
Amount
</div>
<div
class="flex h-full items-center justify-center rounded px-1.5 css-xqt0aw"
class="flex items-center justify-center px-1.5 h-[21px] rounded dark:border css-xqt0aw"
color="danger-bg"
data-testid="AmountLabel__wrapper"
>
<div
class="flex h-full items-center space-x-1"
>
<span
class="whitespace-nowrap text-sm leading-[17px] sm:text-base sm:leading-5"
class="whitespace-nowrap text-sm"
data-testid="Amount"
>
- 100 DARK
- 121 DARK
</span>
</div>
</div>
Expand Down Expand Up @@ -4738,18 +4772,18 @@ exports[`TransactionDetailModal > should render a transfer modal with memo 1`] =
Amount
</div>
<div
class="flex h-full items-center justify-center rounded px-1.5 css-xqt0aw"
class="flex items-center justify-center px-1.5 h-[21px] rounded dark:border css-xqt0aw"
color="danger-bg"
data-testid="AmountLabel__wrapper"
>
<div
class="flex h-full items-center space-x-1"
>
<span
class="whitespace-nowrap text-sm leading-[17px] sm:text-base sm:leading-5"
class="whitespace-nowrap text-sm"
data-testid="Amount"
>
- 100 DARK
- 121 DARK
</span>
</div>
</div>
Expand Down Expand Up @@ -5466,18 +5500,18 @@ exports[`TransactionDetailModal > should render an unlock tokens modal 1`] = `
Amount
</div>
<div
class="flex h-full items-center justify-center rounded px-1.5 css-xqt0aw"
class="flex items-center justify-center px-1.5 h-[21px] rounded dark:border css-xqt0aw"
color="danger-bg"
data-testid="AmountLabel__wrapper"
>
<div
class="flex h-full items-center space-x-1"
>
<span
class="whitespace-nowrap text-sm leading-[17px] sm:text-base sm:leading-5"
class="whitespace-nowrap text-sm"
data-testid="Amount"
>
- 100 DARK
- 121 DARK
</span>
</div>
</div>
Expand Down
4 changes: 3 additions & 1 deletion src/domains/transaction/components/UnlockTokens/UnlockTokensModal.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,7 @@ describe("UnlockTokensModal", () => {
isIpfs: () => false,
isMultiPayment: () => false,
isMultiSignatureRegistration: () => false,
isReturn: () => false,
isSent: () => true,
isTransfer: () => true,
isUnlockToken: () => true,
Expand All @@ -95,6 +96,7 @@ describe("UnlockTokensModal", () => {
recipient: () => wallet.address(),
sender: () => transactionFixture.data.sender.address,
timestamp: () => DateTime.make(),
total: () => 30,
type: () => "unlockToken",
usesMultiSignature: () => false,
wallet: () => wallet,
Expand Down Expand Up @@ -198,7 +200,7 @@ describe("UnlockTokensModal", () => {

// continue to auth step

userEvent.click(screen.getByText(translations.COMMON.CONFIRM));
await userEvent.click(screen.getByText(translations.COMMON.CONFIRM));

await expect(screen.findByTestId("AuthenticationStep")).resolves.toBeVisible();

Expand Down
2 changes: 2 additions & 0 deletions src/domains/transaction/pages/SendDelegateResignation/SendDelegateResignation.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,7 @@ const transactionResponse = {
isIpfs: () => false,
isMultiPayment: () => false,
isMultiSignatureRegistration: () => false,
isReturn: () => false,
isSent: () => true,
isTransfer: () => false,
isUnvote: () => false,
Expand All @@ -75,6 +76,7 @@ const transactionResponse = {
recipient: () => transactionFixture.data.recipient,
sender: () => transactionFixture.data.sender,
timestamp: () => DateTime.make(),
total: () => +transactionFixture.data.amount / 1e8,
type: () => "delegateResignation",
usesMultiSignature: () => false,
wallet: () => wallet,
Expand Down
2 changes: 2 additions & 0 deletions src/domains/transaction/pages/SendTransfer/SendTransfer.Fees.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@ const createTransactionMock = (wallet: Contracts.IReadWriteWallet) =>
isIpfs: () => false,
isMultiPayment: () => false,
isMultiSignatureRegistration: () => false,
isReturn: () => false,
isSent: () => true,
isTransfer: () => true,
isUnvote: () => false,
Expand All @@ -59,6 +60,7 @@ const createTransactionMock = (wallet: Contracts.IReadWriteWallet) =>
],
sender: () => transactionFixture.data.sender,
timestamp: () => DateTime.make(),
total: () => +transactionFixture.data.amount / 1e8,
type: () => "transfer",
usesMultiSignature: () => false,
wallet: () => wallet,
Expand Down
4 changes: 4 additions & 0 deletions src/domains/transaction/pages/SendTransfer/SendTransfer.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,7 @@ const createTransactionMock = (wallet: Contracts.IReadWriteWallet) =>
isIpfs: () => false,
isMultiPayment: () => false,
isMultiSignatureRegistration: () => false,
isReturn: () => false,
isSent: () => true,
isTransfer: () => true,
isUnvote: () => false,
Expand All @@ -78,6 +79,7 @@ const createTransactionMock = (wallet: Contracts.IReadWriteWallet) =>
],
sender: () => transactionFixture.data.sender,
timestamp: () => DateTime.make(),
total: () => +transactionFixture.data.amount / 1e8,
type: () => "transfer",
usesMultiSignature: () => false,
wallet: () => wallet,
Expand Down Expand Up @@ -1344,6 +1346,7 @@ describe("SendTransfer", () => {
convertedTotal: () => 0,
isConfirmed: () => false,
isMultiPayment: () => false,
isReturn: () => false,
isSent: () => true,
isTransfer: () => true,
isUnvote: () => false,
Expand All @@ -1359,6 +1362,7 @@ describe("SendTransfer", () => {
convertedTotal: () => 0,
isConfirmed: () => false,
isMultiPayment: () => true,
isReturn: () => false,
isSent: () => true,
isTransfer: () => false,
isUnvote: () => false,
Expand Down
Loading

0 comments on commit 89d8c0d

Please sign in to comment.