ecency/ecency-mobile
1
1
Fork 0
mirror of https://github.com/ecency/ecency-mobile.git synced 2024-12-23 13:22:02 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of https://github.com/esteemapp/esteem-mobile into header

Browse Source
This commit is contained in:
ue 2018-10-11 19:22:47 +03:00
commit 8c1a86e405
18 changed files with 2811 additions and 2755 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5119
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

8
package.json
View File

@ -3,10 +3,10 @@
"version": "0.0.1",
"private": true,
"scripts": {
"start": "react-native-scripts start",
"eject": "react-native-scripts eject",
"android": "react-native-scripts android",
"ios": "react-native-scripts ios",
"start": "node node_modules/react-native/local-cli/cli.js start",
"eject": "node node_modules/react-native/local-cli/cli.js eject",
"android": "node node_modules/react-native/local-cli/cli.js run-android",
"ios": "node node_modules/react-native/local-cli/cli.js run-ios",
"test": "node node_modules/jest/bin/jest.js --watch",
"lint": "eslint src/",
"lint:fix": "eslint src/ --fix",

3
src/components/basicUIElements/index.js
View File

@ -2,10 +2,9 @@ import Card from './view/cardView';
import GrayWrapper from './view/grayWrapperView';
import LineBreak from './view/lineBreakView';
import NoPost from './view/noPostView';
import PercentBar from './view/percentBarView';
import TextWithIcon from './view/textWithIconView';
import WalletLineItem from './view/walletLineItemView';
export {
Card, GrayWrapper, LineBreak, NoPost, PercentBar, TextWithIcon, WalletLineItem,
Card, GrayWrapper, LineBreak, NoPost, TextWithIcon, WalletLineItem,
};

16
src/components/basicUIElements/view/noPostStyles.js
View File

@ -1,21 +1,21 @@
import EStyleSheet from "react-native-extended-stylesheet";
import EStyleSheet from 'react-native-extended-stylesheet';
export default EStyleSheet.create({
wrapper: {
flexDirection: "column",
alignItems: "center",
height: "$deviceHeight",
backgroundColor: "$white",
flexDirection: 'column',
alignItems: 'center',
height: '$deviceHeight',
backgroundColor: '$white',
},
image: {
width: "$deviceWidth - 40",
width: '$deviceWidth - 40',
height: 192,
marginTop: 16,
},
text: {
color: "$primaryDarkGray",
color: '$primaryDarkGray',
fontSize: 14,
marginTop: 12,
fontWeight: "bold",
fontWeight: 'bold',
},
});

42
src/components/basicUIElements/view/percentBarView.js
View File

@ -1,42 +0,0 @@
import React from 'react';
import { View, Dimensions, Text } from 'react-native';
import styles from './percentBarStyles';
const PercentBar = ({
percent, margin, text, barColor, barPercentColor, textColor, isTop,
}) => (
<View>
{_getText(textColor, text, isTop, true)}
<View style={[styles.container, barColor && { backgroundColor: barColor }]}>
<View
style={[
styles.powerBar,
barPercentColor && { backgroundColor: barPercentColor },
{ width: _calculateWidth(percent, margin) },
]}
/>
</View>
{_getText(textColor, text, isTop, false)}
</View>
);
const _calculateWidth = (percent, margin = null) => {
if (percent) {
const per = 100 / percent;
return Dimensions.get('window').width / per - margin;
}
return null;
};
const _getText = (textColor, text, isTop, isRender) => {
if (isTop === isRender && text) {
return (
<View style={styles.percentTitleWrapper}>
<Text style={[styles.percentTitle, textColor && { color: textColor }]}>{text}</Text>
</View>
);
}
};
export default PercentBar;

2
src/components/comment/comment.js
View File

@ -375,7 +375,7 @@ class Comment extends React.PureComponent {
flexDirection:
'row',
borderColor:
'lightgray',
'$primaryLightGray',
borderWidth: 1,
borderRadius: 10,
}}

12
src/components/formInput/view/formInputView.js
View File

