diff --git a/ui/pages/permissions-connect/permissions-connect.component.js b/ui/pages/permissions-connect/permissions-connect.component.js index ee7892fbf8d1..e9f4f5f8f592 100644 --- a/ui/pages/permissions-connect/permissions-connect.component.js +++ b/ui/pages/permissions-connect/permissions-connect.component.js @@ -131,6 +131,9 @@ export default class PermissionConnect extends Component { this.props.permissionsRequest, ), permissionsApproved: null, + origin: this.props.origin, + targetSubjectMetadata: this.props.targetSubjectMetadata || {}, + snapsInstallPrivacyWarningShown: this.props.snapsInstallPrivacyWarningShown, }; componentDidMount() { @@ -153,7 +156,6 @@ export default class PermissionConnect extends Component { history.replace(DEFAULT_ROUTE); return; } - if (history.location.pathname === connectPath && !isRequestingAccounts) { switch (requestType) { case 'wallet_installSnap': @@ -175,8 +177,17 @@ export default class PermissionConnect extends Component { } componentDidUpdate(prevProps) { - const { permissionsRequest, lastConnectedInfo, origin } = this.props; - const { redirecting } = this.state; + const { permissionsRequest, lastConnectedInfo, targetSubjectMetadata } = + this.props; + const { redirecting, origin } = this.state; + + // We cache the last known good targetSubjectMetadata since it may be null when the approval is cleared + if ( + targetSubjectMetadata?.origin && + prevProps.targetSubjectMetadata?.origin !== targetSubjectMetadata?.origin + ) { + this.setState({ targetSubjectMetadata }); + } if (!permissionsRequest && prevProps.permissionsRequest && !redirecting) { const accountsLastApprovedTime = @@ -262,7 +273,7 @@ export default class PermissionConnect extends Component { } renderTopBar(permissionsRequestId) { - const { targetSubjectMetadata } = this.props; + const { targetSubjectMetadata } = this.state; const handleCancelFromHeader = () => { this.cancelPermissionsRequest(permissionsRequestId); }; @@ -319,12 +330,14 @@ export default class PermissionConnect extends Component { rejectPendingApproval, setSnapsInstallPrivacyWarningShownStatus, approvePermissionsRequest, - snapsInstallPrivacyWarningShown, - origin, history, } = this.props; - const { selectedAccountAddresses, permissionsApproved, redirecting } = - this.state; + const { + selectedAccountAddresses, + permissionsApproved, + redirecting, + snapsInstallPrivacyWarningShown, + } = this.state; const isRequestingSnap = isSnapId(permissionsRequest?.metadata?.origin); @@ -366,7 +379,7 @@ export default class PermissionConnect extends Component { rejectPermissionsRequest={(requestId) => this.cancelPermissionsRequest(requestId) } - activeTabOrigin={origin} + activeTabOrigin={this.state.origin} request={permissionsRequest} permissionsRequestId={permissionsRequestId} approveConnection={this.approveConnection}