mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-11-22 01:47:00 +01:00
Feat: Label hardware wallets (#13339)
* Added keyring label * Fixed labels name * Clean up * Remove blank spaces * Linted * Fixed lint * Removed unused hooks * Fixed test * Addressed PR comments * Added KEYRING_NAMES obj * Lint * Removed empty space
This commit is contained in:
parent
ec8a9384c9
commit
8756ad2e78
@ -17,6 +17,13 @@ export const DEVICE_NAMES = {
|
||||
LATTICE: 'lattice',
|
||||
};
|
||||
|
||||
export const KEYRING_NAMES = {
|
||||
LEDGER: 'Ledger',
|
||||
TREZOR: 'Trezor',
|
||||
QR: 'QR',
|
||||
LATTICE: 'Lattice1',
|
||||
};
|
||||
|
||||
/**
|
||||
* Used for setting the users preference for ledger transport type
|
||||
*/
|
||||
|
@ -16,7 +16,6 @@ import {
|
||||
SUPPORT_REQUEST_LINK,
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
} from '../../../helpers/constants/common';
|
||||
import { KEYRING_TYPES } from '../../../../shared/constants/hardware-wallets';
|
||||
import {
|
||||
SETTINGS_ROUTE,
|
||||
NEW_ACCOUNT_ROUTE,
|
||||
@ -27,6 +26,7 @@ import {
|
||||
import TextField from '../../ui/text-field';
|
||||
import SearchIcon from '../../ui/search-icon';
|
||||
import Button from '../../ui/button';
|
||||
import KeyRingLabel from './keyring-label';
|
||||
|
||||
export function AccountMenuItem(props) {
|
||||
const { icon, children, text, subText, className, onClick } = props;
|
||||
@ -214,7 +214,7 @@ export default class AccountMenu extends Component {
|
||||
type={PRIMARY}
|
||||
/>
|
||||
</div>
|
||||
{this.renderKeyringType(keyring)}
|
||||
<KeyRingLabel keyring={keyring} />
|
||||
{iconAndNameForOpenSubject ? (
|
||||
<div className="account-menu__icon-list">
|
||||
<SiteIcon
|
||||
@ -229,34 +229,6 @@ export default class AccountMenu extends Component {
|
||||
});
|
||||
}
|
||||
|
||||
renderKeyringType(keyring) {
|
||||
const { t } = this.context;
|
||||
|
||||
// Sometimes keyrings aren't loaded yet
|
||||
if (!keyring) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const { type } = keyring;
|
||||
let label;
|
||||
|
||||
switch (type) {
|
||||
case KEYRING_TYPES.TREZOR:
|
||||
case KEYRING_TYPES.LEDGER:
|
||||
case KEYRING_TYPES.LATTICE:
|
||||
case KEYRING_TYPES.QR:
|
||||
label = t('hardware');
|
||||
break;
|
||||
case 'Simple Key Pair':
|
||||
label = t('imported');
|
||||
break;
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
|
||||
return <div className="keyring-label allcaps">{label}</div>;
|
||||
}
|
||||
|
||||
resetSearchQuery() {
|
||||
this.setSearchQuery('');
|
||||
}
|
||||
|
@ -96,7 +96,7 @@ describe('Account Menu', () => {
|
||||
|
||||
it('render imported account label', () => {
|
||||
const importedAccount = wrapper.find('.keyring-label.allcaps');
|
||||
expect(importedAccount.text()).toStrictEqual('imported');
|
||||
expect(importedAccount.text()).toStrictEqual('[imported]');
|
||||
});
|
||||
});
|
||||
|
||||
|
48
ui/components/app/account-menu/keyring-label.js
Normal file
48
ui/components/app/account-menu/keyring-label.js
Normal file
@ -0,0 +1,48 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { useI18nContext } from '../../../hooks/useI18nContext';
|
||||
import {
|
||||
KEYRING_NAMES,
|
||||
KEYRING_TYPES,
|
||||
} from '../../../../shared/constants/hardware-wallets';
|
||||
|
||||
export default function KeyRingLabel({ keyring }) {
|
||||
const t = useI18nContext();
|
||||
|
||||
let label = null;
|
||||
|
||||
// Keyring value might take a while to get a value
|
||||
if (!keyring) {
|
||||
return null;
|
||||
}
|
||||
const { type } = keyring;
|
||||
|
||||
switch (type) {
|
||||
case KEYRING_TYPES.QR:
|
||||
label = KEYRING_NAMES.QR;
|
||||
break;
|
||||
case 'Simple Key Pair':
|
||||
label = t('imported');
|
||||
break;
|
||||
case KEYRING_TYPES.TREZOR:
|
||||
label = KEYRING_NAMES.TREZOR;
|
||||
break;
|
||||
case KEYRING_TYPES.LEDGER:
|
||||
label = KEYRING_NAMES.LEDGER;
|
||||
break;
|
||||
case KEYRING_TYPES.LATTICE:
|
||||
label = KEYRING_NAMES.LATTICE;
|
||||
break;
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<>{label ? <div className="keyring-label allcaps">{label}</div> : null}</>
|
||||
);
|
||||
}
|
||||
|
||||
KeyRingLabel.propTypes = {
|
||||
keyring: PropTypes.object,
|
||||
};
|
Loading…
Reference in New Issue
Block a user