@ -1,7 +1,5 @@
import React, { Component } from 'react';
import {
View, Text, Image, TextInput,
} from 'react-native';
import { View, TextInput } from 'react-native';
import Ionicons from 'react-native-vector-icons/Ionicons';
import FastImage from 'react-native-fast-image';
@ -30,7 +28,7 @@ class FormInputView extends Component {
this.state = {
value: '',
inputBorderColor:"$iconColor",
inputBorderColor: '#c1c5c7',
isValid: true,
};
}
@ -93,7 +91,7 @@ class FormInputView extends Component {
})
}
onSubmitEditing={() => this.setState({
inputBorderColor:"$iconColor",
inputBorderColor: '$iconColor',
})
}
autoCapitalize="none"
@ -101,9 +99,7 @@ class FormInputView extends Component {
placeholder={placeholder}
editable={isEditable || true}
textContentType={type}
onChangeText={(value) => {
this._handleOnChange(value);
}}
onChangeText={val => this._handleOnChange(val)}
value={value}
style={styles.textInput}
/>

4
src/components/percentBar/index.js Normal file
View File

@ -0,0 +1,4 @@
import PercentBar from './view/percentBarView';
export { PercentBar };
export default PercentBar;

5
src/components/basicUIElements/view/percentBarStyles.js → src/components/percentBar/view/percentBarStyles.js
View File

@ -4,7 +4,7 @@ export default EStyleSheet.create({
container: {
backgroundColor: '$primaryLightBlue',
height: 2,
marginVertical: 4,
marginVertical: 2,
borderRadius: 50,
},
powerBar: {
@ -19,6 +19,7 @@ export default EStyleSheet.create({
percentTitle: {
color: '$primaryBlue',
fontSize: 11,
marginVertical: 10,
marginVertical: 1,
height: 15,
},
});

79
src/components/percentBar/view/percentBarView.js Normal file
View File

@ -0,0 +1,79 @@
import React, { Component } from 'react';
import {
View, Dimensions, Text, TouchableOpacity,
} from 'react-native';
// Constants
// Components
// Styles
import styles from './percentBarStyles';
class PercentBarView extends Component {
/* Props
* ------------------------------------------------
* @prop { string } barColor - Bar color proferties
* @prop { string } barPercentColor - Bar background color properties
* @prop { number } margin - If you use with margin right and left you should declare that if it neccessary
* @prop { number } percent - Percent for bar (ex: %32 just send 32)
* @prop { string } text - Text string
* @prop { string } textColor - Text color
*
*/
constructor(props) {
super(props);
this.state = {};
}
// Component Life Cycles
// Component Functions
_calculateWidth = (percent, margin = null) => {
if (percent) {
const per = 100 / percent;
return Dimensions.get('window').width / per - margin;
}
return null;
};
_getText = (textColor, text, isTop, isRender) => {
const { isShowText } = this.props;
if (isTop === isRender && text) {
return (
<View style={styles.percentTitleWrapper}>
<Text style={[styles.percentTitle, textColor && { color: textColor }]}>
{isShowText && text}
</Text>
</View>
);
}
};
render() {
const {
percent, margin, text, barColor, barPercentColor, textColor, isTop,
} = this.props;
return (
<View>
{this._getText(textColor, text, isTop, true)}
<View style={[styles.container, barColor && { backgroundColor: barColor }]}>
<View
style={[
styles.powerBar,
barPercentColor && { backgroundColor: barPercentColor },
{ width: this._calculateWidth(percent, margin) },
]}
/>
</View>
{this._getText(textColor, text, isTop, false)}
</View>
);
}
}
export default PercentBarView;

66
src/components/profileSummary/view/profileSummaryView.js
View File

@ -1,5 +1,7 @@
import React, { Component } from 'react';
import { View, Image, Text } from 'react-native';
import React, { Component, Fragment } from 'react';
import {
View, Image, Text, TouchableOpacity,
} from 'react-native';
import { DropdownButton } from '../../dropdownButton';
// Constants
@ -7,7 +9,7 @@ import DEFAULT_IMAGE from '../../../assets/default_cover_image.png';
// Components
import { TextWithIcon } from '../../basicUIElements';
import { PercentBar } from '../../basicUIElements';
import { PercentBar } from '../../percentBar';
import { IconButton } from '../../iconButton';
// Styles
// eslint-disable-next-line
@ -21,26 +23,22 @@ class ProfileSummaryView extends Component {
constructor(props) {
super(props);
this.state = {};
this.state = {
isShowPercentText: false,
};
}
// Component Life Cycles
// Component Functions
_getFollowerCount = () => {
const { followerCount } = this.props;
return 32;
};
_getFollowingCount = () => {
const { followingCoung } = this.props;
return 32;
};
render() {
const { isShowPercentText } = this.state;
const {
percent,
hours,
percentRC,
percentVP,
hoursVP,
hoursRC,
location,
link,
date,
@ -48,11 +46,11 @@ class ProfileSummaryView extends Component {
followerCount,
coverImage,
} = this.props;
const votingPowerText = `Voting power:${{ percent }}% • Full in ${{ hours }}hours`;
const rcsPowerText = 'RCs: 20% • Full in 36 hours';
const votingPowerText = `Voting power: ${percentVP}% • Full in ${hoursVP} hours`;
const rcsPowerText = `RCs: ${percentRC}% • Full in ${hoursRC} hours`;
return (
<View>
<Fragment>
<View style={styles.textWithIconWrapper}>
<TextWithIcon text={location} iconName="md-navigate" />
<TextWithIcon isClickable text={link} iconName="md-globe" />
@ -64,17 +62,25 @@ class ProfileSummaryView extends Component {
source={{ uri: coverImage }}
defaultSource={DEFAULT_IMAGE}
/>
<PercentBar percent={percent} margin={24} isTop text={votingPowerText} />
<PercentBar
percent={percent}
margin={24}
barColor="#eafcef"
barPercentColor="#11c28b"
textColor="#11c28b"
isTop={false}
text={rcsPowerText}
/>
<TouchableOpacity onPress={() => this.setState({ isShowPercentText: !isShowPercentText })}>
<PercentBar
isShowText={isShowPercentText}
percent={percentVP}
margin={24}
isTop
text={votingPowerText}
/>
<PercentBar
isShowText={isShowPercentText}
percent={percentRC}
margin={24}
barColor="#eafcef"
barPercentColor="#11c28b"
textColor="#11c28b"
isTop={false}
text={rcsPowerText}
/>
</TouchableOpacity>
<View style={styles.footer}>
<View style={styles.leftIcons}>
@ -111,7 +117,7 @@ class ProfileSummaryView extends Component {
/>
</View>
</View>
</View>
</Fragment>
);
}
}

5
src/components/wallet/view/walletView.js
View File

@ -10,7 +10,6 @@ import { CollapsibleCard } from '../../collapsibleCard';
import { WalletDetails } from '../../walletDetails';
import { Transaction } from '../../transaction';
// Styles
import styles from './walletStyles';
@ -30,7 +29,7 @@ class WalletView extends Component {
// Component Functions
render() {
// const {} = this.props;
const { user } = this.props;
return (
<View style={styles.container}>
@ -53,7 +52,7 @@ class WalletView extends Component {
</CollapsibleCard>
<CollapsibleCard titleColor="#788187" title="Wallet Details" expanded>
<WalletDetails />
<WalletDetails balance={user.balance} />
</CollapsibleCard>
<Transaction />

3
src/components/walletDetails/view/walletDetailsView.js
View File

@ -25,13 +25,14 @@ class WalletDetailsView extends Component {
// Component Functions
render() {
const { balance } = this.props;
return (
<View>
<WalletLineItem
text="Steem"
textColor="#3c4449"
iconName="ios-information-circle-outline"
rightText="27.178 STEEM"
rightText={balance}
isBoldText
/>
<GrayWrapper>

2
src/screens/authorProfile/screen/authorStyles.js
View File

@ -23,7 +23,7 @@ export default EStyleSheet.create({
alignSelf: 'center',
},
about: {
borderColor: 'lightgray',
borderColor: '$primaryLightGray',
borderTopWidth: 1,
borderBottomWidth: 1,
flexDirection: 'row',

139
src/screens/login/screen/loginScreen.js
View File

@ -9,12 +9,12 @@ import { isLoggedIn } from '../../../redux/actions/userActions';
// Internal Components
import { FormInput } from '../../../components/formInput';
import { TextButton } from '../../../components/buttons';
import { InformationArea } from '../../../components/informationArea';
import { Login } from '../../../providers/steem/auth';
import { LoginHeader } from '../../../components/loginHeader';
import { MainButton } from '../../../components/mainButton';
import { TabBar } from '../../../components/tabBar';
import { TextButton } from '../../../components/buttons';
import { lookupAccounts } from '../../../providers/steem/dsteem';
import STEEM_CONNECT_LOGO from '../../../assets/steem_connect.png';
@ -104,74 +104,79 @@ class LoginScreen extends Component {
description="To get all the benefits using eSteem"
onPress={() => this._handleSignUp()}
/>
<ScrollableTabView
locked={isLoading}
style={styles.tabView}
renderTabBar={() => (
<TabBar
style={styles.tabbar}
tabUnderlineDefaultWidth={100} // default containerWidth / (numberOfTabs * 4)
tabUnderlineScaleX={2} // default 3
activeColor="#357ce6"
inactiveColor="#222"
/>
)}
<KeyboardAwareScrollView
onKeyboardWillShow={() => this.setState({ keyboardIsOpen: true })}
onKeyboardWillHide={() => this.setState({ keyboardIsOpen: false })}
>
<View tabLabel="Sign in" style={styles.tabbarItem}>
<FormInput
rightIconName="md-at"
leftIconName="md-close-circle"
isValid={isUsernameValid}
onChange={value => this._handleUsernameChange(value)}
placeholder="Username"
isEditable
type="username"
isFirstImage
value={username}
/>
<FormInput
rightIconName="md-lock"
leftIconName="md-close-circle"
isValid={isUsernameValid}
onChange={value => this._handleOnPasswordChange(value)}
placeholder="Password or WIF"
isEditable
secureTextEntry
type="password"
/>
<InformationArea
description="User credentials are kept locally on the device. Credentials are
removed upon logout!"
iconName="ios-information-circle-outline"
/>
<View style={styles.footerButtons}>
<TextButton onPress={() => navigation.navigate(ROUTES.DRAWER.MAIN)} text="cancel" />
<ScrollableTabView
locked={isLoading}
style={styles.tabView}
renderTabBar={() => (
<TabBar
style={styles.tabbar}
tabUnderlineDefaultWidth={100} // default containerWidth / (numberOfTabs * 4)
tabUnderlineScaleX={2} // default 3
activeColor="#357ce6"
inactiveColor="#222"
/>
)}
>
<View tabLabel="Sign in" style={styles.tabbarItem}>
<FormInput
rightIconName="md-at"
leftIconName="md-close-circle"
isValid={isUsernameValid}
onChange={value => this._handleUsernameChange(value)}
placeholder="Username"
isEditable
type="username"
isFirstImage
value={username}
/>
<FormInput
rightIconName="md-lock"
leftIconName="md-close-circle"
isValid={isUsernameValid}
onChange={value => this._handleOnPasswordChange(value)}
placeholder="Password or WIF"
isEditable
secureTextEntry
type="password"
/>
<InformationArea
description="User credentials are kept locally on the device. Credentials are
removed upon logout!"
iconName="ios-information-circle-outline"
/>
<View style={styles.footerButtons}>
<TextButton onPress={() => navigation.navigate(ROUTES.DRAWER.MAIN)} text="cancel" />
</View>
<MainButton
wrapperStyle={styles.mainButtonWrapper}
onPress={this._handleOnPressLogin}
iconName="md-person"
iconColor="white"
text="LOGIN"
isDisable={!isUsernameValid || password.length < 2 || username.length < 2}
isLoading={isLoading}
/>
</View>
<MainButton
wrapperStyle={styles.mainButtonWrapper}
onPress={this._handleOnPressLogin}
iconName="md-person"
iconColor="white"
text="LOGIN"
isDisable={!isUsernameValid || password.length < 2 || username.length < 2}
isLoading={isLoading}
/>
</View>
<View tabLabel="SteemConnect" style={styles.steemConnectTab}>
<InformationArea
description="If you don't want to keep your password encrypted and saved on your device, you can use Steemconnect."
iconName="ios-information-circle-outline"
/>
<MainButton
wrapperStyle={styles.mainButtonWrapper}
onPress={() => this._loginwithSc2()}
iconName="md-person"
source={STEEM_CONNECT_LOGO}
text="steem"
secondText="connect"
/>
</View>
</ScrollableTabView>
<View tabLabel="SteemConnect" style={styles.steemConnectTab}>
<InformationArea
description="If you don't want to keep your password encrypted and saved on your device, you can use Steemconnect."
iconName="ios-information-circle-outline"
/>
<MainButton
wrapperStyle={styles.mainButtonWrapper}
onPress={() => this._loginwithSc2()}
iconName="md-person"
source={STEEM_CONNECT_LOGO}
text="steem"
secondText="connect"
/>
</View>
</ScrollableTabView>
</KeyboardAwareScrollView>
</View>
);
}

29
src/screens/profile/screen/profileScreen.js
View File

@ -1,8 +1,6 @@
/* eslint-disable no-unused-vars */
import React, { Component } from 'react';
import {
FlatList, ActivityIndicator, View, Text,
} from 'react-native';
import { FlatList, ActivityIndicator, View } from 'react-native';
import FastImage from 'react-native-fast-image';
// Components
@ -156,8 +154,17 @@ class ProfileScreen extends Component {
let coverImage;
let location;
let website;
const votingPower = user && user.voting_power && user.voting_power / 100;
const fullInHour = Math.ceil((100 - votingPower) * 0.833333);
let votingPower;
let resourceCredits;
let fullInHourVP;
let fullInHourRC;
if (user) {
votingPower = user.voting_power && user.voting_power / 100;
resourceCredits = user.resource_credits && user.resource_credits / 100;
fullInHourVP = Math.ceil((100 - votingPower) * 0.833333);
fullInHourRC = Math.ceil((100 - resourceCredits) * 0.833333);
}
if (about) {
_about = about.about;
@ -170,12 +177,14 @@ class ProfileScreen extends Component {
<CollapsibleCard
title={_about}
defaultTitle="Profile details"
expanded={true}
// locked={!isLoggedIn}
expanded={!isLoggedIn}
locked={!isLoggedIn}
>
<ProfileSummary
percent={votingPower}
hours={fullInHour}
percentVP={votingPower}
percentRC={resourceCredits}
hoursVP={fullInHourVP}
hoursRC={fullInHourRC}
location={location}
link={website}
date={getFormatedCreatedDate(user && user.created)}
@ -254,7 +263,7 @@ class ProfileScreen extends Component {
)}
</View>
<View tabLabel={user.balance ? `$${user.balance}` : 'Wallet'}>
<Wallet />
<Wallet user={user}/>
</View>
</ScrollableTabView>
</View>

28
src/screens/profile/screen/profileStyles.js
View File

@ -5,10 +5,10 @@ export default EStyleSheet.create({
container: {
flex: 1,
top: StatusBar.currentHeight,
backgroundColor: '#f6f6f6',
backgroundColor: '$primaryGray',
},
content: {
backgroundColor: '#f9f9f9',
backgroundColor: '$primaryGray',
},
cover: {
width: '$deviceWidth',
@ -20,11 +20,11 @@ export default EStyleSheet.create({
borderRadius: 50,
top: -50,
borderWidth: 1,
borderColor: 'white',
borderColor: '$white',
alignSelf: 'center',
},
about: {
borderColor: 'lightgray',
borderColor: '$primaryLightGray',
borderTopWidth: 1,
borderBottomWidth: 1,
flexDirection: 'row',
@ -39,8 +39,9 @@ export default EStyleSheet.create({
},
tabbar: {
alignSelf: 'center',
height: 40,
backgroundColor: '#fff',
height: 55,
backgroundColor: '$white',
borderBottomColor: '#f1f1f1',
},
tabbarItem: {
flex: 1,
@ -48,18 +49,15 @@ export default EStyleSheet.create({
backgroundColor: '#f9f9f9',
minWidth: '$deviceWidth',
},
tabbar: {
alignSelf: 'center',
height: 55,
backgroundColor: 'white',
borderBottomColor: '#f1f1f1',
},
tabView: {
alignSelf: 'center',
backgroundColor: 'transparent',
},
postTabBar: {},
commentsTabBar: {},
postTabBar: {
backgroundColor: '$white',
},
commentsTabBar: {
backgroundColor: '$white',
},
tabBarTitle: {},
});

4
src/screens/splash/container/splashContainer.js
View File

@ -8,14 +8,14 @@ import { default as ROUTES } from '../../../constants/routeNames';
import SplashScreen from '../screen/splashScreen';
class SplashContainer extends Component {
componentWillMount() {
async componentWillMount() {
const { navigation } = this.props;
// getUserData().then((res) => {
// if (res) {
// alert(...res);
// }
// });
getAuthStatus().then((res) => {
await getAuthStatus().then((res) => {
if (res) {
navigation.navigate(ROUTES.DRAWER.MAIN);
} else {