Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

(Deposit/Withdraw) Address design feedback for Bitcoin deposits and withdrawals #4010

Merged
merged 3 commits into from
Dec 12, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/web/components/bridge/amount-screen.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -1177,7 +1177,7 @@ export const AmountScreen = observer(
<h6 className="flex items-center gap-3">
{toChain?.chainType === "bitcoin" &&
direction === "withdraw"
? t("transfer.continue")
? t("transfer.confirmAmount")
: pendingChainApproval
? t("transfer.pendingApproval")
: t("transfer.connectTo", {
Expand Down
4 changes: 2 additions & 2 deletions packages/web/components/bridge/bridge-wallet-select-modal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ export const BridgeWalletSelectModal: FunctionComponent<
props.direction === "withdraw" &&
props.toChain.chainType === "bitcoin"
) {
modalTitle = t("transfer.inputBitcoinAddress");
modalTitle = t("transfer.enterBitcoinAddress");
} else {
modalTitle = t("transfer.selectWithdrawWallet", {
network: props.toChain.prettyName,
Expand Down Expand Up @@ -578,7 +578,7 @@ const SendToAnotherAddressForm: FunctionComponent<
<Button
onClick={handleConfirm}
disabled={!isAcknowledged || isInvalidAddress || !address}
className="w-full"
className="w-full !text-subtitle1"
>
{t("transfer.done")}
</Button>
Expand Down
25 changes: 21 additions & 4 deletions packages/web/components/bridge/deposit-address-screen.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,7 @@ export const DepositAddressScreen = observer(
)}
>
{showQrCode ? (
<div className="z-20 flex w-full items-center gap-4 rounded-2xl bg-osmoverse-100 p-4">
<div className="z-20 flex w-full items-center gap-4 rounded-2xl bg-osmoverse-100 p-4 relative">
<div className="flex h-[180px] w-[180px] items-center justify-center">
{isLoading || !data?.depositData?.depositAddress ? (
<Spinner className="text-black" />
Expand Down Expand Up @@ -188,6 +188,13 @@ export const DepositAddressScreen = observer(
: t("transfer.copyToClipboard")}
</button>
</div>
<IconButton
aria-label="Close"
data-testid="close"
className="absolute transition-colors duration-200 top-0 right-0 !bg-transparent !shadow-none z-50 !h-12 !w-12 cursor-pointer !py-0 text-wosmongton-800 hover:text-osmoverse-500"
icon={<Icon id="close" className="w-4 h-4" />}
onClick={() => setShowQrCode(false)}
/>
</div>
) : (
<div className="z-20 flex w-full items-center justify-between rounded-2xl bg-osmoverse-850 p-4">
Expand Down Expand Up @@ -443,8 +450,12 @@ const TransferDetails: FunctionComponent<{
{totalFees
.inequalitySymbol(showTotalFeeIneqSymbol)
.toString()}
{" + "}
{depositData.providerFee.toString()}{" "}
{!depositData.providerFee.toDec().isZero() && (
<>
{" + "}
{depositData.providerFee.toString()}
</>
)}{" "}
{t("transfer.fees")}
</span>
)}
Expand Down Expand Up @@ -521,7 +532,13 @@ const ProviderFeesRow: FunctionComponent<{
label={t("transfer.providerFees")}
isLoading={isRefetchingQuote}
>
<p className="text-osmoverse-100">{depositData.providerFee.toString()}</p>
{depositData.providerFee.toDec().isZero() ? (
<p className="text-bullish-400">{t("transfer.free")}</p>
) : (
<p className="text-osmoverse-100">
{depositData.providerFee.toString()}
</p>
)}
</QuoteDetailRow>
);
};
Expand Down
4 changes: 2 additions & 2 deletions packages/web/components/input/textarea-box.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ export const TextareaBox: FunctionComponent<TextareaBoxProps> = ({
key={textareaKey}
ref={textareaRef}
className={classNames(
"md:leading-0 w-full resize-none appearance-none bg-transparent pt-px align-middle leading-10 outline-none placeholder:text-osmoverse-500 md:p-0",
"w-full resize-none appearance-none bg-transparent py-2 align-middle outline-none placeholder:text-osmoverse-500 md:p-0",
{
"text-white-disabled": disabled,
"text-white-high": currentValue != "" && !disabled,
Expand Down Expand Up @@ -103,7 +103,7 @@ export const TextareaBox: FunctionComponent<TextareaBoxProps> = ({
/>

{trailingSymbol && (
<span className={classNames("pt-3", classes?.trailingSymbol)}>
<span className={classNames("pt-2", classes?.trailingSymbol)}>
{trailingSymbol}
</span>
)}
Expand Down
5 changes: 3 additions & 2 deletions packages/web/components/nomic/nomic-pending-transfers.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ const useNomicTransactionsStore = create(
transactions: new Map(),
upsertTransaction: (transactions) => {
set((state) => {
const nextTransactions = state.transactions;
const nextTransactions = new Map(state.transactions);
transactions.forEach((transaction) => {
nextTransactions.set(transaction.transactionId, transaction);
});
Expand Down Expand Up @@ -336,7 +336,8 @@ const TransactionDetailsModal = ({
</p>
</div>
</div>
<p className="body1 text-osmoverse-300">bc0123ab...456def</p>
{/* TODO: Get origin bitcoin address from pending deposit */}
{/* <p className="body1 text-osmoverse-300">bc0123ab...456def</p> */}
</div>

<div className="flex h-12 w-12 items-center justify-center self-start">
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/de.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "Diese Adresse läuft bald ab. Bitte fordern Sie eine neue Adresse an, um Geldverluste zu vermeiden.",
"createNewDepositAddress": "Neue Einzahlungsadresse erstellen",
"transactionDetails": "Details der Transaktion",
"continue": "Weitermachen",
"inputBitcoinAddress": "Bitcoin-Adresse eingeben"
"confirmAmount": "Betrag bestätigen",
"enterBitcoinAddress": "Bitcoin-Adresse eingeben"
},
"unknownError": "Unbekannter Fehler",
"viewExplorer": "Explorer anzeigen",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "This address is about to expire. Please request a new address to avoid losing funds.",
"createNewDepositAddress": "Create new deposit address",
"transactionDetails": "Transaction details",
"continue": "Continue",
"inputBitcoinAddress": "Input Bitcoin address"
"confirmAmount": "Confirm Amount",
"enterBitcoinAddress": "Enter Bitcoin address"
},
"unknownError": "Unknown error",
"viewExplorer": "View explorer",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/es.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "Esta dirección está a punto de caducar. Solicite una nueva dirección para evitar perder fondos.",
"createNewDepositAddress": "Crear nueva dirección de depósito",
"transactionDetails": "Detalles de la transacción",
"continue": "Continuar",
"inputBitcoinAddress": "Introducir dirección de Bitcoin"
"confirmAmount": "Confirmar importe",
"enterBitcoinAddress": "Introducir dirección de Bitcoin"
},
"unknownError": "Error desconocido",
"viewExplorer": "Ver Explorador",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/fa.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "این آدرس رو به اتمام است. لطفاً برای جلوگیری از از دست دادن وجوه، یک آدرس جدید درخواست کنید.",
"createNewDepositAddress": "آدرس سپرده جدید ایجاد کنید",
"transactionDetails": "جزئیات معامله",
"continue": "ادامه دهید",
"inputBitcoinAddress": "آدرس بیت کوین را وارد کنید"
"confirmAmount": "مبلغ را تأیید کنید",
"enterBitcoinAddress": "آدرس بیت کوین را وارد کنید"
},
"unknownError": "خطای نا شناس",
"viewExplorer": "مشاهده جزئیات تراکنش",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/fr.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "Cette adresse est sur le point d'expirer. Veuillez demander une nouvelle adresse pour éviter de perdre des fonds.",
"createNewDepositAddress": "Créer une nouvelle adresse de dépôt",
"transactionDetails": "Détails de la transaction",
"continue": "Continuer",
"inputBitcoinAddress": "Entrez l'adresse Bitcoin"
"confirmAmount": "Confirmer le montant",
"enterBitcoinAddress": "Entrez l'adresse Bitcoin"
},
"unknownError": "Erreur inconnue",
"viewExplorer": "Voir dans l'exploreur",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/gu.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "આ સરનામું સમાપ્ત થવામાં છે. ભંડોળ ગુમાવવાનું ટાળવા માટે કૃપા કરીને નવા સરનામાની વિનંતી કરો.",
"createNewDepositAddress": "નવું ડિપોઝિટ સરનામું બનાવો",
"transactionDetails": "વ્યવહારની વિગતો",
"continue": "ચાલુ રાખો",
"inputBitcoinAddress": "ઇનપુટ Bitcoin સરનામું"
"confirmAmount": "રકમની પુષ્ટિ કરો",
"enterBitcoinAddress": "Bitcoin સરનામું દાખલ કરો"
},
"unknownError": "અજાણી ભૂલ",
"viewExplorer": "સંશોધક જુઓ",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/hi.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "यह पता समाप्त होने वाला है। कृपया धनराशि खोने से बचने के लिए नया पता मांगें।",
"createNewDepositAddress": "नया जमा पता बनाएं",
"transactionDetails": "लेन-देन विवरण",
"continue": "जारी रखना",
"inputBitcoinAddress": "बिटकॉइन पता इनपुट करें"
"confirmAmount": "राशि की पुष्टि करें",
"enterBitcoinAddress": "बिटकॉइन पता दर्ज करें"
},
"unknownError": "अज्ञात त्रुटि",
"viewExplorer": "एक्सप्लोरर देखें",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/ja.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "このアドレスは有効期限が近づいています。資金の損失を避けるために、新しいアドレスをリクエストしてください。",
"createNewDepositAddress": "新しい入金アドレスを作成する",
"transactionDetails": "取引の詳細",
"continue": "続く",
"inputBitcoinAddress": "Bitcoinアドレスを入力"
"confirmAmount": "金額を確認",
"enterBitcoinAddress": "ビットコインアドレスを入力"
},
"unknownError": "不明なエラー",
"viewExplorer": "エクスプローラーを表示する",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/ko.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "이 주소는 곧 만료됩니다. 자금 손실을 피하려면 새 주소를 요청하세요.",
"createNewDepositAddress": "새로운 입금 주소 생성",
"transactionDetails": "거래내역",
"continue": "계속하다",
"inputBitcoinAddress": "비트코인 주소를 입력하세요"
"confirmAmount": "금액 확인",
"enterBitcoinAddress": "비트코인 주소를 입력하세요"
},
"unknownError": "알 수 없는 에러",
"viewExplorer": "블록 익스플로러 보기",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/pl.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "Ten adres wkrótce wygaśnie. Poproś o nowy adres, aby uniknąć utraty środków.",
"createNewDepositAddress": "Utwórz nowy adres depozytowy",
"transactionDetails": "Szczegóły transakcji",
"continue": "Kontynuować",
"inputBitcoinAddress": "Wprowadź adres Bitcoin"
"confirmAmount": "Potwierdź kwotę",
"enterBitcoinAddress": "Wprowadź adres Bitcoin"
},
"unknownError": "Nieznany błąd",
"viewExplorer": "zobacz eksplorer",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/pt-br.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "Este endereço está prestes a expirar. Solicite um novo endereço para evitar perda de fundos.",
"createNewDepositAddress": "Criar novo endereço de depósito",
"transactionDetails": "Detalhes da transação",
"continue": "Continuar",
"inputBitcoinAddress": "Insira o endereço do Bitcoin"
"confirmAmount": "Confirmar valor",
"enterBitcoinAddress": "Insira o endereço do Bitcoin"
},
"unknownError": "Erro desconhecido",
"viewExplorer": "Visualizar explorer",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/ro.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "Această adresă este pe cale să expire. Vă rugăm să solicitați o nouă adresă pentru a evita pierderea fondurilor.",
"createNewDepositAddress": "Creați o nouă adresă de depozit",
"transactionDetails": "Detalii tranzacție",
"continue": "Continua",
"inputBitcoinAddress": "Introdu adresa Bitcoin"
"confirmAmount": "Confirmați suma",
"enterBitcoinAddress": "Introdu adresa Bitcoin"
},
"unknownError": "Eroare necunoscuta",
"viewExplorer": "vezi explorer",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/ru.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "Срок действия этого адреса истекает. Пожалуйста, запросите новый адрес, чтобы избежать потери средств.",
"createNewDepositAddress": "Создать новый адрес депозита",
"transactionDetails": "Подробности транзакции",
"continue": "Продолжать",
"inputBitcoinAddress": "Введите адрес Bitcoin"
"confirmAmount": "Подтвердите сумму",
"enterBitcoinAddress": "Введите адрес Bitcoin"
},
"unknownError": "Неизвестная ошибка",
"viewExplorer": "Посмотреть проводник",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/tr.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "Bu adresin süresi dolmak üzere. Lütfen para kaybetmemek için yeni bir adres talep edin.",
"createNewDepositAddress": "Yeni para yatırma adresi oluştur",
"transactionDetails": "İşlem detayları",
"continue": "Devam etmek",
"inputBitcoinAddress": "Bitcoin adresini girin"
"confirmAmount": "Tutarı Onayla",
"enterBitcoinAddress": "Bitcoin adresini girin"
},
"unknownError": "Bilinmeyen hata",
"viewExplorer": "gezginde görüntüle",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/zh-cn.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "此地址即将过期。请申请新地址以避免资金损失。",
"createNewDepositAddress": "创建新的存款地址",
"transactionDetails": "交易详情",
"continue": "继续",
"inputBitcoinAddress": "输入比特币地址"
"confirmAmount": "确认金额",
"enterBitcoinAddress": "输入比特币地址"
},
"unknownError": "未知错误",
"viewExplorer": "浏览器查看",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/zh-hk.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "該地址即將過期。請申請新地址以避免資金損失。",
"createNewDepositAddress": "建立新的儲值地址",
"transactionDetails": "交易詳情",
"continue": "繼續",
"inputBitcoinAddress": "輸入比特幣地址"
"confirmAmount": "確認金額",
"enterBitcoinAddress": "輸入比特幣地址"
},
"unknownError": "未知錯誤",
"viewExplorer": "使用區塊瀏覽器查看",
Expand Down
4 changes: 2 additions & 2 deletions packages/web/localizations/zh-tw.json
Original file line number Diff line number Diff line change
Expand Up @@ -928,8 +928,8 @@
"addressAboutToExpire": "該地址即將過期。請申請新地址以避免資金損失。",
"createNewDepositAddress": "建立新的儲值地址",
"transactionDetails": "交易詳情",
"continue": "繼續",
"inputBitcoinAddress": "輸入比特幣地址"
"confirmAmount": "確認金額",
"enterBitcoinAddress": "輸入比特幣地址"
},
"unknownError": "未知錯誤",
"viewExplorer": "使用區塊瀏覽器查看",
Expand Down
Loading