From 47dfb87e1d85f36d915a1b50ec1cbcb8227a6afc Mon Sep 17 00:00:00 2001 From: Timea <117268143+Tymmmy@users.noreply.github.com> Date: Thu, 23 Jan 2025 12:56:38 +0200 Subject: [PATCH] fix: PP for cards did not display correctly everywhere (#1882) * fix PP for cards display * Update helpers.ts * Update WalletAddressesTable.tsx --- .../src/components/WalletAddressesTable.tsx | 14 ++++++++------ .../frontend/src/pages/account/[accountId].tsx | 11 +++++++++-- packages/wallet/frontend/src/pages/request.tsx | 3 ++- packages/wallet/frontend/src/pages/send.tsx | 3 ++- .../frontend/src/pages/settings/developer-keys.tsx | 11 +++++++++-- packages/wallet/frontend/src/utils/helpers.ts | 12 ++++++++++++ 6 files changed, 42 insertions(+), 12 deletions(-) diff --git a/packages/wallet/frontend/src/components/WalletAddressesTable.tsx b/packages/wallet/frontend/src/components/WalletAddressesTable.tsx index 4877ed9b4..b6c34e287 100644 --- a/packages/wallet/frontend/src/components/WalletAddressesTable.tsx +++ b/packages/wallet/frontend/src/components/WalletAddressesTable.tsx @@ -16,6 +16,10 @@ import { } from '@/ui/Tooltip' import { copyToClipboard } from '@/ui/CopyButton' import { createContext, useContext, useEffect, useState } from 'react' +import { + replaceCardWalletAddressDomain, + replaceWalletAddressProtocol +} from '@/utils/helpers' interface WalletAddressesTableProps { account: Account @@ -101,12 +105,10 @@ export const CopyWalletAddress = () => { const { walletAddress } = useContext(WalletAddressRowContext) const [isCopied, setIsCopied] = useState(false) - let pointer = walletAddress.url - - if (walletAddress.isCard) { - const url = new URL(walletAddress.url.replace('$', 'https://')) - pointer = `$ilp.dev${url.pathname}` - } + const pointer = replaceCardWalletAddressDomain( + replaceWalletAddressProtocol(walletAddress.url), + walletAddress.isCard + ) useEffect(() => { setTimeout(() => { diff --git a/packages/wallet/frontend/src/pages/account/[accountId].tsx b/packages/wallet/frontend/src/pages/account/[accountId].tsx index 6ca943ce2..4cf247bec 100644 --- a/packages/wallet/frontend/src/pages/account/[accountId].tsx +++ b/packages/wallet/frontend/src/pages/account/[accountId].tsx @@ -8,7 +8,11 @@ import { walletAddressService } from '@/lib/api/walletAddress' import { useOnboardingContext } from '@/lib/context/onboarding' import { useDialog } from '@/lib/hooks/useDialog' import { NextPageWithLayout } from '@/lib/types/app' -import { formatAmount, replaceWalletAddressProtocol } from '@/utils/helpers' +import { + formatAmount, + replaceCardWalletAddressDomain, + replaceWalletAddressProtocol +} from '@/utils/helpers' import type { GetServerSideProps, InferGetServerSidePropsType @@ -183,7 +187,10 @@ export const getServerSideProps: GetServerSideProps<{ } } walletAddressesResponse.result.map((pp) => { - pp.url = replaceWalletAddressProtocol(pp.url) + pp.url = replaceCardWalletAddressDomain( + replaceWalletAddressProtocol(pp.url), + pp.isCard + ) }) return { diff --git a/packages/wallet/frontend/src/pages/request.tsx b/packages/wallet/frontend/src/pages/request.tsx index 3a7c2b3e2..1e6181d40 100644 --- a/packages/wallet/frontend/src/pages/request.tsx +++ b/packages/wallet/frontend/src/pages/request.tsx @@ -13,6 +13,7 @@ import { SuccessDialog } from '@/components/dialogs/SuccessDialog' import { formatAmount, getObjectKeys, + replaceCardWalletAddressDomain, replaceWalletAddressProtocol } from '@/utils/helpers' import { Select, type SelectOption } from '@/ui/forms/Select' @@ -107,7 +108,7 @@ const RequestPage: NextPageWithLayout = ({ accounts }) => { const walletAddresses = walletAddressesResponse.result.map( (walletAddress) => ({ - label: `${walletAddress.publicName} (${replaceWalletAddressProtocol(walletAddress.url)})`, + label: `${walletAddress.publicName} (${replaceCardWalletAddressDomain(replaceWalletAddressProtocol(walletAddress.url), walletAddress.isCard)})`, value: walletAddress.id, url: walletAddress.url }) diff --git a/packages/wallet/frontend/src/pages/send.tsx b/packages/wallet/frontend/src/pages/send.tsx index 45863692c..45c81003d 100644 --- a/packages/wallet/frontend/src/pages/send.tsx +++ b/packages/wallet/frontend/src/pages/send.tsx @@ -16,6 +16,7 @@ import { SuccessDialog } from '@/components/dialogs/SuccessDialog' import { formatAmount, getObjectKeys, + replaceCardWalletAddressDomain, replaceWalletAddressProtocol } from '@/utils/helpers' import { useDialog } from '@/lib/hooks/useDialog' @@ -117,7 +118,7 @@ const SendPage: NextPageWithLayout = ({ accounts }) => { const walletAddresses = walletAddressesResponse.result.map( (walletAddress) => ({ - label: `${walletAddress.publicName} (${replaceWalletAddressProtocol(walletAddress.url)})`, + label: `${walletAddress.publicName} (${replaceCardWalletAddressDomain(replaceWalletAddressProtocol(walletAddress.url), walletAddress.isCard)})`, value: walletAddress.id }) ) diff --git a/packages/wallet/frontend/src/pages/settings/developer-keys.tsx b/packages/wallet/frontend/src/pages/settings/developer-keys.tsx index b101690a2..ab717011d 100644 --- a/packages/wallet/frontend/src/pages/settings/developer-keys.tsx +++ b/packages/wallet/frontend/src/pages/settings/developer-keys.tsx @@ -4,7 +4,11 @@ import { DeveloperKeys } from '@/components/settings/DeveloperKeys' import { SettingsTabs } from '@/components/SettingsTabs' import { Account, accountService } from '@/lib/api/account' import { NextPageWithLayout } from '@/lib/types/app' -import { formatDate, replaceWalletAddressProtocol } from '@/utils/helpers' +import { + formatDate, + replaceCardWalletAddressDomain, + replaceWalletAddressProtocol +} from '@/utils/helpers' import { GetServerSideProps, InferGetServerSidePropsType } from 'next/types' type DeveloperKeysPageProps = InferGetServerSidePropsType< @@ -44,7 +48,10 @@ export const getServerSideProps: GetServerSideProps<{ ...account, walletAddresses: account.walletAddresses.map((pp) => ({ ...pp, - url: replaceWalletAddressProtocol(pp.url), + url: replaceCardWalletAddressDomain( + replaceWalletAddressProtocol(pp.url), + pp.isCard + ), keys: pp.keys?.map((key) => ({ ...key, id: key.id, diff --git a/packages/wallet/frontend/src/utils/helpers.ts b/packages/wallet/frontend/src/utils/helpers.ts index c9afa425a..7eae6a143 100644 --- a/packages/wallet/frontend/src/utils/helpers.ts +++ b/packages/wallet/frontend/src/utils/helpers.ts @@ -140,6 +140,18 @@ export const replaceWalletAddressProtocol = ( : paymentPointer } +export const replaceCardWalletAddressDomain = ( + paymentPointer: string, + isCard?: boolean +): string => { + if (isCard) { + const url = new URL(paymentPointer.replace('$', 'https://')) + return `$ilp.dev${url.pathname}` + } else { + return paymentPointer + } +} + export function ab2str(buf: ArrayBuffer) { //@ts-expect-error: We know return String.fromCharCode.apply(null, new Uint8Array(buf))