m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 09:57:02 +01:00
Code

Show snap version on install (#13931)

Browse Source 
* Add version to Snap install page

* Fix text sizing inconsistency

* Use a localized string for shorthand versions
This commit is contained in:
Frederik Bolding 2022-03-14 18:40:21 +01:00 committed by Erik Marks
parent bd48a2acb8
commit 29e083c4c4
5 changed files with 52 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/_locales/en/messages.json generated
View File

@ -2669,6 +2669,10 @@
"settings": {
"message": "Settings"
},
"shorthandVersion": {
"message": "v$1",
"description": "$1 is replaced by a version string (e.g. 1.2.3)"
},
"show": {
"message": "Show"
},

2
ui/components/app/flask/snap-settings-card/snap-settings-card.js
View File

@ -180,7 +180,7 @@ const SnapSettingsCard = ({
tag="span"
className="snap-settings-card__version"
>
v {version}
{t('shorthandVersion', [version])}
</Typography>
</>
)}

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

@ -5,12 +5,24 @@ import Box from '../../ui/box';
import {
FLEX_DIRECTION,
JUSTIFY_CONTENT,
///: BEGIN:ONLY_INCLUDE_IN(flask)
COLORS,
TYPOGRAPHY,
TEXT_ALIGN,
///: END:ONLY_INCLUDE_IN
} from '../../../helpers/constants/design-system';
///: BEGIN:ONLY_INCLUDE_IN(flask)
import SnapsAuthorshipPill from '../flask/snaps-authorship-pill';
import Typography from '../../ui/typography';
///: END:ONLY_INCLUDE_IN
export default class PermissionsConnectHeader extends Component {
///: BEGIN:ONLY_INCLUDE_IN(flask)
static contextTypes = {
t: PropTypes.func,
};
///: END:ONLY_INCLUDE_IN
static propTypes = {
iconUrl: PropTypes.string,
iconName: PropTypes.string.isRequired,
@ -20,6 +32,7 @@ export default class PermissionsConnectHeader extends Component {
headerText: PropTypes.string,
///: BEGIN:ONLY_INCLUDE_IN(flask)
npmPackageName: PropTypes.string,
snapVersion: PropTypes.string,
///: END:ONLY_INCLUDE_IN
};
@ -47,10 +60,12 @@ export default class PermissionsConnectHeader extends Component {
headerText,
///: BEGIN:ONLY_INCLUDE_IN(flask)
npmPackageName,
snapVersion,
///: END:ONLY_INCLUDE_IN
} = this.props;
///: BEGIN:ONLY_INCLUDE_IN(flask)
const npmPackageUrl = `https://www.npmjs.com/package/${npmPackageName}`;
const { t } = this.context;
///: END:ONLY_INCLUDE_IN
return (
<Box
@ -71,6 +86,24 @@ export default class PermissionsConnectHeader extends Component {
) : null
///: END:ONLY_INCLUDE_IN
}
{
///: BEGIN:ONLY_INCLUDE_IN(flask)
snapVersion && (
<Typography
boxProps={{
margin: [2, 0],
}}
color={COLORS.TEXT_MUTED}
variant={TYPOGRAPHY.H7}
align={TEXT_ALIGN.CENTER}
tag="span"
className="version"
>
{t('shorthandVersion', [snapVersion])}
</Typography>
)
///: END:ONLY_INCLUDE_IN
}
<div className="permissions-connect-header__subtitle">{headerText}</div>
</Box>
);

4
ui/pages/permissions-connect/flask/snap-install/index.scss
View File

@ -22,6 +22,10 @@
}
}
.version {
font-family: monospace;
}
.page-container__footer {
width: 100%;
}

17
ui/pages/permissions-connect/flask/snap-install/snap-install.js
View File

@ -75,16 +75,18 @@ export default function SnapInstall({
headerText={null} // TODO(ritave): Add header text when snaps support description
siteOrigin={targetSubjectMetadata.origin}
npmPackageName={npmId}
snapVersion={targetSubjectMetadata.version}
boxProps={{ alignItems: ALIGN_ITEMS.CENTER }}
/>
<Typography></Typography>
<Box
className="snap-requests-permission"
padding={4}
tag={TYPOGRAPHY.H7}
<Typography
boxProps={{
padding: [4, 4, 0, 4],
}}
variant={TYPOGRAPHY.H7}
tag="span"
>
<span>{t('snapRequestsPermission')}</span>
</Box>
{t('snapRequestsPermission')}
</Typography>
<PermissionsConnectPermissionList
permissions={request.permissions || {}}
/>
@ -149,5 +151,6 @@ SnapInstall.propTypes = {
name: PropTypes.string,
origin: PropTypes.string.isRequired,
sourceCode: PropTypes.string,
version: PropTypes.string,
}).isRequired,
};