[MM-23584][MM-23675] Add first and last name to user profile view & language support (#4092)
* Add name to profile view * Add first and last name fields * Styling update * Update snapshot * Add language support and change ordering
This commit is contained in:
parent
7afa9aed01
commit
c07e8fb8d3
2 changed files with 58 additions and 9 deletions
|
|
@ -146,13 +146,12 @@ exports[`user_profile should match snapshot 1`] = `
|
|||
"fontWeight": "600",
|
||||
"marginBottom": 10,
|
||||
"marginTop": 25,
|
||||
"textTransform": "uppercase",
|
||||
},
|
||||
null,
|
||||
]
|
||||
}
|
||||
>
|
||||
USERNAME
|
||||
</Text>
|
||||
/>
|
||||
<Text
|
||||
style={
|
||||
Array [
|
||||
|
|
@ -164,7 +163,7 @@ exports[`user_profile should match snapshot 1`] = `
|
|||
]
|
||||
}
|
||||
>
|
||||
fred
|
||||
test
|
||||
</Text>
|
||||
</View>
|
||||
<View>
|
||||
|
|
@ -177,13 +176,42 @@ exports[`user_profile should match snapshot 1`] = `
|
|||
"fontWeight": "600",
|
||||
"marginBottom": 10,
|
||||
"marginTop": 25,
|
||||
"textTransform": "uppercase",
|
||||
},
|
||||
null,
|
||||
]
|
||||
}
|
||||
/>
|
||||
<Text
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": "#3d3c40",
|
||||
"fontSize": 15,
|
||||
},
|
||||
null,
|
||||
]
|
||||
}
|
||||
>
|
||||
NICKNAME
|
||||
fake
|
||||
</Text>
|
||||
</View>
|
||||
<View>
|
||||
<Text
|
||||
style={
|
||||
Array [
|
||||
Object {
|
||||
"color": undefined,
|
||||
"fontSize": 13,
|
||||
"fontWeight": "600",
|
||||
"marginBottom": 10,
|
||||
"marginTop": 25,
|
||||
"textTransform": "uppercase",
|
||||
},
|
||||
null,
|
||||
]
|
||||
}
|
||||
/>
|
||||
<Text
|
||||
style={
|
||||
Array [
|
||||
|
|
|
|||
|
|
@ -140,13 +140,32 @@ export default class UserProfile extends PureComponent {
|
|||
};
|
||||
|
||||
buildDisplayBlock = (property) => {
|
||||
const {formatMessage} = this.context.intl;
|
||||
const {theme, user, isLandscape} = this.props;
|
||||
const style = createStyleSheet(theme);
|
||||
let label;
|
||||
|
||||
if (Object.prototype.hasOwnProperty.call(user, property) && user[property].length > 0) {
|
||||
switch (property) {
|
||||
case 'first_name':
|
||||
label = formatMessage({id: 'user.settings.general.firstName', defaultMessage: 'First Name'});
|
||||
break;
|
||||
case 'last_name':
|
||||
label = formatMessage({id: 'user.settings.general.lastName', defaultMessage: 'Last Name'});
|
||||
break;
|
||||
case 'email':
|
||||
label = formatMessage({id: 'user.settings.general.email', defaultMessage: 'Email'});
|
||||
break;
|
||||
case 'nickname':
|
||||
label = formatMessage({id: 'user.settings.general.nickname', defaultMessage: 'Nickname'});
|
||||
break;
|
||||
case 'position':
|
||||
label = formatMessage({id: 'user.settings.general.position', defaultMessage: 'Position'});
|
||||
}
|
||||
|
||||
if (user.hasOwnProperty(property) && user[property].length > 0) {
|
||||
return (
|
||||
<View>
|
||||
<Text style={[style.header, padding(isLandscape)]}>{property.toUpperCase()}</Text>
|
||||
<Text style={[style.header, padding(isLandscape)]}>{label}</Text>
|
||||
<Text style={[style.text, padding(isLandscape)]}>{user[property]}</Text>
|
||||
</View>
|
||||
);
|
||||
|
|
@ -284,11 +303,12 @@ export default class UserProfile extends PureComponent {
|
|||
|
||||
return (
|
||||
<View style={style.content}>
|
||||
{this.props.enableTimezone && this.buildTimezoneBlock()}
|
||||
{this.buildDisplayBlock('username')}
|
||||
{this.buildDisplayBlock('first_name')}
|
||||
{this.buildDisplayBlock('last_name')}
|
||||
{this.props.config.ShowEmailAddress === 'true' && this.buildDisplayBlock('email')}
|
||||
{this.buildDisplayBlock('nickname')}
|
||||
{this.buildDisplayBlock('position')}
|
||||
{this.props.enableTimezone && this.buildTimezoneBlock()}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
|
@ -351,6 +371,7 @@ const createStyleSheet = makeStyleSheetFromTheme((theme) => {
|
|||
header: {
|
||||
fontSize: 13,
|
||||
fontWeight: '600',
|
||||
textTransform: 'uppercase',
|
||||
color: changeOpacity(theme.centerChannelColor, 0.5),
|
||||
marginTop: 25,
|
||||
marginBottom: 10,
|
||||
|
|
|
|||
Loading…
Reference in a new issue