diff --git a/ui/app/components/app/permission-page-container/permission-page-container-content/permission-page-container-content.component.js b/ui/app/components/app/permission-page-container/permission-page-container-content/permission-page-container-content.component.js index 268c973bf..feb6eaa9a 100644 --- a/ui/app/components/app/permission-page-container/permission-page-container-content/permission-page-container-content.component.js +++ b/ui/app/components/app/permission-page-container/permission-page-container-content/permission-page-container-content.component.js @@ -7,7 +7,13 @@ import CheckBox from '../../../ui/check-box' export default class PermissionPageContainerContent extends PureComponent { static propTypes = { - domainMetadata: PropTypes.object.isRequired, + domainMetadata: PropTypes.shape({ + extensionId: PropTypes.string, + icon: PropTypes.string, + host: PropTypes.string.isRequired, + name: PropTypes.string.isRequired, + origin: PropTypes.string.isRequired, + }), selectedPermissions: PropTypes.object.isRequired, onPermissionToggle: PropTypes.func.isRequired, selectedIdentities: PropTypes.array, @@ -145,6 +151,7 @@ export default class PermissionPageContainerContent extends PureComponent { ? t('allowExternalExtensionTo', [domainMetadata.extensionId]) : t('allowThisSiteTo') } + siteOrigin={domainMetadata.origin} />
{ this.renderRequestedPermissions() } diff --git a/ui/app/components/app/permission-page-container/permission-page-container.component.js b/ui/app/components/app/permission-page-container/permission-page-container.component.js index 3020b82b5..0779f2226 100644 --- a/ui/app/components/app/permission-page-container/permission-page-container.component.js +++ b/ui/app/components/app/permission-page-container/permission-page-container.component.js @@ -14,7 +14,13 @@ export default class PermissionPageContainer extends Component { allIdentitiesSelected: PropTypes.bool, request: PropTypes.object, requestMetadata: PropTypes.object, - targetDomainMetadata: PropTypes.object.isRequired, + targetDomainMetadata: PropTypes.shape({ + extensionId: PropTypes.string, + icon: PropTypes.string, + host: PropTypes.string.isRequired, + name: PropTypes.string.isRequired, + origin: PropTypes.string.isRequired, + }), } static defaultProps = { diff --git a/ui/app/components/app/permissions-connect-header/permissions-connect-header.component.js b/ui/app/components/app/permissions-connect-header/permissions-connect-header.component.js index e32f8a0b1..c1bc5d775 100644 --- a/ui/app/components/app/permissions-connect-header/permissions-connect-header.component.js +++ b/ui/app/components/app/permissions-connect-header/permissions-connect-header.component.js @@ -5,25 +5,25 @@ import SiteIcon from '../../ui/site-icon' export default class PermissionsConnectHeader extends Component { static propTypes = { icon: PropTypes.string, - iconName: PropTypes.string, + iconName: PropTypes.string.isRequired, + siteOrigin: PropTypes.string.isRequired, headerTitle: PropTypes.node, headerText: PropTypes.string, } static defaultProps = { icon: null, - iconName: '', headerTitle: '', headerText: '', } renderHeaderIcon () { - const { icon, iconName } = this.props + const { icon, iconName, siteOrigin } = this.props return (
-
{iconName}
+
{siteOrigin}
) } diff --git a/ui/app/pages/permissions-connect/choose-account/choose-account.component.js b/ui/app/pages/permissions-connect/choose-account/choose-account.component.js index 720fd0bb0..606b2ecc9 100644 --- a/ui/app/pages/permissions-connect/choose-account/choose-account.component.js +++ b/ui/app/pages/permissions-connect/choose-account/choose-account.component.js @@ -25,7 +25,13 @@ export default class ChooseAccount extends Component { cancelPermissionsRequest: PropTypes.func.isRequired, permissionsRequestId: PropTypes.string.isRequired, selectedAccountAddresses: PropTypes.object.isRequired, - targetDomainMetadata: PropTypes.object, + targetDomainMetadata: PropTypes.shape({ + extensionId: PropTypes.string, + icon: PropTypes.string, + host: PropTypes.string.isRequired, + name: PropTypes.string.isRequired, + origin: PropTypes.string.isRequired, + }), } state = { @@ -197,6 +203,7 @@ export default class ChooseAccount extends Component { ? t('selectAccounts') : t('connectAccountOrCreate') } + siteOrigin={targetDomainMetadata.origin} /> {this.renderAccountsListHeader()} {this.renderAccountsList()} diff --git a/ui/app/pages/permissions-connect/permissions-connect.component.js b/ui/app/pages/permissions-connect/permissions-connect.component.js index 068d846dd..4119e04a6 100644 --- a/ui/app/pages/permissions-connect/permissions-connect.component.js +++ b/ui/app/pages/permissions-connect/permissions-connect.component.js @@ -31,7 +31,13 @@ export default class PermissionConnect extends Component { connectPath: PropTypes.string.isRequired, confirmPermissionPath: PropTypes.string.isRequired, page: PropTypes.string.isRequired, - targetDomainMetadata: PropTypes.object, + targetDomainMetadata: PropTypes.shape({ + extensionId: PropTypes.string, + icon: PropTypes.string, + host: PropTypes.string.isRequired, + name: PropTypes.string.isRequired, + origin: PropTypes.string.isRequired, + }), } static defaultProps = { @@ -95,7 +101,7 @@ export default class PermissionConnect extends Component { if ( permissionsRequest && - savedMetadata.name !== targetDomainMetadata?.name + savedMetadata.origin !== targetDomainMetadata?.origin ) { return { targetDomainMetadata } } diff --git a/ui/app/pages/permissions-connect/permissions-connect.container.js b/ui/app/pages/permissions-connect/permissions-connect.container.js index 31a727cb5..30a76ec55 100644 --- a/ui/app/pages/permissions-connect/permissions-connect.container.js +++ b/ui/app/pages/permissions-connect/permissions-connect.container.js @@ -43,13 +43,20 @@ const mapStateToProps = (state, ownProps) => { const nativeCurrency = getNativeCurrency(state) const domainMetadata = getDomainMetadata(state) - const targetDomainMetadata = origin - ? domainMetadata[origin] || { - origin, - name: (new URL(origin)).hostname, - icon: null, + + let targetDomainMetadata = null + if (origin) { + if (domainMetadata[origin]) { + targetDomainMetadata = { ...domainMetadata[origin], origin } + } else { + const targetUrl = new URL(origin) + targetDomainMetadata = { + host: targetUrl.host, + name: targetUrl.hostname, + origin, + } } - : null + } const accountsWithLabels = getAccountsWithLabels(state) diff --git a/ui/app/pages/permissions-connect/redirect/permissions-redirect.component.js b/ui/app/pages/permissions-connect/redirect/permissions-redirect.component.js index 3795f348c..ac39de104 100644 --- a/ui/app/pages/permissions-connect/redirect/permissions-redirect.component.js +++ b/ui/app/pages/permissions-connect/redirect/permissions-redirect.component.js @@ -33,5 +33,11 @@ export default function PermissionsRedirect ({ domainMetadata }) { } PermissionsRedirect.propTypes = { - domainMetadata: PropTypes.object.isRequired, + domainMetadata: PropTypes.shape({ + extensionId: PropTypes.string, + icon: PropTypes.string, + host: PropTypes.string.isRequired, + name: PropTypes.string.isRequired, + origin: PropTypes.string.isRequired, + }), }