From 2d73f0c00a177164a770216d2efbac08aeb6869d Mon Sep 17 00:00:00 2001 From: Frederik Bolding Date: Thu, 13 Jul 2023 11:21:21 +0200 Subject: [PATCH 1/4] Add snap legacy authorship header --- .../snap-legacy-authorship-header/index.js | 1 + .../snap-legacy-authorship-header.js | 82 +++++++++++++++++++ .../snap-legacy-authorship-header.stories.js | 21 +++++ 3 files changed, 104 insertions(+) create mode 100644 ui/components/app/snaps/snap-legacy-authorship-header/index.js create mode 100644 ui/components/app/snaps/snap-legacy-authorship-header/snap-legacy-authorship-header.js create mode 100644 ui/components/app/snaps/snap-legacy-authorship-header/snap-legacy-authorship-header.stories.js diff --git a/ui/components/app/snaps/snap-legacy-authorship-header/index.js b/ui/components/app/snaps/snap-legacy-authorship-header/index.js new file mode 100644 index 000000000000..608dfb6e5346 --- /dev/null +++ b/ui/components/app/snaps/snap-legacy-authorship-header/index.js @@ -0,0 +1 @@ +export { default } from './snap-legacy-authorship-header'; diff --git a/ui/components/app/snaps/snap-legacy-authorship-header/snap-legacy-authorship-header.js b/ui/components/app/snaps/snap-legacy-authorship-header/snap-legacy-authorship-header.js new file mode 100644 index 000000000000..e211d9bb490e --- /dev/null +++ b/ui/components/app/snaps/snap-legacy-authorship-header/snap-legacy-authorship-header.js @@ -0,0 +1,82 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import classnames from 'classnames'; +import { useSelector } from 'react-redux'; +import { + BackgroundColor, + TextColor, + TextVariant, + AlignItems, + FontWeight, + Display, + FlexDirection, + BlockSize, + BorderColor, + BorderRadius, +} from '../../../../helpers/constants/design-system'; +import { + getSnapName, + removeSnapIdPrefix, +} from '../../../../helpers/utils/util'; + +import { Box, Text } from '../../../component-library'; +import { getTargetSubjectMetadata } from '../../../../selectors'; +import SnapAvatar from '../snap-avatar'; + +const SnapLegacyAuthorshipHeader = ({ snapId, className }) => { + const packageName = snapId && removeSnapIdPrefix(snapId); + + const subjectMetadata = useSelector((state) => + getTargetSubjectMetadata(state, snapId), + ); + + const friendlyName = snapId && getSnapName(snapId, subjectMetadata); + + return ( + + + + + + + {friendlyName} + + + {packageName} + + + + ); +}; + +SnapLegacyAuthorshipHeader.propTypes = { + /** + * The id of the snap + */ + snapId: PropTypes.string, + /** + * The className of the SnapLegacyAuthorshipHeader + */ + className: PropTypes.string, +}; + +export default SnapLegacyAuthorshipHeader; diff --git a/ui/components/app/snaps/snap-legacy-authorship-header/snap-legacy-authorship-header.stories.js b/ui/components/app/snaps/snap-legacy-authorship-header/snap-legacy-authorship-header.stories.js new file mode 100644 index 000000000000..6e71f4ee61d5 --- /dev/null +++ b/ui/components/app/snaps/snap-legacy-authorship-header/snap-legacy-authorship-header.stories.js @@ -0,0 +1,21 @@ +import React from 'react'; +import SnapLegacyAuthorshipHeader from './snap-legacy-authorship-header'; + +export default { + title: 'Components/App/Snaps/SnapLegacyAuthorshipHeader', + + component: SnapLegacyAuthorshipHeader, + argTypes: { + snapId: { + control: 'text', + }, + }, +}; + +export const DefaultStory = (args) => ; + +DefaultStory.storyName = 'Default'; + +DefaultStory.args = { + snapId: 'npm:@metamask/test-snap-bip44', +}; From 37536dc5e6987d66ff04fd231c5316588934f816 Mon Sep 17 00:00:00 2001 From: Frederik Bolding Date: Thu, 13 Jul 2023 13:29:03 +0200 Subject: [PATCH 2/4] Add legacy snap header to personal_sign --- .../signature-request-original.component.js | 40 ++++++++++++++----- .../snap-legacy-authorship-header.js | 11 ++++- 2 files changed, 40 insertions(+), 11 deletions(-) diff --git a/ui/components/app/signature-request-original/signature-request-original.component.js b/ui/components/app/signature-request-original/signature-request-original.component.js index 6dc18e4a480a..37c6afc258ba 100644 --- a/ui/components/app/signature-request-original/signature-request-original.component.js +++ b/ui/components/app/signature-request-original/signature-request-original.component.js @@ -3,6 +3,9 @@ import PropTypes from 'prop-types'; import classnames from 'classnames'; import { ObjectInspector } from 'react-inspector'; import { ethErrors, serializeError } from 'eth-rpc-errors'; +///: BEGIN:ONLY_INCLUDE_IN(snaps) +import { SubjectType } from '@metamask/permission-controller'; +///: END:ONLY_INCLUDE_IN import LedgerInstructionField from '../ledger-instruction-field'; import { MESSAGE_TYPE } from '../../../../shared/constants/app'; import { @@ -38,6 +41,9 @@ import { Icon, IconName, Text } from '../../component-library'; import Box from '../../ui/box/box'; ///: END:ONLY_INCLUDE_IN import SignatureRequestHeader from '../signature-request-header'; +///: BEGIN:ONLY_INCLUDE_IN(snaps) +import SnapLegacyAuthorshipHeader from '../snaps/snap-legacy-authorship-header'; +///: END:ONLY_INCLUDE_IN import SignatureRequestOriginalWarning from './signature-request-original-warning'; export default class SignatureRequestOriginal extends Component { @@ -171,16 +177,30 @@ export default class SignatureRequestOriginal extends Component { }
- + { + ///: BEGIN:ONLY_INCLUDE_IN(snaps) + targetSubjectMetadata?.subjectType === SubjectType.Snap ? ( + + ) : ( + ///: END:ONLY_INCLUDE_IN + + ///: BEGIN:ONLY_INCLUDE_IN(snaps) + ) + ///: END:ONLY_INCLUDE_IN + }
{ +const SnapLegacyAuthorshipHeader = ({ + snapId, + className, + marginLeft, + marginRight, +}) => { const packageName = snapId && removeSnapIdPrefix(snapId); const subjectMetadata = useSelector((state) => @@ -42,6 +47,8 @@ const SnapLegacyAuthorshipHeader = ({ snapId, className }) => { padding={2} borderColor={BorderColor.borderDefault} borderRadius={BorderRadius.pill} + marginLeft={marginLeft} + marginRight={marginRight} > @@ -77,6 +84,8 @@ SnapLegacyAuthorshipHeader.propTypes = { * The className of the SnapLegacyAuthorshipHeader */ className: PropTypes.string, + marginLeft: PropTypes.number, + marginRight: PropTypes.number, }; export default SnapLegacyAuthorshipHeader; From 78619655bfc0b1c3d32385bc8f8ae872e1bc7a1a Mon Sep 17 00:00:00 2001 From: Frederik Bolding Date: Tue, 18 Jul 2023 23:26:55 +0200 Subject: [PATCH 3/4] Disable SIWE for snaps --- ui/pages/confirm-signature-request/index.js | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/ui/pages/confirm-signature-request/index.js b/ui/pages/confirm-signature-request/index.js index b86b23a6ee06..a36efc84d992 100644 --- a/ui/pages/confirm-signature-request/index.js +++ b/ui/pages/confirm-signature-request/index.js @@ -4,6 +4,7 @@ import { useDispatch, useSelector } from 'react-redux'; import { useHistory, withRouter } from 'react-router-dom'; import log from 'loglevel'; import { cloneDeep } from 'lodash'; +import { SubjectType } from '@metamask/permission-controller'; import * as actions from '../../store/actions'; import txHelper from '../../helpers/utils/tx-helper'; import SignatureRequest from '../../components/app/signature-request'; @@ -16,13 +17,14 @@ import { ///: BEGIN:ONLY_INCLUDE_IN(build-mmi) getSelectedAccount, ///: END:ONLY_INCLUDE_IN + getTargetSubjectMetadata, } from '../../selectors'; import { MESSAGE_TYPE } from '../../../shared/constants/app'; import { TransactionStatus } from '../../../shared/constants/transaction'; import { getSendTo } from '../../ducks/send'; import { getProviderConfig } from '../../ducks/metamask/metamask'; -const signatureSelect = (txData) => { +const signatureSelect = (txData, targetSubjectMetadata) => { const { type, msgParams: { version, siwe }, @@ -36,7 +38,7 @@ const signatureSelect = (txData) => { return SignatureRequest; } - if (siwe?.isSIWEMessage) { + if (siwe?.isSIWEMessage && targetSubjectMetadata !== SubjectType.Snap) { return SignatureRequestSIWE; } @@ -167,11 +169,16 @@ const ConfirmTxScreen = ({ match }) => { const txData = getTxData() || {}; const { msgParams } = txData; + + const targetSubjectMetadata = useSelector((state) => + getTargetSubjectMetadata(state, msgParams?.origin), + ); + if (!msgParams) { return ; } - const SigComponent = signatureSelect(txData); + const SigComponent = signatureSelect(txData, targetSubjectMetadata); return ( Date: Thu, 20 Jul 2023 23:10:20 +0200 Subject: [PATCH 4/4] Add comment --- .../signature-request-original.component.js | 1 + 1 file changed, 1 insertion(+) diff --git a/ui/components/app/signature-request-original/signature-request-original.component.js b/ui/components/app/signature-request-original/signature-request-original.component.js index 37c6afc258ba..a26abf028d03 100644 --- a/ui/components/app/signature-request-original/signature-request-original.component.js +++ b/ui/components/app/signature-request-original/signature-request-original.component.js @@ -178,6 +178,7 @@ export default class SignatureRequestOriginal extends Component {
{ + // Use legacy authorship header for snaps ///: BEGIN:ONLY_INCLUDE_IN(snaps) targetSubjectMetadata?.subjectType === SubjectType.Snap ? (