created error boundary && toastNotifcaiton

This commit is contained in:
u-e 2019-02-01 18:49:51 +03:00
parent 1deff92922
commit d0f50d6258
8 changed files with 135 additions and 2 deletions

View File

@ -0,0 +1,3 @@
import ErrorBoundary from './view/errorBoundaryView';
export { ErrorBoundary };

View File

@ -0,0 +1,25 @@
import React, { Component } from 'react';
export default class ErrorBoundary extends Component {
constructor(props) {
super(props);
this.state = { hasError: false };
}
componentDidCatch(error, info) {
if (__DEV__) {
return;
}
this.setState({ hasError: true });
}
render() {
const { hasError } = this.state;
const { children } = this.props;
if (hasError) {
return <h1>Something went wrong.</h1>;
}
return children;
}
}

View File

@ -0,0 +1,3 @@
import ToastNotificaiton from './view/toastNotificaitonView';
export { ToastNotificaiton };

View File

@ -0,0 +1,68 @@
import React, { Component } from 'react';
import { Animated, Text } from 'react-native';
// Constants
// Components
// Styles
import styles from './toastNotificationStyles';
class ToastNotification extends Component {
/* Props
* ------------------------------------------------
* @prop { type } name - Description....
*/
constructor(props) {
super(props);
this.state = {
animatedValue: new Animated.Value(0),
};
}
// Component Life Cycles
// Component Functions
componentWillMount() {
this._showToast();
}
_showToast() {
const animatedValue = new Animated.Value(0);
this.setState({ animatedValue });
Animated.timing(animatedValue, { toValue: 1, duration: 350 }).start();
}
_hideToast() {
const { animatedValue } = this.state;
Animated.timing(animatedValue, { toValue: 0.0, duration: 350 }).start();
}
render() {
const { text } = this.props;
const { animatedValue } = this.state;
const y = animatedValue.interpolate({
inputRange: [0, 1],
outputRange: [50, 0],
});
return (
<Animated.View
style={{
...styles.container,
opacity: animatedValue,
transform: [{ translateY: y }],
}}
>
<Text style={styles.text}>{text}</Text>
</Animated.View>
);
}
}
export default ToastNotification;

View File

@ -0,0 +1,29 @@
import EStyleSheet from 'react-native-extended-stylesheet';
export default EStyleSheet.create({
container: {
position: 'absolute',
bottom: 100,
zIndex: 9999,
justifyContent: 'center',
alignItems: 'center',
alignSelf: 'center',
maxWidth: '$deviceWidth',
minWidth: '$deviceWidth / 1.9',
height: 44,
borderRadius: 30,
backgroundColor: '$primaryDarkText',
margin: 5,
shadowOffset: {
height: 5,
},
shadowColor: '#5f5f5fbf',
shadowOpacity: 0.3,
elevation: 3,
},
text: {
color: 'white',
fontWeight: 'bold',
fontSize: 14,
},
});

View File

@ -8,6 +8,8 @@ import messages from '../../../config/locales';
// Components // Components
import { NoInternetConnection } from '../../../components/basicUIElements'; import { NoInternetConnection } from '../../../components/basicUIElements';
import { ErrorBoundary } from '../../../components/errorBoundary';
import { ToastNotificaiton } from '../../../components/toastNotification';
// Themes (Styles) // Themes (Styles)
import darkTheme from '../../../themes/darkTheme'; import darkTheme from '../../../themes/darkTheme';
@ -44,7 +46,10 @@ class ApplicationScreen extends Component {
)} )}
<IntlProvider locale={locale} messages={flattenMessages(messages[locale])}> <IntlProvider locale={locale} messages={flattenMessages(messages[locale])}>
<ReduxNavigation /> <ErrorBoundary>
<ReduxNavigation />
<ToastNotificaiton text="ugur erdal" />
</ErrorBoundary>
</IntlProvider> </IntlProvider>
</Fragment> </Fragment>
); );

View File

@ -15,6 +15,7 @@ import { getPost, getUser } from '../../../providers/steem/dsteem';
import { Modal } from '../../../components'; import { Modal } from '../../../components';
import { PinCode } from '../../pinCode'; import { PinCode } from '../../pinCode';
import PostButtonForAndroid from '../../../components/postButton/view/postButtonsForAndroid'; import PostButtonForAndroid from '../../../components/postButton/view/postButtonsForAndroid';
import { ToastNotificaiton } from '../../../components/toastNotification';
// Constants // Constants
import ROUTES from '../../../constants/routeNames'; import ROUTES from '../../../constants/routeNames';

View File

@ -87,7 +87,6 @@ class SettingsContainer extends Component {
const { serverList } = this.state; const { serverList } = this.state;
const server = serverList[action]; const server = serverList[action];
let serverResp; let serverResp;
const client = new Client(server, { timeout: 3000 }); const client = new Client(server, { timeout: 3000 });
try { try {