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 202195d8c9ac..6eb4272c3f0f 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 {
@@ -46,6 +49,9 @@ import ConfirmPageContainerNavigation from '../confirm-page-container/confirm-pa
import SecurityProviderBannerMessage from '../security-provider-banner-message/security-provider-banner-message';
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 {
@@ -179,16 +185,31 @@ export default class SignatureRequestOriginal extends Component {
}
-
+ {
+ // Use legacy authorship header for snaps
+ ///: BEGIN:ONLY_INCLUDE_IN(snaps)
+ targetSubjectMetadata?.subjectType === SubjectType.Snap ? (
+
+ ) : (
+ ///: END:ONLY_INCLUDE_IN
+
+ ///: BEGIN:ONLY_INCLUDE_IN(snaps)
+ )
+ ///: END:ONLY_INCLUDE_IN
+ }
{
+ 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,
+ marginLeft: PropTypes.number,
+ marginRight: PropTypes.number,
+};
+
+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',
+};
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 (