mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Permissions: convert hook to util (#13906)
* Permissions: convert hook into helper util - instantiate once - freeze - alphabetize - add additional comments to @param https://github.com/MetaMask/metamask-extension/pull/13906#pullrequestreview-906554847
This commit is contained in:
parent
060c6d651c
commit
69c2cd3a94
@ -3,14 +3,12 @@ import PropTypes from 'prop-types';
|
||||
import React, { useState } from 'react';
|
||||
import CheckBox from '../../ui/check-box';
|
||||
import { useI18nContext } from '../../../hooks/useI18nContext';
|
||||
import { usePermissionDescriptions } from '../../../hooks/usePermissionDescriptions';
|
||||
import { getPermissionDescription } from '../../../helpers/utils/permission';
|
||||
|
||||
const ConnectedAccountsPermissions = ({ permissions }) => {
|
||||
const t = useI18nContext();
|
||||
const [expanded, setExpanded] = useState(false);
|
||||
|
||||
const getPermissionDescription = usePermissionDescriptions();
|
||||
|
||||
const toggleExpanded = () => {
|
||||
setExpanded((_expanded) => !_expanded);
|
||||
};
|
||||
@ -56,7 +54,7 @@ const ConnectedAccountsPermissions = ({ permissions }) => {
|
||||
className="connected-accounts-permissions__checkbox"
|
||||
/>
|
||||
<label htmlFor={permissionName}>
|
||||
{getPermissionDescription(permissionName).label}
|
||||
{getPermissionDescription(t, permissionName).label}
|
||||
</label>
|
||||
</li>
|
||||
))}
|
||||
|
@ -1,14 +1,16 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { usePermissionDescriptions } from '../../../hooks/usePermissionDescriptions';
|
||||
import { getPermissionDescription } from '../../../helpers/utils/permission';
|
||||
import { useI18nContext } from '../../../hooks/useI18nContext';
|
||||
|
||||
export default function PermissionsConnectPermissionList({ permissions }) {
|
||||
const getPermissionDescription = usePermissionDescriptions();
|
||||
const t = useI18nContext();
|
||||
|
||||
return (
|
||||
<div className="permissions-connect-permission-list">
|
||||
{Object.keys(permissions).map((permission) => {
|
||||
const { label, leftIcon, rightIcon } = getPermissionDescription(
|
||||
t,
|
||||
permission,
|
||||
);
|
||||
|
||||
|
92
ui/helpers/utils/permission.js
Normal file
92
ui/helpers/utils/permission.js
Normal file
@ -0,0 +1,92 @@
|
||||
import deepFreeze from 'deep-freeze-strict';
|
||||
import {
|
||||
RestrictedMethods,
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
EndowmentPermissions,
|
||||
PermissionNamespaces,
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
} from '../../../shared/constants/permissions';
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
import { coinTypeToProtocolName } from './util';
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
|
||||
const UNKNOWN_PERMISSION = Symbol('unknown');
|
||||
|
||||
const PERMISSION_DESCRIPTIONS = deepFreeze({
|
||||
[RestrictedMethods.eth_accounts]: {
|
||||
label: (t) => t('permission_ethereumAccounts'),
|
||||
leftIcon: 'fas fa-eye',
|
||||
rightIcon: null,
|
||||
},
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
[RestrictedMethods.snap_confirm]: {
|
||||
label: (t) => t('permission_customConfirmation'),
|
||||
leftIcon: 'fas fa-user-check',
|
||||
rightIcon: null,
|
||||
},
|
||||
[RestrictedMethods['snap_getBip44Entropy_*']]: {
|
||||
label: (t, permissionName) => {
|
||||
const coinType = permissionName.split('_').slice(-1);
|
||||
return t('permission_manageBip44Keys', [
|
||||
coinTypeToProtocolName(coinType) ||
|
||||
`${coinType} (Unrecognized protocol)`,
|
||||
]);
|
||||
},
|
||||
leftIcon: 'fas fa-door-open',
|
||||
rightIcon: null,
|
||||
},
|
||||
[RestrictedMethods.snap_manageState]: {
|
||||
label: (t) => t('permission_manageState'),
|
||||
leftIcon: 'fas fa-download',
|
||||
rightIcon: null,
|
||||
},
|
||||
[RestrictedMethods['wallet_snap_*']]: {
|
||||
label: (t, permissionName) => {
|
||||
const snapId = permissionName.split('_').slice(-1);
|
||||
return t('permission_accessSnap', [snapId]);
|
||||
},
|
||||
leftIcon: 'fas fa-bolt',
|
||||
rightIcon: null,
|
||||
},
|
||||
[EndowmentPermissions['endowment:network-access']]: {
|
||||
label: (t) => t('permission_accessNetwork'),
|
||||
leftIcon: 'fas fa-wifi',
|
||||
rightIcon: null,
|
||||
},
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
[UNKNOWN_PERMISSION]: {
|
||||
label: (t, permissionName) =>
|
||||
t('permission_unknown', [permissionName ?? 'undefined']),
|
||||
leftIcon: 'fas fa-times-circle',
|
||||
rightIcon: null,
|
||||
},
|
||||
});
|
||||
|
||||
/**
|
||||
* @typedef {Object} PermissionLabelObject
|
||||
* @property {string} label - The text label.
|
||||
* @property {string} leftIcon - The left icon.
|
||||
* @property {string} rightIcon - The right icon.
|
||||
*/
|
||||
|
||||
/**
|
||||
* @param {Function} t - The translation function
|
||||
* @param {string} permissionName - The name of the permission to request
|
||||
* @returns {(permissionName:string) => PermissionLabelObject}
|
||||
*/
|
||||
export const getPermissionDescription = (t, permissionName) => {
|
||||
let value = PERMISSION_DESCRIPTIONS[UNKNOWN_PERMISSION];
|
||||
|
||||
if (Object.hasOwnProperty.call(PERMISSION_DESCRIPTIONS, permissionName)) {
|
||||
value = PERMISSION_DESCRIPTIONS[permissionName];
|
||||
}
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
for (const namespace of Object.keys(PermissionNamespaces)) {
|
||||
if (permissionName.startsWith(namespace)) {
|
||||
value = PERMISSION_DESCRIPTIONS[PermissionNamespaces[namespace]];
|
||||
}
|
||||
}
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
|
||||
return { ...value, label: value.label(t, permissionName) };
|
||||
};
|
@ -1,98 +0,0 @@
|
||||
import { useMemo } from 'react';
|
||||
import {
|
||||
RestrictedMethods,
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
EndowmentPermissions,
|
||||
PermissionNamespaces,
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
} from '../../shared/constants/permissions';
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
import { coinTypeToProtocolName } from '../helpers/utils/util';
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
import { useI18nContext } from './useI18nContext';
|
||||
|
||||
const UNKNOWN_PERMISSION = Symbol('unknown');
|
||||
|
||||
/**
|
||||
* @typedef {Object} PermissionLabelObject
|
||||
* @property {string} label - The text label.
|
||||
* @property {string} leftIcon - The left icon.
|
||||
* @property {string} rightIcon - The right icon.
|
||||
*/
|
||||
|
||||
/**
|
||||
* @returns {(permissionName:string) => PermissionLabelObject}
|
||||
*/
|
||||
export const usePermissionDescriptions = () => {
|
||||
const t = useI18nContext();
|
||||
|
||||
return useMemo(() => {
|
||||
const permissionDescriptions = {
|
||||
[RestrictedMethods.eth_accounts]: {
|
||||
leftIcon: 'fas fa-eye',
|
||||
label: t('permission_ethereumAccounts'),
|
||||
rightIcon: null,
|
||||
},
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
[RestrictedMethods.snap_confirm]: {
|
||||
leftIcon: 'fas fa-user-check',
|
||||
label: t('permission_customConfirmation'),
|
||||
rightIcon: null,
|
||||
},
|
||||
[RestrictedMethods['snap_getBip44Entropy_*']]: (permissionName) => {
|
||||
const coinType = permissionName.split('_').slice(-1);
|
||||
return {
|
||||
leftIcon: 'fas fa-door-open',
|
||||
label: t('permission_manageBip44Keys', [
|
||||
coinTypeToProtocolName(coinType) ||
|
||||
`${coinType} (Unrecognized protocol)`,
|
||||
]),
|
||||
rightIcon: null,
|
||||
};
|
||||
},
|
||||
[RestrictedMethods.snap_manageState]: {
|
||||
leftIcon: 'fas fa-download',
|
||||
label: t('permission_manageState'),
|
||||
rightIcon: null,
|
||||
},
|
||||
[RestrictedMethods['wallet_snap_*']]: (permissionName) => {
|
||||
const snapId = permissionName.split('_').slice(-1);
|
||||
return {
|
||||
leftIcon: 'fas fa-bolt',
|
||||
label: t('permission_accessSnap', [snapId]),
|
||||
rightIcon: null,
|
||||
};
|
||||
},
|
||||
[EndowmentPermissions['endowment:network-access']]: {
|
||||
leftIcon: 'fas fa-wifi',
|
||||
label: t('permission_accessNetwork'),
|
||||
rightIcon: null,
|
||||
},
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
[UNKNOWN_PERMISSION]: (permissionName) => {
|
||||
return {
|
||||
leftIcon: 'fas fa-times-circle',
|
||||
label: t('permission_unknown', [permissionName ?? 'undefined']),
|
||||
rightIcon: null,
|
||||
};
|
||||
},
|
||||
};
|
||||
|
||||
return (permissionName) => {
|
||||
let value = permissionDescriptions[UNKNOWN_PERMISSION];
|
||||
|
||||
if (Object.hasOwnProperty.call(permissionDescriptions, permissionName)) {
|
||||
value = permissionDescriptions[permissionName];
|
||||
}
|
||||
///: BEGIN:ONLY_INCLUDE_IN(flask)
|
||||
for (const namespace of Object.keys(PermissionNamespaces)) {
|
||||
if (permissionName.startsWith(namespace)) {
|
||||
value = permissionDescriptions[PermissionNamespaces[namespace]];
|
||||
}
|
||||
}
|
||||
///: END:ONLY_INCLUDE_IN
|
||||
|
||||
return typeof value === 'function' ? value(permissionName) : value;
|
||||
};
|
||||
}, [t]);
|
||||
};
|
Loading…
Reference in New Issue
Block a user