From 14f2c222cfe3bef4bee3eead75b207d5c6c3aad4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ruveyda=20K=C4=B1=C5=9Fla?= Date: Sun, 28 Dec 2025 18:17:32 +0300 Subject: [PATCH 1/2] chore: delay isAuthenticated --- src/pages/Successful/index.tsx | 7 ++----- src/stellar/processes/connectWalletProcess.ts | 6 ++++-- 2 files changed, 6 insertions(+), 7 deletions(-) diff --git a/src/pages/Successful/index.tsx b/src/pages/Successful/index.tsx index 7a33e7e..2af71c0 100644 --- a/src/pages/Successful/index.tsx +++ b/src/pages/Successful/index.tsx @@ -79,7 +79,7 @@ const Successful = () => {
@@ -116,10 +116,7 @@ const Successful = () => { {waitingStatus === 'login' ? ( - ) : ( diff --git a/src/stellar/processes/connectWalletProcess.ts b/src/stellar/processes/connectWalletProcess.ts index d99e2b7..7057312 100644 --- a/src/stellar/processes/connectWalletProcess.ts +++ b/src/stellar/processes/connectWalletProcess.ts @@ -15,12 +15,14 @@ const connectWalletProcess = async (store: IStore, wallet: IWallet) => { if (publicKey && publicKey.trim() !== '') { const passphrase = await getWalletNetwork(wallet); - store.connectWalletSuccessful(publicKey, passphrase); - setRecentConnectionMethod(wallet.name); setTimeout(() => { store.setRoute(Route.SUCCESSFUL); + + setTimeout(() => { + store.connectWalletSuccessful(publicKey, passphrase); + }, 500); }, 500); } } catch { From 642a47893860c1ca95c0a3122760176cb4aa04fe Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ruveyda=20K=C4=B1=C5=9Fla?= Date: Fri, 2 Jan 2026 18:50:00 +0300 Subject: [PATCH 2/2] chore: fix alert copy variant --- src/assets/Icons.tsx | 8 +-- src/components/Alert/index.tsx | 65 +++++++++++++------ src/components/Transaction/Summary/index.tsx | 2 +- src/pages/Profile/Receive/index.tsx | 36 +++++----- src/pages/Profile/index.tsx | 2 +- src/pages/WalletConnect/index.tsx | 4 +- src/stellar/processes/connectWalletProcess.ts | 2 +- src/store.ts | 4 +- src/utils/helpers.ts | 21 ++++-- 9 files changed, 91 insertions(+), 53 deletions(-) diff --git a/src/assets/Icons.tsx b/src/assets/Icons.tsx index 5d4b024..ee62996 100644 --- a/src/assets/Icons.tsx +++ b/src/assets/Icons.tsx @@ -930,7 +930,7 @@ export const ErrorIcon = () => ( ); -export const InfoIcon = () => ( +export const CopyIcon = () => ( ( xmlns="http://www.w3.org/2000/svg" > ( > - + diff --git a/src/components/Alert/index.tsx b/src/components/Alert/index.tsx index 8c4925f..bb2bfd6 100644 --- a/src/components/Alert/index.tsx +++ b/src/components/Alert/index.tsx @@ -1,6 +1,7 @@ -import React from "react"; -import { ErrorIcon, InfoIcon, SuccessIcon, WarnIcon } from "../../assets/Icons"; -import { AlertType, useAppStore } from "../../store"; +import React from 'react'; +import { CopyIcon, ErrorIcon, SuccessIcon, WarnIcon } from '../../assets/Icons'; +import { AlertType, useAppStore } from '../../store'; +import { isBackgroundDark } from '../../utils/helpers'; interface AlertProps { type: AlertType; @@ -10,43 +11,69 @@ interface AlertProps { const variantStyles: Record< AlertType, - { container: string; text: string; icon: React.ReactNode } + { + baseBg: string; + darkBg: string; + container: string; + text: string; + icon: React.ReactNode; + } > = { error: { - container: "bluxcc:bg-light-red-50 bluxcc:border bluxcc:border-alert-error", - text: "bluxcc:text-alert-error", + baseBg: 'bluxcc:bg-light-red-50', + darkBg: 'bluxcc:bg-[#D6000033]', + container: 'bluxcc:border bluxcc:border-alert-error', + text: 'bluxcc:text-alert-error', icon: , }, success: { - container: "bluxcc:bg-white bluxcc:border bluxcc:border-alert-success", - text: "bluxcc:text-alert-success", + baseBg: 'bluxcc:bg-white', + darkBg: 'bluxcc:bg-[#00D66E33]', + container: 'bluxcc:border bluxcc:border-alert-success', + text: 'bluxcc:text-alert-success', icon: , }, - info: { - container: "bluxcc:bg-light-blue-50 bluxcc:border bluxcc:border-alert-info", - text: "bluxcc:text-alert-info", - icon: , + copy: { + baseBg: 'bluxcc:bg-light-blue-50', + darkBg: 'bluxcc:bg-[#005DF333]', + container: 'bluxcc:border bluxcc:border-alert-info', + text: 'bluxcc:text-alert-info', + icon: , }, warn: { - container: "bluxcc:bg-white bluxcc:border bluxcc:border-alert-warning", - text: "bluxcc:text-alert-warning", + baseBg: 'bluxcc:bg-white', + darkBg: 'bluxcc:bg-[#FA8F0233]', + container: 'bluxcc:border bluxcc:border-alert-warning', + text: 'bluxcc:text-alert-warning', icon: , }, none: { - container: "", - text: "", + baseBg: '', + darkBg: '', + container: '', + text: '', icon: null, }, }; -const Alert: React.FC = ({ type, message, className = "" }) => { - const { container, text, icon } = variantStyles[type]; +const Alert: React.FC = ({ type, message, className = '' }) => { const appearance = useAppStore((store) => store.config.appearance); + const isDarkBg = isBackgroundDark(appearance.background); + + const { baseBg, darkBg, container, text, icon } = variantStyles[type]; + const backgroundClass = isDarkBg ? darkBg : baseBg; return (
{icon} diff --git a/src/components/Transaction/Summary/index.tsx b/src/components/Transaction/Summary/index.tsx index d970731..6e90ba5 100644 --- a/src/components/Transaction/Summary/index.tsx +++ b/src/components/Transaction/Summary/index.tsx @@ -38,7 +38,7 @@ const Summary = ({ const handleCopyText = (address: string) => { copyText(address); - setAlert('info', 'Address Copied'); + setAlert('copy', 'Address Copied'); setTimeout(() => { setAlert('none', ''); }, 1000); diff --git a/src/pages/Profile/Receive/index.tsx b/src/pages/Profile/Receive/index.tsx index 7aa55b0..31d0f67 100644 --- a/src/pages/Profile/Receive/index.tsx +++ b/src/pages/Profile/Receive/index.tsx @@ -1,11 +1,11 @@ -import { useAppStore } from "../../../store"; -import Button from "../../../components/Button"; -import QRCode from "../../../components/QRCode"; -import { LargeCopy } from "../../../assets/Icons"; -import Divider from "../../../components/Divider"; -import { copyText, hexToRgba } from "../../../utils/helpers"; -import { SmallBlux } from "../../../assets/bluxLogo"; -import { useLang } from "../../../hooks/useLang"; +import { useAppStore } from '../../../store'; +import Button from '../../../components/Button'; +import QRCode from '../../../components/QRCode'; +import { LargeCopy } from '../../../assets/Icons'; +import Divider from '../../../components/Divider'; +import { copyText, hexToRgba } from '../../../utils/helpers'; +import { SmallBlux } from '../../../assets/bluxLogo'; +import { useLang } from '../../../hooks/useLang'; const Receive = () => { const t = useLang(); @@ -16,18 +16,18 @@ const Receive = () => { const handleCopyAddress = () => { copyText(address); - setAlert("info", t("address_copied")); + setAlert('copy', t('address_copied')); setTimeout(() => { - setAlert("none", ""); + setAlert('none', ''); }, 1000); }; return (
{
@@ -72,7 +72,7 @@ const Receive = () => { }} >

{ onClick={handleCopyAddress} endIcon={} > - {t("copy_address")} + {t('copy_address')}

); diff --git a/src/pages/Profile/index.tsx b/src/pages/Profile/index.tsx index d534bd6..7204ba3 100644 --- a/src/pages/Profile/index.tsx +++ b/src/pages/Profile/index.tsx @@ -41,7 +41,7 @@ const Profile = () => { copyText(address) .then(() => { copyText(address); - setAlert('info', 'Address Copied'); + setAlert('copy', 'Address Copied'); setTimeout(() => { setAlert('none', ''); }, 1000); diff --git a/src/pages/WalletConnect/index.tsx b/src/pages/WalletConnect/index.tsx index 4b8274d..b83dca6 100644 --- a/src/pages/WalletConnect/index.tsx +++ b/src/pages/WalletConnect/index.tsx @@ -28,7 +28,7 @@ const WalletConnect = () => { const handleCopyURI = (uri: string) => { copyText(uri); - store.setAlert('info', t('address_copied')); + store.setAlert('copy', t('address_copied')); setTimeout(() => { store.setAlert('none', ''); @@ -48,7 +48,7 @@ const WalletConnect = () => { return (
{ setTimeout(() => { store.connectWalletSuccessful(publicKey, passphrase); - }, 500); + }, 1000); }, 500); } } catch { diff --git a/src/store.ts b/src/store.ts index fe4a256..3a6319d 100644 --- a/src/store.ts +++ b/src/store.ts @@ -20,7 +20,7 @@ import { } from './types'; export type WaitingStatus = 'login' | 'sendTransaction' | 'signMessage'; -export type AlertType = 'error' | 'success' | 'info' | 'warn' | 'none'; +export type AlertType = 'error' | 'success' | 'warn' | 'none' | 'copy'; export interface IUser { address: string; @@ -119,7 +119,7 @@ export interface IStoreMethods { setAuth: (a: IAuth) => void; } -export interface IStore extends IStoreProperties, IStoreMethods { } +export interface IStore extends IStoreProperties, IStoreMethods {} export const store = createStore((set) => ({ auth: undefined, diff --git a/src/utils/helpers.ts b/src/utils/helpers.ts index 232a9f6..2576bac 100644 --- a/src/utils/helpers.ts +++ b/src/utils/helpers.ts @@ -319,11 +319,22 @@ export const handleLoadWallets = ( } }); -export const hexToRgba = (hex: string, alpha: number) => { - const bigint = parseInt(hex.replace('#', ''), 16); - const r = (bigint >> 16) & 255; - const g = (bigint >> 8) & 255; - const b = bigint & 255; +export const hexToRgba = (hex: string, alpha: number = 1) => { + hex = hex.replace(/^#/, ''); + let r: number, g: number, b: number; + + if (hex.length === 3) { + r = parseInt(hex[0] + hex[0], 16); + g = parseInt(hex[1] + hex[1], 16); + b = parseInt(hex[2] + hex[2], 16); + } else if (hex.length === 6 || hex.length === 8) { + r = parseInt(hex.substring(0, 2), 16); + g = parseInt(hex.substring(2, 4), 16); + b = parseInt(hex.substring(4, 6), 16); + } else { + throw new Error(`Invalid hex color: ${hex}`); + } + return `rgba(${r}, ${g}, ${b}, ${alpha})`; };