m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Show origin in connect flow rather than site name (#8885)

Browse Source 
The designs for the connect flow show the site `origin` below the site
icon rather than the site name. This was done for security reasons,
and because the site name is often set to an unwieldy long string.

This was accidentally undone in #8815 in the process of fixing a
separate bug. The origin has now been restored. More specific PropTypes
have been set on each use of the `domainMetadata` prop as well.
This commit is contained in:
Mark Stacey 2020-07-02 14:08:43 -03:00 committed by GitHub
parent 603093a961
commit e4410724e9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 55 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
ui/app/components/app/permission-page-container/permission-page-container-content/permission-page-container-content.component.js
View File

@ -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}
/>
<section className="permission-approval-container__permissions-container">
{ this.renderRequestedPermissions() }

8
ui/app/components/app/permission-page-container/permission-page-container.component.js
View File

@ -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 = {

8
ui/app/components/app/permissions-connect-header/permissions-connect-header.component.js
View File

@ -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 (
<div className="permissions-connect-header__icon">
<SiteIcon icon={ icon } name={ iconName } size={64} />
<div className="permissions-connect-header__text">{iconName}</div>
<div className="permissions-connect-header__text">{siteOrigin}</div>
</div>
)
}

9
ui/app/pages/permissions-connect/choose-account/choose-account.component.js
View File

@ -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()}

10
ui/app/pages/permissions-connect/permissions-connect.component.js
View File

@ -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 }
}

19
ui/app/pages/permissions-connect/permissions-connect.container.js
View File

@ -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)

8
ui/app/pages/permissions-connect/redirect/permissions-redirect.component.js
View File

@ -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,
}),
}