mirror of
https://github.com/ecency/ecency-mobile.git
synced 2024-12-18 19:01:38 +03:00
created error boundary && toastNotifcaiton
This commit is contained in:
parent
1deff92922
commit
d0f50d6258
3
src/components/errorBoundary/index.js
Normal file
3
src/components/errorBoundary/index.js
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
import ErrorBoundary from './view/errorBoundaryView';
|
||||||
|
|
||||||
|
export { ErrorBoundary };
|
25
src/components/errorBoundary/view/errorBoundaryView.js
Normal file
25
src/components/errorBoundary/view/errorBoundaryView.js
Normal 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;
|
||||||
|
}
|
||||||
|
}
|
3
src/components/toastNotification/index.js
Normal file
3
src/components/toastNotification/index.js
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
import ToastNotificaiton from './view/toastNotificaitonView';
|
||||||
|
|
||||||
|
export { ToastNotificaiton };
|
@ -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;
|
@ -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,
|
||||||
|
},
|
||||||
|
});
|
@ -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>
|
||||||
);
|
);
|
||||||
|
@ -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';
|
||||||
|
@ -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 {
|
||||||
|
Loading…
Reference in New Issue
Block a user