diff --git a/package.json b/package.json index 8f485b3461..2e897ea756 100644 --- a/package.json +++ b/package.json @@ -370,7 +370,8 @@ "webpack-cli": "5.1.4", "webpack-dev-server": "4.15.1", "webpack-hot-middleware": "2.26.1", - "webpack-shell-plugin": "0.5.0" + "webpack-shell-plugin": "0.5.0", + "type-fest": "4.30.2" }, "resolutions": { "cross-spawn": "7.0.5", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 927a69b924..86a7d77549 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -431,7 +431,7 @@ importers: version: 1.48.2 '@pmmmwh/react-refresh-webpack-plugin': specifier: 0.5.13 - version: 0.5.13(@types/webpack@5.28.5(@swc/core@1.7.18)(esbuild@0.24.0)(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack-dev-server@4.15.1)(webpack@5.94.0)))(react-refresh@0.14.2)(type-fest@4.27.0)(webpack-dev-server@4.15.1(webpack-cli@5.1.4)(webpack@5.94.0))(webpack-hot-middleware@2.26.1)(webpack@5.94.0(@swc/core@1.7.18)(esbuild@0.24.0)(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack-dev-server@4.15.1)(webpack@5.94.0))) + version: 0.5.13(@types/webpack@5.28.5(@swc/core@1.7.18)(esbuild@0.24.0)(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack-dev-server@4.15.1)(webpack@5.94.0)))(react-refresh@0.14.2)(type-fest@4.30.2)(webpack-dev-server@4.15.1(webpack-cli@5.1.4)(webpack@5.94.0))(webpack-hot-middleware@2.26.1)(webpack@5.94.0(@swc/core@1.7.18)(esbuild@0.24.0)(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack-dev-server@4.15.1)(webpack@5.94.0))) '@redux-devtools/cli': specifier: 4.0.0 version: 4.0.0(@babel/core@7.26.0)(@reduxjs/toolkit@2.2.7(react-redux@9.1.2(@types/react@18.3.10)(react@18.3.1)(redux@5.0.1))(react@18.3.1))(@types/react-dom@18.3.0)(@types/styled-components@5.1.34)(encoding@0.1.13)(react-native@0.74.1(@babel/core@7.26.0)(@babel/preset-env@7.26.0(@babel/core@7.26.0))(@types/react@18.3.10)(encoding@0.1.13)(react@18.2.0)) @@ -684,6 +684,9 @@ importers: tsconfig-paths-webpack-plugin: specifier: 4.1.0 version: 4.1.0 + type-fest: + specifier: 4.30.2 + version: 4.30.2 typescript: specifier: 5.4.5 version: 5.4.5 @@ -14985,8 +14988,8 @@ packages: resolution: {integrity: sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g==} engines: {node: '>=14.16'} - type-fest@4.27.0: - resolution: {integrity: sha512-3IMSWgP7C5KSQqmo1wjhKrwsvXAtF33jO3QY+Uy++ia7hqvgSK6iXbbg5PbDBc1P2ZbNEDgejOrN4YooXvhwCw==} + type-fest@4.30.2: + resolution: {integrity: sha512-UJShLPYi1aWqCdq9HycOL/gwsuqda1OISdBO3t8RlXQC4QvtuIz4b5FCfe2dQIWEpmlRExKmcTBfP1r9bhY7ig==} engines: {node: '>=16'} type-is@1.6.18: @@ -19744,7 +19747,7 @@ snapshots: dependencies: playwright: 1.48.2 - '@pmmmwh/react-refresh-webpack-plugin@0.5.13(@types/webpack@5.28.5(@swc/core@1.7.18)(esbuild@0.24.0)(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack-dev-server@4.15.1)(webpack@5.94.0)))(react-refresh@0.14.2)(type-fest@4.27.0)(webpack-dev-server@4.15.1(webpack-cli@5.1.4)(webpack@5.94.0))(webpack-hot-middleware@2.26.1)(webpack@5.94.0(@swc/core@1.7.18)(esbuild@0.24.0)(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack-dev-server@4.15.1)(webpack@5.94.0)))': + '@pmmmwh/react-refresh-webpack-plugin@0.5.13(@types/webpack@5.28.5(@swc/core@1.7.18)(esbuild@0.24.0)(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack-dev-server@4.15.1)(webpack@5.94.0)))(react-refresh@0.14.2)(type-fest@4.30.2)(webpack-dev-server@4.15.1(webpack-cli@5.1.4)(webpack@5.94.0))(webpack-hot-middleware@2.26.1)(webpack@5.94.0(@swc/core@1.7.18)(esbuild@0.24.0)(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack-dev-server@4.15.1)(webpack@5.94.0)))': dependencies: ansi-html-community: 0.0.8 core-js-pure: 3.38.1 @@ -19757,7 +19760,7 @@ snapshots: webpack: 5.94.0(@swc/core@1.7.18)(esbuild@0.24.0)(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack-dev-server@4.15.1)(webpack@5.94.0)) optionalDependencies: '@types/webpack': 5.28.5(@swc/core@1.7.18)(esbuild@0.24.0)(webpack-cli@5.1.4(webpack-bundle-analyzer@4.10.2)(webpack-dev-server@4.15.1)(webpack@5.94.0)) - type-fest: 4.27.0 + type-fest: 4.30.2 webpack-dev-server: 4.15.1(webpack-cli@5.1.4)(webpack@5.94.0) webpack-hot-middleware: 2.26.1 @@ -34449,8 +34452,7 @@ snapshots: type-fest@3.13.1: {} - type-fest@4.27.0: - optional: true + type-fest@4.30.2: {} type-is@1.6.18: dependencies: diff --git a/src/app/components/account/account-addresses.tsx b/src/app/components/account/account-addresses.tsx index 53cbdaaba7..81b6347f7e 100644 --- a/src/app/components/account/account-addresses.tsx +++ b/src/app/components/account/account-addresses.tsx @@ -3,22 +3,20 @@ import { HStack } from 'leather-styles/jsx'; import { BulletSeparator, Caption } from '@leather.io/ui'; import { truncateMiddle } from '@leather.io/utils'; -import { BitcoinNativeSegwitAccountLoader } from '../loaders/bitcoin-account-loader'; -import { StacksAccountLoader } from '../loaders/stacks-account-loader'; +import { useBitcoinNativeSegwitAccountLoader } from '../loaders/bitcoin-account-loader'; +import { useStacksAccountLoader } from '../loaders/stacks-account-loader'; interface AccountAddressesProps { index: number; } export function AcccountAddresses({ index }: AccountAddressesProps) { + const account = useStacksAccountLoader({ index }); + const signer = useBitcoinNativeSegwitAccountLoader({ index }); return ( - - {account => {truncateMiddle(account.address, 4)}} - - - {signer => {truncateMiddle(signer.address, 4)}} - + {account ? {truncateMiddle(account.address, 4)} : null} + {signer ? {truncateMiddle(signer.address, 4)} : null} ); diff --git a/src/app/components/loaders/bitcoin-account-loader.tsx b/src/app/components/loaders/bitcoin-account-loader.tsx index d9bb6998bd..1e26f1d051 100644 --- a/src/app/components/loaders/bitcoin-account-loader.tsx +++ b/src/app/components/loaders/bitcoin-account-loader.tsx @@ -1,4 +1,5 @@ import { P2Ret } from '@scure/btc-signer/payment'; +import type { DistributedOmit } from 'type-fest'; import { useConfigBitcoinEnabled } from '@app/query/common/remote-config/remote-config.query'; import { useCurrentAccountIndex } from '@app/store/accounts/account'; @@ -20,11 +21,9 @@ interface BtcAccountLoaderIndexProps extends BitcoinAccountLoaderBaseProps { type BtcAccountLoaderProps = BtcAccountLoaderCurrentProps | BtcAccountLoaderIndexProps; -export function BitcoinNativeSegwitAccountLoader({ - children, - fallback, - ...props -}: BtcAccountLoaderProps) { +export function useBitcoinNativeSegwitAccountLoader( + props: DistributedOmit +) { const isBitcoinEnabled = useConfigBitcoinEnabled(); const currentAccountIndex = useCurrentAccountIndex(); @@ -33,8 +32,18 @@ export function BitcoinNativeSegwitAccountLoader({ const signer = useNativeSegwitSigner(properIndex); - if (!signer || !isBitcoinEnabled) return fallback; - return children(signer(0)); + if (!signer || !isBitcoinEnabled) return null; + return signer(0); +} + +export function BitcoinNativeSegwitAccountLoader({ + children, + fallback, + ...props +}: BtcAccountLoaderProps) { + const signer = useBitcoinNativeSegwitAccountLoader(props); + if (!signer) return fallback; + return children(signer); } export function BitcoinTaprootAccountLoader({ children, ...props }: BtcAccountLoaderProps) { diff --git a/src/app/components/loaders/stacks-account-loader.tsx b/src/app/components/loaders/stacks-account-loader.tsx index 3db04fadf1..62ac670165 100644 --- a/src/app/components/loaders/stacks-account-loader.tsx +++ b/src/app/components/loaders/stacks-account-loader.tsx @@ -1,5 +1,7 @@ import { ReactNode } from 'react'; +import type { DistributedOmit } from 'type-fest'; + import { useCurrentAccountIndex } from '@app/store/accounts/account'; import { useCurrentStacksAccount, @@ -34,12 +36,14 @@ interface StacksAccountIndexLoaderProps extends StacksAccountBaseLoaderProps { type StacksAccountLoaderProps = StacksAccountCurrentLoaderProps | StacksAccountIndexLoaderProps; -export function StacksAccountLoader({ children, ...props }: StacksAccountLoaderProps) { +export function useStacksAccountLoader( + props: DistributedOmit +) { const stacksAccounts = useStacksAccounts(); const currentAccountIndex = useCurrentAccountIndex(); const properIndex = 'current' in props ? currentAccountIndex : props.index; const account = stacksAccounts[properIndex]; if (!account) return null; - return children(account); + return account; } diff --git a/src/app/features/asset-list/_components/connect-ledger-asset-button.tsx b/src/app/features/asset-list/_components/connect-ledger-asset-button.tsx index c9b3077ec2..81a49bc542 100644 --- a/src/app/features/asset-list/_components/connect-ledger-asset-button.tsx +++ b/src/app/features/asset-list/_components/connect-ledger-asset-button.tsx @@ -27,7 +27,7 @@ export function ConnectLedgerButton({ chain }: ConnectLedgerButtonProps) { }; return ( -