m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

UX: Create selector for blockie preference (#20577)

Browse Source 
Co-authored-by: Nidhi Kumari <nidhi.kumari@consensys.net>
Co-authored-by: legobeat <109787230+legobeat@users.noreply.github.com>
This commit is contained in:
David Walsh 2023-08-31 08:53:22 -05:00 committed by GitHub
parent c15226325e
commit 53f585b68e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui/components/multichain/account-details/account-details.js
View File

@ -14,7 +14,7 @@ import {
TextVariant, TextVariant,
} from '../../../helpers/constants/design-system'; } from '../../../helpers/constants/design-system';
import { useI18nContext } from '../../../hooks/useI18nContext'; import { useI18nContext } from '../../../hooks/useI18nContext';
import { getMetaMaskAccountsOrdered } from '../../../selectors'; import { getMetaMaskAccountsOrdered, getUseBlockie } from '../../../selectors';
import { import {
clearAccountDetails, clearAccountDetails,
hideWarning, hideWarning,
@ -41,7 +41,7 @@ export const AccountDetails = ({ address }) => {
const dispatch = useDispatch(); const dispatch = useDispatch();
const t = useI18nContext(); const t = useI18nContext();
const trackEvent = useContext(MetaMetricsContext); const trackEvent = useContext(MetaMetricsContext);
const useBlockie = useSelector((state) => state.metamask.useBlockie); const useBlockie = useSelector(getUseBlockie);
const accounts = useSelector(getMetaMaskAccountsOrdered); const accounts = useSelector(getMetaMaskAccountsOrdered);
const { name } = accounts.find((account) => account.address === address); const { name } = accounts.find((account) => account.address === address);
const [showHoldToReveal, setShowHoldToReveal] = useState(false); const [showHoldToReveal, setShowHoldToReveal] = useState(false);

3
ui/components/multichain/account-list-item/account-list-item.js
View File

@ -44,6 +44,7 @@ import {
MetaMetricsEventName, MetaMetricsEventName,
} from '../../../../shared/constants/metametrics'; } from '../../../../shared/constants/metametrics';
import { MetaMetricsContext } from '../../../contexts/metametrics'; import { MetaMetricsContext } from '../../../contexts/metametrics';
import { getUseBlockie } from '../../../selectors';
const MAXIMUM_CURRENCY_DECIMALS = 3; const MAXIMUM_CURRENCY_DECIMALS = 3;
const MAXIMUM_CHARACTERS_WITHOUT_TOOLTIP = 17; const MAXIMUM_CHARACTERS_WITHOUT_TOOLTIP = 17;
@ -82,7 +83,7 @@ export const AccountListItem = ({
const [accountOptionsMenuOpen, setAccountOptionsMenuOpen] = useState(false); const [accountOptionsMenuOpen, setAccountOptionsMenuOpen] = useState(false);
const [accountListItemMenuElement, setAccountListItemMenuElement] = const [accountListItemMenuElement, setAccountListItemMenuElement] =
useState(); useState();
const useBlockie = useSelector((state) => state.metamask.useBlockie); const useBlockie = useSelector(getUseBlockie);
const setAccountListItemMenuRef = (ref) => { const setAccountListItemMenuRef = (ref) => {
setAccountListItemMenuElement(ref); setAccountListItemMenuElement(ref);

3
ui/components/multichain/account-picker/account-picker.js
View File

@ -24,6 +24,7 @@ import {
TextColor, TextColor,
TextVariant, TextVariant,
} from '../../../helpers/constants/design-system'; } from '../../../helpers/constants/design-system';
import { getUseBlockie } from '../../../selectors';
import { shortenAddress } from '../../../helpers/utils/util'; import { shortenAddress } from '../../../helpers/utils/util';
export const AccountPicker = ({ export const AccountPicker = ({
@ -33,7 +34,7 @@ export const AccountPicker = ({
disabled, disabled,
showAddress = false, showAddress = false,
}) => { }) => {
const useBlockie = useSelector((state) => state.metamask.useBlockie); const useBlockie = useSelector(getUseBlockie);
const shortenedAddress = shortenAddress(toChecksumHexAddress(address)); const shortenedAddress = shortenAddress(toChecksumHexAddress(address));
return ( return (

10
ui/selectors/selectors.js
View File

@ -1137,6 +1137,16 @@ export function getUseNftDetection(state) {
return Boolean(state.metamask.useNftDetection); return Boolean(state.metamask.useNftDetection);
} }
/**
* To get the useBlockie flag which determines whether we show blockies or Jazzicons
*
* @param {*} state
* @returns Boolean
*/
export function getUseBlockie(state) {
return Boolean(state.metamask.useBlockie);
}
/** /**
* To get the openSeaEnabled flag which determines whether we use OpenSea's API * To get the openSeaEnabled flag which determines whether we use OpenSea's API
* *