Facebook Page WebView Content

App/Containers/FacebookPage.js

@@ -0,0 +1,77 @@
+import React, { Component } from 'react';
+import { StatusBar, TouchableOpacity, Text, WebView} from 'react-native'
+import { Container, Header, Content, Icon,View } from 'native-base'
+import { Images } from '../Themes'
+import { connect } from 'react-redux'
+import LoadingOverlay from '../Components/LoadingOverlay';
+// Add Actions - replace 'Your' with whatever your reducer is called :)
+// import YourActions from '../Redux/YourRedux'
+
+// Styles
+import Styles from './Styles/FacebookPageStyle'
+
+class FacebookPage extends Component {
+    constructor(props){
+        super(props);
+        this.state = { visible: true };
+    }
+
+    hideSpinner(){
+        this.setState({ visible: false });
+    }
+
+    render() {
+        const { fetching, navigation } = this.props;
+        return (
+          <Container>
+            <Header style={Styles.navigation}>
+              <StatusBar backgroundColor="#242A38" animated barStyle="light-content" />
+              <View style={Styles.nav}>
+                <View style={Styles.navLeft}>
+                  <TouchableOpacity style={Styles.navLeft} onPress={() => {
+                    navigation.navigate("Home")
+                  }}>
+                    <Icon name='arrow-back' type="MaterialIcons" style={Styles.navIcon} />
+                  </TouchableOpacity>
+                </View>
+                <View style={Styles.navMiddle}>
+                  <Text style={[Styles.textHeader]}>Facebook Page</Text>
+                </View>
+                <View style={Styles.navRight} />
+              </View>
+            </Header>
+
+            <Content contentContainerStyle={Styles.layoutDefault}>
+            <WebView
+                source={{uri: 'https://www.facebook.com/Sunilnaik581354/'}}
+                style={{width: '100%', height: '100%'}}
+                onLoad={() => this.hideSpinner()}
+                />
+           </Content>
+
+            <LoadingOverlay
+                visible={this.state.visible}
+                color="white"
+                indicatorSize="large"
+                messageFontSize={24}
+                message="Loading..."/>
+          </Container>
+        )
+      }
+
+}
+
+const mapStateToProps = (state) => {
+    return {
+      //userObj: state.root.userDetails,
+      fetching: state.root.fetching,
+    }
+  }
+
+  const mapDispatchToProps = (dispatch) => {
+    return {
+    }
+  }
+
+export default connect(mapStateToProps, mapDispatchToProps)(FacebookPage);
+

App/Containers/SideMenu.js

@@ -41,6 +41,12 @@ export const Menulist = [
     icon: 'dashboard',
     type: 'Octicons',
     route: 'BeneficiaryListingScreen'
+  },
+    {
+    name: 'Facebook Page',
+    icon: 'facebook-square',
+    type: 'FontAwesome',
+    route: 'FacebookPage'
   },
   {
     name: 'Profile',

App/Containers/Styles/FacebookPageStyle.js

@@ -0,0 +1,7 @@
+import { StyleSheet, Platform } from 'react-native'
+import { Colors, Metrics, ApplicationStyles } from '../../Themes/'
+
+export default StyleSheet.create({
+...ApplicationStyles.screen,
+
+})

App/Navigation/AppNavigation.js

@@ -28,6 +28,7 @@ import FeedbackList from '../Containers/FeedbackList';
 import FeedbackDetailScreen from '../Containers/FeedbackDetail';
 
 import UserSettings from '../Containers/UserSettings';
+import FacebookPage from '../Containers/FacebookPage';
 
 // These Are the post authencation Screens
 import DevelopmentWorksList from '../Containers/DevelopmentWorksList'
@@ -69,6 +70,9 @@ const MyDrawerNavigator = createDrawerNavigator({
   UserSettings: {
     screen: UserSettings,
   },
+  FacebookPage:{
+    screen: FacebookPage,
+  },
   Notifications: {
     screen: LaunchScreen,
   },