display connected email on About page (#327)

* display connected email on About page
* add mailing preferences link
This commit is contained in:
Akinwale Ariwodola 2018-10-07 15:55:01 +01:00 committed by GitHub
parent baef12a26d
commit f12460e83a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 46 additions and 9 deletions

View file

@ -1,6 +1,14 @@
import { connect } from 'react-redux';
import { doFetchAccessToken, selectAccessToken, selectUserEmail } from 'lbryinc';
import AboutPage from './view';
const perform = dispatch => ({});
const select = state => ({
accessToken: selectAccessToken(state),
userEmail: selectUserEmail(state),
});
export default connect(null, perform)(AboutPage);
const perform = dispatch => ({
fetchAccessToken: () => dispatch(doFetchAccessToken()),
});
export default connect(select, perform)(AboutPage);

View file

@ -28,10 +28,12 @@ class AboutPage extends React.PureComponent {
lbryId: info.installation_id,
});
});
if (!this.props.accessToken) this.props.fetchAccessToken();
}
render() {
const { navigation } = this.props;
const { accessToken, navigation, userEmail } = this.props;
const loading = 'Loading...';
const ver = this.state.versionInfo ? this.state.versionInfo : null;
@ -63,7 +65,21 @@ class AboutPage extends React.PureComponent {
<Link style={aboutStyle.link} href="https://reddit.com/r/lbry" text="Reddit" />
<Link style={aboutStyle.link} href="https://t.me/lbryofficial" text="Telegram" />
</View>
<Text style={aboutStyle.releaseInfoTitle}>Release information</Text>
<Text style={aboutStyle.releaseInfoTitle}>App info</Text>
{userEmail && userEmail.trim().length > 0 &&
<View style={aboutStyle.verticalRow}>
<View style={aboutStyle.innerRow}>
<View style={aboutStyle.col}><Text style={aboutStyle.text}>Connected Email</Text></View>
<View style={aboutStyle.col}><Text selectable={true} style={aboutStyle.valueText}>{userEmail}</Text></View>
</View>
<View>
<Link
style={aboutStyle.emailPreferencesLink}
href={`http://lbry.io/list/edit/${accessToken}`}
text="Update mailing preferences" />
</View>
</View>}
<View style={aboutStyle.row}>
<View style={aboutStyle.col}><Text style={aboutStyle.text}>App version</Text></View>
<View style={aboutStyle.col}><Text selectable={true} style={aboutStyle.valueText}>{this.state.appVersion}</Text></View>
@ -74,11 +90,6 @@ class AboutPage extends React.PureComponent {
<View style={aboutStyle.col}><Text selectable={true} style={aboutStyle.valueText}>{ver ? ver.lbrynet_version : loading }</Text></View>
</View>
<View style={aboutStyle.row}>
<View style={aboutStyle.col}><Text style={aboutStyle.text}>Wallet (lbryum)</Text></View>
<View style={aboutStyle.col}><Text selectable={true} style={aboutStyle.valueText}>{ver ? ver.lbryum_version : loading }</Text></View>
</View>
<View style={aboutStyle.row}>
<View style={aboutStyle.col}><Text style={aboutStyle.text}>Platform</Text></View>
<View style={aboutStyle.col}><Text selectable={true} style={aboutStyle.valueText}>{ver ? ver.platform : loading }</Text></View>

View file

@ -16,6 +16,18 @@ const aboutStyle = StyleSheet.create({
flexDirection: 'row',
justifyContent: 'space-between'
},
innerRow: {
marginBottom: 4,
flex: 1,
flexDirection: 'row',
justifyContent: 'space-between'
},
verticalRow: {
marginBottom: 1,
backgroundColor: '#f9f9f9',
padding: 16,
flex: 1
},
title: {
color: Colors.LbryGreen,
fontSize: 24,
@ -44,6 +56,12 @@ const aboutStyle = StyleSheet.create({
fontSize: 16,
marginBottom: 24
},
emailPreferencesLink: {
color: Colors.LbryGreen,
fontFamily: 'Metropolis-Regular',
fontSize: 15,
alignSelf: 'flex-end'
},
col: {
alignSelf: 'stretch'
},