diff --git a/.changeset/pretty-fireants-deliver.md b/.changeset/pretty-fireants-deliver.md new file mode 100644 index 0000000000..1001d0fd41 --- /dev/null +++ b/.changeset/pretty-fireants-deliver.md @@ -0,0 +1,5 @@ +--- +"@coinbase/onchainkit": patch +--- + +-**chore**: Update all Wallet dropdown SVGs to render 16x16. Update text to Claim Basename (if no Basename), otherwise "Profile". By @cpcramer #990 diff --git a/site/docs/pages/index.mdx b/site/docs/pages/index.mdx index 06635d8019..7add3c63fd 100644 --- a/site/docs/pages/index.mdx +++ b/site/docs/pages/index.mdx @@ -195,7 +195,7 @@ bun add @coinbase/onchainkit // [!code focus] - Go to Wallet Dashboard // [!code focus] + Wallet // [!code focus] // [!code focus] // [!code focus] // [!code focus] @@ -219,7 +219,7 @@ bun add @coinbase/onchainkit - Go to Wallet Dashboard + Wallet diff --git a/site/docs/pages/wallet/wallet.mdx b/site/docs/pages/wallet/wallet.mdx index 0c0d49db6b..4677509bea 100644 --- a/site/docs/pages/wallet/wallet.mdx +++ b/site/docs/pages/wallet/wallet.mdx @@ -14,7 +14,6 @@ import { Address, Avatar, Name, - Badge, Identity, EthBalance, } from '@coinbase/onchainkit/identity'; @@ -40,7 +39,6 @@ import { Address, Avatar, Name, - Badge, Identity, EthBalance, } from '@coinbase/onchainkit/identity'; @@ -57,14 +55,12 @@ export function WalletComponents() { // [!code focus] - - - +
// [!code focus] - Go to Wallet Dashboard // [!code focus] + Wallet // [!code focus] // [!code focus] // [!code focus] // [!code focus] @@ -83,14 +79,12 @@ export function WalletComponents() { - - - +
- Go to Wallet Dashboard + Wallet @@ -115,9 +109,7 @@ You can override component styles using `className`. hasCopyAddressOnClick > - - - +
@@ -126,7 +118,7 @@ You can override component styles using `className`. icon="wallet" href="https://wallet.coinbase.com" > - Go to Wallet Dashboard + Wallet @@ -142,9 +134,7 @@ You can override component styles using `className`. - - - +
@@ -153,7 +143,7 @@ You can override component styles using `className`. icon="wallet" href="https://wallet.coinbase.com" > - Go to Wallet Dashboard + Wallet @@ -184,14 +174,12 @@ You can override component text using `text`. - - - +
- Go to Wallet Dashboard + Wallet @@ -250,9 +238,7 @@ OnchainKit leverages [RainbowKit](https://www.rainbowkit.com/) to offer this fea - - - +
@@ -260,7 +246,7 @@ OnchainKit leverages [RainbowKit](https://www.rainbowkit.com/) to offer this fea icon="wallet" href="https://wallet.coinbase.com" > - Go to Wallet Dashboard + Wallet @@ -346,9 +332,7 @@ export default OnchainProviders; - - - +
@@ -356,7 +340,7 @@ export default OnchainProviders; icon="wallet" href="https://wallet.coinbase.com" > - Go to Wallet Dashboard + Wallet diff --git a/src/identity/components/IdentityLayout.tsx b/src/identity/components/IdentityLayout.tsx index ae2209f7aa..5aa14a56fc 100644 --- a/src/identity/components/IdentityLayout.tsx +++ b/src/identity/components/IdentityLayout.tsx @@ -44,7 +44,7 @@ export function IdentityLayout({
diff --git a/src/internal/svg/walletSvg.tsx b/src/internal/svg/walletSvg.tsx index 5852e05ec4..baef9e30db 100644 --- a/src/internal/svg/walletSvg.tsx +++ b/src/internal/svg/walletSvg.tsx @@ -4,9 +4,9 @@ export const walletSvg = ( diff --git a/src/wallet/components/WalletDropdownBaseName.test.tsx b/src/wallet/components/WalletDropdownBaseName.test.tsx index de1fcd2b22..92f4744ca2 100644 --- a/src/wallet/components/WalletDropdownBaseName.test.tsx +++ b/src/wallet/components/WalletDropdownBaseName.test.tsx @@ -21,7 +21,7 @@ vi.mock('./WalletProvider', () => ({ })); describe('WalletDropdownBaseName', () => { - it('should render "Claim a Basename" when no basename', () => { + it('should render "Claim Basename" when no basename', () => { (useAccount as vi.Mock<[], Partial>).mockReturnValue({ address: '0x1234' as `0x${string}`, isConnected: true, @@ -39,11 +39,11 @@ describe('WalletDropdownBaseName', () => { }); render(); - expect(screen.getByText('Claim a Basename')).toBeInTheDocument(); + expect(screen.getByText('Claim Basename')).toBeInTheDocument(); expect(screen.getByText('NEW')).toBeInTheDocument(); }); - it('should render "Go to profile" when basename exists', () => { + it('should render "Profile" when basename exists', () => { (useAccount as vi.Mock<[], Partial>).mockReturnValue({ address: '0x1234' as `0x${string}`, isConnected: true, @@ -61,7 +61,7 @@ describe('WalletDropdownBaseName', () => { }); render(); - expect(screen.getByText('Go to profile')).toBeInTheDocument(); + expect(screen.getByText('Profile')).toBeInTheDocument(); expect(screen.queryByText('NEW')).not.toBeInTheDocument(); }); @@ -84,8 +84,8 @@ describe('WalletDropdownBaseName', () => { render(); expect(screen.getByTestId('ockSpinner')).toBeInTheDocument(); - expect(screen.queryByText('Claim a Basename')).not.toBeInTheDocument(); - expect(screen.queryByText('Go to profile')).not.toBeInTheDocument(); + expect(screen.queryByText('Claim Basename')).not.toBeInTheDocument(); + expect(screen.queryByText('Profile')).not.toBeInTheDocument(); expect(screen.queryByText('NEW')).not.toBeInTheDocument(); }); diff --git a/src/wallet/components/WalletDropdownBaseName.tsx b/src/wallet/components/WalletDropdownBaseName.tsx index cbf512803d..551518572e 100644 --- a/src/wallet/components/WalletDropdownBaseName.tsx +++ b/src/wallet/components/WalletDropdownBaseName.tsx @@ -22,7 +22,7 @@ export function WalletDropdownBaseName({ }); const hasBaseUserName = !!baseName; - const title = hasBaseUserName ? 'Go to profile' : 'Claim a Basename'; + const title = hasBaseUserName ? 'Profile' : 'Claim Basename'; const href = hasBaseUserName ? `https://www.base.org/name/${baseName}` : 'https://www.base.org/names'; @@ -31,24 +31,26 @@ export function WalletDropdownBaseName({ - {baseNameSvg &&
{baseNameSvg}
} -
+
+ {baseNameSvg} +
+
{isLoading ? ( ) : ( <> - {title} + {title} {!hasBaseUserName && ( NEW diff --git a/src/wallet/components/WalletDropdownDisconnect.tsx b/src/wallet/components/WalletDropdownDisconnect.tsx index e47b6a7bca..9c65443d00 100644 --- a/src/wallet/components/WalletDropdownDisconnect.tsx +++ b/src/wallet/components/WalletDropdownDisconnect.tsx @@ -19,13 +19,15 @@ export function WalletDropdownDisconnect({ type="button" className={cn( pressable.default, - 'flex items-center gap-2 px-4 py-2', + 'relative flex items-center px-4 py-3', className, )} onClick={handleDisconnect} > -
{disconnectSvg}
- {text} +
+ {disconnectSvg} +
+ {text} ); } diff --git a/src/wallet/components/WalletDropdownLink.tsx b/src/wallet/components/WalletDropdownLink.tsx index 99562504b1..057fe2bb30 100644 --- a/src/wallet/components/WalletDropdownLink.tsx +++ b/src/wallet/components/WalletDropdownLink.tsx @@ -28,15 +28,17 @@ export function WalletDropdownLink({ - {iconSvg &&
{iconSvg}
} - {children} +
+ {iconSvg} +
+ {children}
); }