Best JavaScript code snippet using tracetest
Navigation.js
Source:Navigation.js  
1import { Modal,View, Text, StyleSheet, ScrollView, Platform, Image, TouchableOpacity, SafeAreaView, KeyboardAvoidingView,Dimensions } from 'react-native'2import React, { Component,useState } from 'react';3import { createAppContainer, createSwitchNavigator } from 'react-navigation';4import { createStackNavigator, } from 'react-navigation-stack';5import { createDrawerNavigator } from 'react-navigation-drawer'6import { createBottomTabNavigator, createMaterialTopTabNavigator } from 'react-navigation-tabs';7import { CustomHeader, CustomHeader2 } from '../components/globalComponents/Header'8import Tutorial from '../screens/Tutorial/index'9import Login from "../screens/Login/index"10import Signup from "../screens/SignUp/index"11import TermandConditionScreen from '../screens/TermandCondition/index'12import Landing from '../screens/Landing/index'13import Forgotpassword from '../screens/ForgotPassword/index'14import OTP from '../screens/OTP/index'15import ResetPassword from '../screens/ResetPassword/index'16import HomeScreen from '../screens/Home/index'17import Category from '../screens/category/index'18import CategoryName from '../screens/category/CategoryName/index'19import Cart from '../screens/cart/index'20import Payment from '../screens/PaymentDescription/index'21import DeliveryAddress from '../screens/cart/Delivery Address/index'22import EditAddress from '../screens/address/index'23import AddNewAddress from '../screens/cart/addNewAddress/index'24import OrderReview from '../screens/OrderReview/index'25import SettingScreen from '../screens/settings/index'26import TabbarImage from '../assets/images/tabbar_image.png'27import { widthPercentageToDP as wp, heightPercentageToDP as hp } from 'react-native-responsive-screen';28import UserProfile from "../screens/userProfile/index"29import RecieptHistory from "../screens/settings/receiptHistory/index"30import Priavacypolicy from "../screens/privacypolicy/index"31import Termandcondition from "../screens/TermandCondition/index"32import Aboutus from "../screens/Aboutus/index"33import FAQ from "../screens/settings/staticContect/Faq"34import MyOrderHistory from '../screens/settings/OrderHistory/index'35import ProductEnquiry from '../screens/settings/productEnquiry/index'36import ProductName from "../screens/category/productname/index"37// import ProductEnquiry from "../screens/settings/productEnquiry/index"38//Components39import ChangePassword from "../screens/Changepassword/index"40import NavIcons, { IconComponent } from './NavigationIcons';41import OtpVerify from "../screens/otpverify/index"42import  Notification from "../screens/Notifiaction/index"43import editprofile from "../screens/userProfile/editprofile"44import AsyncStorage from "@react-native-community/async-storage"45// import { TouchableOpacity } from 'react-native-gesture-handler';46const { width, height } = Dimensions.get("window");47const Authstack = createStackNavigator({48   49    Login: {50        screen: Login,51        navigationOptions: {52            header: null53        }54    },55    Signup: {56        screen: Signup,57        navigationOptions: ({ navigation }, props) => ({58            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={NavIcons.backicon} Title="Sign Up"backicon={true}goback={()=>navigation.goBack()} />59        })60    },61    TermandConditionScreen: {62        screen: TermandConditionScreen,63        navigationOptions: ({ navigation }, props) => ({64            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={NavIcons.backicon} Title="Terms and Conditions"backicon={true}goback={()=>navigation.goBack()} />65        })66    },67    Forgotpassword: {68        screen: Forgotpassword,69        navigationOptions: ({ navigation }, props) => ({70            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={NavIcons.backicon} Title="Forgot Password"backicon={true}goback={()=>navigation.goBack()} />71        })72    },73    OTP: {74        screen: OTP,75        navigationOptions: ({ navigation }, props) => ({76            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={NavIcons.backicon} Title="OTP"backicon={true}goback={()=>navigation.goBack()} />77        })78    },79    ResetPassword: {80        screen: ResetPassword,81        navigationOptions: ({ navigation }, props) => ({82            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={NavIcons.backicon} Title="Reset Password"backicon={true}goback={()=>navigation.goBack()} />83        })84    },85    OtpVerify: {86        screen: OtpVerify,87        navigationOptions: ({ navigation }, props) => ({88            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={NavIcons.backicon} Title="OTP"backicon={true}goback={()=>navigation.goBack()} />89        })90    },91},92    {93        defaultNavigationOptions: ({ navigation }) => ({94            headerStyle: {95            },96        }),97    },98    )99const Homestack = createStackNavigator({100    Home: {101        screen: HomeScreen,102        navigationOptions: ({ navigation }, props) => ({103            header: null104            105        106        })107    },108    EditAddress: {109        screen: EditAddress,110        navigationOptions: ({ navigation }, props) => ({111            header: <CustomHeader Size={"medium"} navigation={navigation} {...props}  Title="Edit Address"backicon={true}goback={()=>navigation.goBack()} />112                113        })114    },115    116    AddressScreen: {117        screen: AddNewAddress,118        navigationOptions: ({ navigation }, props) => ({119            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={true}goback={()=>navigation.goBack()} Title="Edit Address" />120                121        })122    },123   124    Notification: {125        screen:  Notification,126        navigationOptions: ({ navigation }, props) => ({127            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={true}goback={()=>navigation.goBack()} Title="Notification" />128           129        })130    },131}, 132);133const CategoryStack = createStackNavigator({134    Category: {135        screen: Category,136        navigationOptions: ({ navigation }, props) => ({137           138            header: null139            140        })141    },142    CategoryName: {143        screen: CategoryName,144        navigationOptions: ({ navigation }, props) => ({145            gesturesEnabled: false,146            header: null147        })148    },149    Notification: {150        screen:  Notification,151        navigationOptions: ({ navigation }, props) => ({152            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={true}goback={()=>navigation.goBack()} Title="Notification" />153                        154        })155    },156    ProductName: {157        screen:  ProductName,158        navigationOptions: ({ navigation }, props) => ({159            header: null160         161        })162    },163},164);165const CartStack = createStackNavigator({166    Cart: {167        screen: Cart,168        navigationOptions: ({ navigation }, props) => ({169            header: <CustomHeader2170            171            menuonPress={() =>172                navigation.openDrawer()173            }174            bellicononpress={()=>navigation.navigate("Notification")}175            editonPress={() =>  navigation.navigate("EditAddress")}176            Size={"medium"} navigation={navigation} {...props}177             bellicon={NavIcons.bellicon} menuicon={NavIcons.menuicon} location={true} location={true} Title="My Cart" />,178        })179    },180    EditAddress: {181        screen: EditAddress,182        navigationOptions: ({ navigation }, props) => ({183            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={true}goback={()=>navigation.goBack()} Title="Edit Address" />184           185        })186    },187    AddressScreen: {188        screen: AddNewAddress,189        navigationOptions: ({ navigation }, props) => ({190            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={true}goback={()=>navigation.goBack()} Title="Add Address" />191          192        })193    },194    DeliveryAddress: {195        screen: DeliveryAddress,196        navigationOptions: ({ navigation }, props) => ({197            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={true}goback={()=>navigation.goBack()}backicon={NavIcons.backicon} Title="Choose Delivery Address" />198        })199    },200    Notification: {201        screen:  Notification,202        navigationOptions: ({ navigation }, props) => ({203            header: <CustomHeader Size={"medium"} navigation={navigation} {...props}backicon={true}goback={()=>navigation.goBack()} Title="Notification" />204                      205        })206    },207    OrderReview: {208        screen: OrderReview,209        navigationOptions: ({ navigation }, props) => ({210            header: <CustomHeader Size={"medium"}211                navigation={navigation}212                backicon={true}213                goback={() => navigation.goBack()}214                {...props}215                backicon={NavIcons.backicon}216                Title="OrderReview" />217        })218    },219    RecieptHistorycart: {220        screen: RecieptHistory,221      222        navigationOptions: ({ navigation }, props) => ({223            header: <CustomHeader2 Size={"medium"} navigation={navigation}224            menuonPress={() =>225                navigation.openDrawer()226            }227            bellicononpress={()=>navigation.navigate("Notification")}228            {...props} bellicon={NavIcons.bellicon} menuicon={NavIcons.menuicon} Title="My Reciept History" />229        })230    },231},232);233const SettingStack = createStackNavigator({234    SettingScreen: {235        screen: SettingScreen,236        navigationOptions: ({ navigation }, props) => ({237            header: <CustomHeader2 Size={"medium"} navigation={navigation}238            menuonPress={() =>239                navigation.openDrawer()240            }241            bellicononpress={()=>navigation.navigate("Notification")}242            {...props} bellicon={NavIcons.bellicon} menuicon={NavIcons.menuicon} Title="Settings" />243        })244    },245    Notification: {246        screen:  Notification,247        navigationOptions: ({ navigation }, props) => ({248            header: <CustomHeader Size={"medium"} navigation={navigation}backicon={true}goback={()=> navigation.goBack()} {...props} backicon={true} Title="Notification" />249        250        })251    },252    UserProfile: {253        screen: UserProfile,254        navigationOptions: ({ navigation }, props) => ({255            header:256                <CustomHeader Size={"medium"}257                    navigation={navigation} {...props}258                    editimage={NavIcons.editicon}259                    backicon={NavIcons.backicon}260                    EditOnpress={()=>navigation.navigate("editprofile")}261                    bellicon={NavIcons.bellicon}262                    Bellicon={true}263                    backicon={true}goback={()=>navigation.goBack()}264                    bellnotificationsOnpress={()=>navigation.navigate("Notification")}265                    Title="Profile" />266        })267    },268    editprofile:{269        screen: editprofile,270        navigationOptions: ({ navigation }, props) => ({271            header:272                <CustomHeader Size={"medium"}273                    navigation={navigation} {...props}274                    // editimage={NavIcons.editicon}275                    backicon={NavIcons.backicon}276                    backicon={true}goback={()=>navigation.goBack()}277                    EditOnpress={()=>props.navigations.navigate("editprofile")}278                    Title="Edit Profile" />279        })280    },281    RecieptHistory: {282        screen: RecieptHistory,283       284        navigationOptions: ({ navigation }, props) => ({285            header: <CustomHeader2 Size={"medium"} navigation={navigation}286            menuonPress={() =>287                navigation.openDrawer()288            }289            bellicononpress={()=>navigation.navigate("Notification")}290            {...props} bellicon={NavIcons.bellicon} menuicon={NavIcons.menuicon} Title="My Reciept History" />291        })292    },293    Payment: {294        screen: Payment,295        // navigationOptions: ({ navigation }, props) => ({296        //     header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={NavIcons.backicon} Title="My Reciept History" />297        // })298        navigationOptions: ({ navigation }, props) => ({299            header: 300            <CustomHeader2 Size={"medium"} navigation={navigation}301            menuonPress={() =>302                navigation.openDrawer()303            }304            bellicononpress={()=>navigation.navigate("Notification")}305            {...props} bellicon={NavIcons.bellicon} menuicon={NavIcons.menuicon} Title="Payment Details"/>306        })307    },308    Termandcondition: {309        screen: Termandcondition,310        navigationOptions: ({ navigation }, props) => ({311            header: <CustomHeader Size={"medium"} navigation={navigation} {...props}backicon={true}goback={()=>navigation.goBack()} backicon={NavIcons.backicon} Title="Terms and Conditions" />312        })313    },314    Priavacypolicy: {315        screen: Priavacypolicy,316        navigationOptions: ({ navigation }, props) => ({317            header: <CustomHeader Size={"medium"} navigation={navigation} {...props}backicon={true}goback={()=>navigation.goBack()} backicon={NavIcons.backicon} Title="Privacy Policy" />318        })319    },320    Aboutus: {321        screen: Aboutus,322        navigationOptions: ({ navigation }, props) => ({323            header: <CustomHeader Size={"medium"} navigation={navigation} {...props}backicon={true}goback={()=>navigation.goBack()} backicon={NavIcons.backicon} Title="About Us" />324        })325    },326    ChangePassword: {327        screen: ChangePassword,328        navigationOptions: ({ navigation }, props) => ({329            header: <CustomHeader Size={"medium"} navigation={navigation} {...props} backicon={true}goback={()=>navigation.goBack()}backicon={NavIcons.backicon} Title="Change Password" />330        })331    },332    FAQ: {333        screen: FAQ,334        navigationOptions: ({ navigation }, props) => ({335            header: <CustomHeader Size={"medium"} navigation={navigation} backicon={true}goback={()=>navigation.goBack()}{...props} backicon={NavIcons.backicon} Title="FAQ's" />336        })337    },338    MyOrderHistory: {339        screen: MyOrderHistory,340        navigationOptions: ({ navigation }, props) => ({341            header: <CustomHeader2 Size={"medium"} navigation={navigation}342            menuonPress={() =>343                navigation.openDrawer()344            }345            bellicononpress={()=>navigation.navigate("Notification")}346            {...props} bellicon={NavIcons.bellicon} menuicon={NavIcons.menuicon} Title="My Order History"/>347        })348        349    },350    ProductEnquiry: {351        screen: ProductEnquiry,352        navigationOptions: ({ navigation }, props) => ({353            header: <CustomHeader Size={"medium"} navigation={navigation}backicon={true}goback={()=>navigation.goBack()} {...props} backicon={NavIcons.backicon} Title="Product Enquiry"/>354        })355    },356},357);358SettingStack.navigationOptions = ({ navigation }) => {359    console.log("Routes==>", navigation.state.routes)360    let tabBarVisible = true;361    for (let i = 0; i < navigation.state.routes.length; i++) {362        if (navigation.state.routes[i].routeName == "Termandcondition" || navigation.state.routes[i].routeName == "Privacypolicy" || navigation.state.routes[i].routeName == "ChangePassword" || navigation.state.routes[i].routeName == "Aboutus" || navigation.state.routes[i].routeName == "FAQ") {363            tabBarVisible = false;364        }365    }366    return {367        tabBarVisible368    };369}370const bottomTabNavigator = createBottomTabNavigator({371    HomeSSack: {372        screen: Homestack,373        navigationOptions: ({ navigation }) => ({374            tabBarLabel: "Home",375            header: null,376            gesturesEnabled: false,377            // tabBarLabel: "Account",378            tabBarIcon: ({ focused, tintColor }) => (379                <IconComponent source={focused ? NavIcons.tab1Icon : NavIcons.tab1iconSel} />380            )381        })382    },383    CategoryScreen: {384        screen: CategoryStack,385        navigationOptions: ({ navigation }) => ({386            tabBarLabel: "Category",387            header: null,388            gesturesEnabled: false,389            tabBarIcon: ({ focused, tintColor }) => (390                <IconComponent source={focused ? NavIcons.tab2Icon : NavIcons.tab2iconSel} />391            )392        })393    },394    CartScreen: {395        screen: CartStack,396        navigationOptions: ({ navigation }) => ({397            tabBarLabel: "MyCart",398            header: null,399            gesturesEnabled: false,400            tabBarIcon: ({ focused, tintColor }) => (401                <IconComponent source={focused ? NavIcons.tab3Icon : NavIcons.tab3iconSel} />402            )403        })404    },405    SettingScreen: {406        screen: SettingStack,407        navigationOptions: ({ navigation }) => ({408            tabBarLabel: "Settings",409            header: null,410            gesturesEnabled: false,411            tabBarIcon: ({ focused, tintColor }) => (412                <IconComponent source={focused ? NavIcons.tab4Icon : NavIcons.tab4iconSel} />413            )414        })415    }416},417    {418        419        tabBarOptions: {420            activeTintColor: 'white',421            inactiveTintColor: 'rgb(187,231,255)',422            showIcon: true,423            showLabel: true,424            style: {425                backgroundColor: 'rgb(44,161,225)',426                borderTopLeftRadius: 30,427                borderTopRightRadius: 30,428            }429        },430    }431)432const NewStack = createStackNavigator({433    HomeStack: {434        screen: bottomTabNavigator,435        navigationOptions: {436            header: null437        }438    },439    Address: {440        screen: AddNewAddress,441      442    }443})444const DrawerStack = createDrawerNavigator({445    HomeScreen: {446        screen: NewStack,447        // navigationOptions: (props) => ({448        //     header: null449        // })450    },451    Address: {452        screen: AddNewAddress,453    }454},455    {456        drawerWidth: width-50,457        contentComponent:(props)=>{458                    const [isModalVisible,setModal]= useState(false) ;459            return(460                <ScrollView  showsVerticalScrollIndicator={false}>461                    <View style={{justifyContent:"center",alignItems:"center",height:height/3,backgroundColor:'#23a7fa',width:width-50}}>462                         <Image463                         source={NavIcons.Profile}464                         />465                            466                    </View>467                    <TouchableOpacity 468                    onPress={()=>{props.navigation.navigate("Home"),props.navigation.closeDrawer()}}469                    style={{flexDirection:"row",height:50,width:width-50,alignItems:"center"}}>470                    <Image471                    style={{marginLeft:20,}}472                         source={NavIcons.Home}473                         />474                                475                                <Text style={{fontSize:20,marginLeft:15,}}>Home</Text>476                            </TouchableOpacity>477                            <TouchableOpacity 478                               onPress={()=>{props.navigation.navigate("Category"),props.navigation.closeDrawer()}}479                            style={{alignItems:"center",flexDirection:"row",height:50,width:width-100}}>480                            <Image481                              style={{marginLeft:20,}}482                         source={NavIcons.shopbycategory}483                         />484                                <Text style={{fontSize:20,marginLeft:15,}}>Shop By category</Text>485                            </TouchableOpacity>486                            <TouchableOpacity 487                              onPress={()=>{props.navigation.navigate("Cart"),props.navigation.closeDrawer()}}488                            style={{alignItems:"center",flexDirection:"row",height:50,width:width-100}}>489                            <Image490                              style={{marginLeft:20,}}491                         source={NavIcons.mycart}492                         />493                                <Text style={{fontSize:20,marginLeft:15,}}>My cart</Text>494                                </TouchableOpacity>495                                <TouchableOpacity  onPress={()=>{props.navigation.navigate("DeliveryAddress"),props.navigation.closeDrawer()}}496                            style={{alignItems:"center",flexDirection:"row",height:50,width:width-100}}>497                           <Image498                             style={{marginLeft:20,}}499                         source={NavIcons.mycart}500                         />501                                <Text style={{fontSize:20,marginLeft:15,}}>Manage Address</Text>502                                </TouchableOpacity>503                                <TouchableOpacity 504                                  onPress={()=>{props.navigation.navigate("SettingScreen"),props.navigation.closeDrawer()}}505                                506                                style={{alignItems:"center",flexDirection:"row",height:50,width:width-100}}>507                                <Image508                                  style={{marginLeft:20,}}509                         source={NavIcons.setting}510                         />511                                <Text style={{fontSize:20,marginLeft:15,}}>Settings</Text>512                            </TouchableOpacity>513                            <TouchableOpacity514                               onPress={()=>{props.navigation.navigate("RecieptHistory"),props.navigation.closeDrawer()}}515                            516                            style={{alignItems:"center",flexDirection:"row",height:50,width:width-100}}>517                                <Image518                                  style={{marginLeft:20,}}519                         source={NavIcons.receipthistory}520                         />521                                <Text style={{fontSize:20,marginLeft:15,}}>My receipt history</Text>522                            </TouchableOpacity>523                            <TouchableOpacity 524                               onPress={()=>{props.navigation.navigate("Payment"),props.navigation.closeDrawer()}}525                            526                            style={{alignItems:"center",flexDirection:"row",height:50,width:width-100}}>527                                <Image528                                  style={{marginLeft:20,}}529                         source={NavIcons.paymentdescription}530                         />531                                <Text style={{fontSize:20,marginLeft:15,}}>Payment Description </Text>532                            </TouchableOpacity>533                            <TouchableOpacity 534                               onPress={()=>{props.navigation.navigate("MyOrderHistory"),props.navigation.closeDrawer()}}535                            style={{alignItems:"center",flexDirection:"row",height:50,width:width-100}}>536                                <Image537                                  style={{marginLeft:20,}}538                         source={NavIcons.orderhistory}539                         />540                                <Text style={{fontSize:20,marginLeft:15,}}>My Order History</Text>541                            </TouchableOpacity>542                            <TouchableOpacity543                               onPress={()=>{props.navigation.navigate("ProductEnquiry"),props.navigation.closeDrawer()}}544                            style={{alignItems:"center",flexDirection:"row",height:50,width:width-100}}>545                                <Image546                                  style={{marginLeft:20,}}547                         source={NavIcons.Productenquiry}548                         />549                                <Text style={{fontSize:20,marginLeft:15,}}>Product Enquiry</Text>550                            </TouchableOpacity>551                            <TouchableOpacity onPress={()=>{setModal(true)}}552                            //  onPress={()=>{props.navigation.navigate("SettingScreen"),props.navigation.closeDrawer()}}553                            554                            style={{alignItems:"center",flexDirection:"row",height:50,width:width-100}}>555                                <Image556                                   style={{marginLeft:20,}}557                         source={NavIcons.logout}558                         />559                                <Text style={{fontSize:20,marginLeft:15,}}>Logout</Text>560                            </TouchableOpacity>561                            <View style={{alignItems:"center",flex:1,  justifyContent:"center"}}>562        <Modal563          transparent={true}564          visible={isModalVisible}565        // onRequestClose={props.onRequestClose}566        // {...props}567        >568           <View style={{alignItems:"center", flex:1, backgroundColor: 'rgba(49,176,249,0.8)', justifyContent: 'center' }}>569          <View style={{570              borderRadius: 8,571              marginTop: hp("35%"),572              justifyContent: "center",573              alignItems: "center",574              alignSelf: 'center',575              width: wp("70%"),576              backgroundColor: "white",577              height: hp("25%"),578              marginBottom:hp("30%")579              // justifyContent:"center"580                }}>581                   582                <View style={{width:wp("60%"),alignItems:"center",justifyContent:"center"}} >583              <Text584              585                style={{586                  fontSize:20,587                  textAlign:"center",588                 marginBottom:hp("5%")589                }}590              >591             Are you sure you want to logout ?592             593           </Text>594           </View>595              <View596                style={{597                  alignItems:"center",598                  alignSelf:"center",599                  // backgroundColor:"yellow",600                  width:wp("60%"),601                  flexDirection:"row",602                  justifyContent:"space-between"603                }604                }>605                <TouchableOpacity606                 onPress={()=>{setModal(false)}}607                  style={{608                    borderWidth:1,609                    borderColor:'rgb(49,176,249)',610                    borderRadius:15,611                    justifyContent: "center",612                    alignItems: "center",613                    backgroundColor: "white",614                    width: wp("25%"),615                    height: hp("5%"),616                    shadowColor: 'rgb(49,176,249)',617                    shadowOffset: {618                        width: 0,619                        height: 3620                    },621                    shadowRadius: 5,622                    shadowOpacity: 0.6623                  }}624                >625           <Text style={{color:"rgb(49,176,249)",fontSize:18,fontWeight:"bold"}}>626            No627           </Text>628           </TouchableOpacity>629                <TouchableOpacity630               631                onPress={()=> {setModal(false), 632                    props.navigation.navigate("Login")}633                //   this.setState({modalVisible:!this.state.modalVisible},()=>{634                //       this.props.navigation.navigate("Login")635                //   })636                  637                }638                  style={{639                    borderWidth:1,640                    borderColor:'rgb(49,176,249)',641                    borderRadius:15,642                    justifyContent: "center",643                    alignItems: "center",644                    backgroundColor: "rgb(49,176,249)",645                    width: wp("25%"),646                    height: hp("5%"),647                    shadowColor: 'rgb(49,176,249)',648                    shadowOffset: {649                        width: 0,650                        height: 3651                    },652                    shadowRadius: 5,653                    shadowOpacity: 0.6654                  }}655           >656           <Text style={{657             color:"white",658             fontSize:18,fontWeight:"bold"659           }}>660           Yes661           </Text>662           </TouchableOpacity>663           </View>664          </View>665          </View>666        </Modal>667        </View>668                </ScrollView>669            )670        }671        // contentComponent: (props) => {672        //     const { navigation } = props673       674        //     return (675        //         <View style={{flex:1,justifyContent:'center',alignItems:'center'}} > 676        //     <TouchableOpacity onPress={() => {677        //                 navigation.closeDrawer(),678        //                     navigation.navigate('AddressStack')679        //             }}680        //                 style={{ width: width - 50, height: 50, borderBottomColor: 'white', flexDirection: 'row', borderBottomWidth: 0.7, alignItems: 'center' }}>681        //                 <Text style={{ fontSize: 18, fontWeight: '700', color: 'white' }} >Home</Text>682        //             </TouchableOpacity>683        //             </View>684        //     )685        // }686    }687    )688    const LandingStack = createStackNavigator({689        Tutorial: {690            screen: Tutorial,691            navigationOptions: {692    693                header: null694            }695        },696        Landing: {697            screen: Landing,698            navigationOptions: {699    700                header: null701            }702        },703    })704    705    class ValidLogin extends React.Component {706        constructor(props) {707          super(props);708        }709        componentDidMount() {710          this.check()711      712        }713        check() {714            AsyncStorage.getItem("Token").then(resp => {715console.log("Token",resp)716                if (resp != null) {717                    this.props.navigation.navigate('Drawer')718                }719                else {720                    this.props.navigation.navigate('Tutorial')721                }722            })723      724         725      726      727        }728        render() {729          return (730            <View>731            </View>732          );733        }734      }735 const Switchnavigator = createSwitchNavigator({736    // ValidLogin:ValidLogin,737    landing:{738        screen:LandingStack739    },740   741    Auth: {742        screen: Authstack743    },744    Drawer: {745        screen: DrawerStack,746        // navigationOptions:({navigation})=>({747        //   header:null748        // })749    },750    751   752    // Drawer: {753    //     screen: DrawerStack,754    //     navigationOptions:({navigation})=>({755    //       header:null756    //     })757    // },758 759}, {760    navigationOptions: {761        gesturesEnabled: false,762    }763})764const CommonNavigator = createAppContainer(Switchnavigator);...headerHoc.js
Source:headerHoc.js  
1import React from 'react';2import {connect} from 'react-redux';3import {CommonActions} from '@react-navigation/native';4import GradientHeader from '../../components/GradientHeader';5import * as actionTypes from '../../redux/actions/types';6import moment from 'moment';7// Start Period8const AddPeriodHeader = ({navigation}) => (9  <GradientHeader10    backIcon="left_arrow"11    title="Add Period"12    rightIcon="tick"13    onLeftIconClick={() => navigation.goBack()}14  />15);16export const AddPeriodHeaderHoc = connect()(AddPeriodHeader);17// End Period18const EndPeriodHeader = ({navigation}) => (19  <GradientHeader20    backIcon="left_arrow"21    title="Period Ends"22    rightIcon="tick"23    onLeftIconClick={() => navigation.goBack()}24  />25);26export const EndPeriodHeaderHoc = connect()(EndPeriodHeader);27// Signup28const SignupHeader = props => {29  let title = '';30  if (Object.keys(props.initiateUser).length > 0) {31    title = 'Sign In';32  } else {33    title = 'Restore Data';34  }35  let ongoBackClick = () => {36    try {37      if (Object.keys(props.initiateUser).length > 0) {38        props.navigation.dispatch(39          CommonActions.reset({40            index: 0,41            routes: [{name: 'MainScreen'}],42          }),43        );44      } else {45        props.navigation.goBack(null);46      }47    } catch (err) {48      console.log('err', err);49    }50  };51  return (52    <GradientHeader53      backIcon="left_arrow"54      title={title}55      onLeftIconClick={ongoBackClick}56    />57  );58};59export const SignupHeaderHoc = connect(state => ({60  initiateUser: state.dates.initiateUser,61}))(SignupHeader);62// Welcome63const WelcomeHeader = ({navigation}) => (64  <GradientHeader65    backIcon="left_arrow"66    title="Welcome"67    onLeftIconClick={() => navigation.goBack()}68  />69);70export const WelcomeHeaderHoc = connect()(WelcomeHeader);71// Email login72const EmailLoginHoc = ({navigation}) => (73  <GradientHeader74    backIcon="left_arrow"75    title="Email Login"76    onLeftIconClick={() => navigation.goBack()}77  />78);79export const EmailLoginHocHoc = connect()(EmailLoginHoc);80// Settings81const PeriodLengthHeader = ({navigation}) => (82  <GradientHeader83    backIcon="left_arrow"84    title="Period Length"85    onLeftIconClick={() => navigation.goBack()}86  />87);88export const PeriodLengthHeaderHoc = connect()(PeriodLengthHeader);89// Cycle length90const CycleLengthHeader = ({navigation}) => (91  <GradientHeader92    backIcon="left_arrow"93    title="Cycle Length"94    onLeftIconClick={() => navigation.goBack()}95  />96);97export const CycleLengthHeaderHoc = connect()(CycleLengthHeader);98// Cycle length99const OvulationHeader = ({navigation}) => (100  <GradientHeader101    backIcon="left_arrow"102    title="Ovulation & Fertile"103    onLeftIconClick={() => navigation.goBack()}104  />105);106export const OvulationHeaderHoc = connect()(OvulationHeader);107// insight Tab108const InsightTabHeader = ({navigation}) => (109  <GradientHeader110    backIcon="left_arrow"111    title="Insight"112    onLeftIconClick={() => navigation.goBack()}113  />114);115export const InsightTabHeaderHoc = connect()(InsightTabHeader);116//Temperature117const TemperatureHeader = ({navigation}) => (118  <GradientHeader119    backIcon="left_arrow"120    title="Basal Body Temperature"121    hasRightIcon={true}122    rightIcon="edit"123    onLeftIconClick={() => navigation.goBack()}124    onRightIconClick={() => navigation.navigate('TemperatureFilter')}125  />126);127export const TemperatureHeaderHoc = connect()(TemperatureHeader);128//Temperature Filter129const TemperatureFilterHeader = ({navigation}) => (130  <GradientHeader131    backIcon="left_arrow"132    title="Unit Settings"133    onLeftIconClick={() => navigation.goBack()}134  />135);136export const TemperatureFilterHeaderHoc = connect()(TemperatureFilterHeader);137//Weight138const WeightHeader = ({navigation}) => (139  <GradientHeader140    backIcon="left_arrow"141    title="Weight"142    onLeftIconClick={() => navigation.goBack()}143    hasRightIcon={true}144    onRightIconClick={() => navigation.navigate('WeightFilter')}145    rightIcon="edit"146  />147);148export const WeightHeaderHoc = connect()(WeightHeader);149//Weight Filter150const WeightFilterHeader = ({navigation}) => (151  <GradientHeader152    backIcon="left_arrow"153    title="Unit Settings"154    onLeftIconClick={() => navigation.goBack()}155  />156);157export const WeightFilterHeaderHoc = connect()(WeightFilterHeader);158//Smell159const SmellHeader = props => {160  return (161    <GradientHeader162      backIcon="left_arrow"163      title="Smell"164      onLeftIconClick={() => props.navigation.goBack()}165      showUnitText={true}166      unitText={moment(props.noteDate, 'YYYY-MM-DD').format('D MMM')}167    />168  );169};170export const SmellHeaderHoc = connect(state => ({171  noteDate: state.dates.noteDate,172}))(SmellHeader);173//Bleeding Type174const BleedingTypeHeader = props => {175  return (176    <GradientHeader177      backIcon="left_arrow"178      title="Bleeding Type"179      onLeftIconClick={() => props.navigation.goBack()}180      showUnitText={true}181      unitText={moment(props.noteDate, 'YYYY-MM-DD').format('D MMM')}182    />183  );184};185export const BleedingTypeHeaderHoc = connect(state => ({186  noteDate: state.dates.noteDate,187}))(BleedingTypeHeader);188//Add notes189const AddNotesHeader = ({navigation}) => (190  <GradientHeader191    backIcon="left_arrow"192    title="Add Notes"193    onLeftIconClick={() => navigation.goBack()}194  />195);196export const AddNotesHeaderHoc = connect()(AddNotesHeader);197//write notes198const WriteNotesHeader = ({navigation}) => (199  <GradientHeader200    backIcon="left_arrow"201    title="Add Notes"202    onLeftIconClick={() => navigation.goBack()}203  />204);205export const WriteNotesHeaderHoc = connect()(WriteNotesHeader);206//location207const LocationHeader = ({navigation}) => (208  <GradientHeader209    backIcon="left_arrow"210    title="Location"211    onLeftIconClick={() => navigation.goBack()}212  />213);214export const LocationHeaderHoc = connect()(LocationHeader);215//temperature216const TemperatureChartHeader = ({navigation}) => (217  <GradientHeader218    backIcon="left_arrow"219    title="Temperature"220    onLeftIconClick={() => navigation.goBack()}221  />222);223export const TemperatureChartHeaderHoc = connect()(TemperatureChartHeader);224//weight225const WeightChartHeader = ({navigation}) => (226  <GradientHeader227    backIcon="left_arrow"228    title="Weight"229    onLeftIconClick={() => navigation.goBack()}230  />231);232export const WeightChartHeaderHoc = connect()(WeightChartHeader);233//reminder234const SendReminderHeader = ({navigation}) => (235  <GradientHeader236    backIcon="left_arrow"237    title="Send Reminder"238    onLeftIconClick={() => navigation.goBack()}239  />240);241export const SendReminderHeaderHoc = connect()(SendReminderHeader);242//BP243const BpScreenHeader = ({navigation}) => (244  <GradientHeader245    backIcon="left_arrow"246    title="Blood Pressure"247    showUnitText={true}248    unitText="mmHg"249    onLeftIconClick={() => navigation.goBack()}250  />251);252export const BpScreenHeaderHoc = connect()(BpScreenHeader);253//Sugar254const SugarHeader = ({navigation}) => (255  <GradientHeader256    backIcon="left_arrow"257    title="Sugar"258    onLeftIconClick={() => navigation.goBack()}259  />260);261export const SugarHeaderHoc = connect()(SugarHeader);262//Bp Chart263const BpChartHeader = ({navigation}) => (264  <GradientHeader265    backIcon="left_arrow"266    title="Bp Chart"267    onLeftIconClick={() => navigation.goBack()}268  />269);270export const BpChartHeaderHoc = connect()(BpChartHeader);271//Sugar Chart272const SugarChartHeader = ({navigation}) => (273  <GradientHeader274    backIcon="left_arrow"275    title="Sugar Chart"276    onLeftIconClick={() => navigation.goBack()}277  />278);279export const SugarChartHeaderHoc = connect()(SugarChartHeader);280//Sugar Chart281const EditProfileHeader = ({navigation}) => (282  <GradientHeader283    backIcon="left_arrow"284    title="Edit Profile"285    onLeftIconClick={() => navigation.goBack()}286  />287);288export const EditProfileHeaderHoc = connect()(EditProfileHeader);289//Bleed color290const BleedColorHeader = props => {291  return (292    <GradientHeader293      backIcon="left_arrow"294      title="Bleed Color"295      onLeftIconClick={() => props.navigation.goBack()}296      showUnitText={true}297      unitText={moment(props.noteDate, 'YYYY-MM-DD').format('D MMM')}298    />299  );300};301export const BleedColorHeaderHoc = connect(state => ({302  noteDate: state.dates.noteDate,303}))(BleedColorHeader);304//TimeModalality color305const TimeModalalityHeader = props => {306  return (307    <GradientHeader308      backIcon="left_arrow"309      title="Time Modalality"310      onLeftIconClick={() => props.navigation.goBack()}311      showUnitText={true}312      unitText={moment(props.noteDate, 'YYYY-MM-DD').format('D MMM')}313    />314  );315};316export const TimeModalalityHeaderHoc = connect(state => ({317  noteDate: state.dates.noteDate,318}))(TimeModalalityHeader);319//Medical history320const MedicalHistoryHeader = ({navigation, dispatch}) => (321  <GradientHeader322    backIcon="left_arrow"323    title="Medical History"324    rightIcon="circle_i"325    onRightIconClick={() => {326      dispatch({327        type: actionTypes.SHOW_HEADER_INFO_MODAL,328      });329    }}330    onLeftIconClick={() => navigation.goBack()}331  />332);333export const MedicalHistoryHeaderHoc = connect()(MedicalHistoryHeader);334//Obstetrics history335const ObstetricsHistoryHeader = ({navigation, dispatch}) => (336  <GradientHeader337    backIcon="left_arrow"338    title="Pregnancy History"339    rightIcon="circle_i"340    onRightIconClick={() => {341      dispatch({342        type: actionTypes.SHOW_HEADER_INFO_MODAL,343      });344    }}345    onLeftIconClick={() => navigation.goBack()}346  />347);348export const ObstetricsHistoryHeaderHoc = connect()(ObstetricsHistoryHeader);349//Birth control350const BirthControlHeader = ({navigation, dispatch}) => {351  return (352    <GradientHeader353      backIcon="left_arrow"354      title="Birth control methods used"355      rightIcon="circle_i"356      onRightIconClick={() => {357        dispatch({358          type: actionTypes.SHOW_HEADER_INFO_MODAL,359        });360      }}361      onLeftIconClick={() => navigation.goBack()}362    />363  );364};365export const BirthControlHeaderHoc = connect()(BirthControlHeader);366//Height367const HeightHeader = ({navigation}) => (368  <GradientHeader369    backIcon="left_arrow"370    title="Height"371    onLeftIconClick={() => navigation.goBack()}372    hasRightIcon={true}373    onRightIconClick={() => navigation.navigate('WeightFilter')}374    rightIcon="edit"375  />376);377export const HeightHeaderHoc = connect()(HeightHeader);378//Report health profile379const ReportHealthProfileHeader = ({navigation}) => (380  <GradientHeader381    backIcon="left_arrow"382    title="Health Profile"383    onLeftIconClick={() => navigation.goBack()}384  />385);386export const ReportHealthProfileHeaderHoc = connect()(387  ReportHealthProfileHeader,388);389//Report predictions390const ReportPredictionsHistory = ({navigation}) => (391  <GradientHeader392    backIcon="left_arrow"393    title="Predictions & History"394    onLeftIconClick={() => navigation.goBack()}395  />396);397export const ReportPredictionsHistoryHoc = connect()(ReportPredictionsHistory);398//Report ReportCycleAnalysis399const ReportCycleAnalysis = ({navigation}) => (400      401  <GradientHeader402    backIcon="left_arrow"403    title="Cycle Analysis"404    onLeftIconClick={() => navigation.goBack()}405  />406);407export const ReportCycleAnalysisHoc = connect()(ReportCycleAnalysis);408//Report weight bmi409const ReportWeightBmiHeader = ({navigation}) => (410  <GradientHeader411    backIcon="left_arrow"412    title="Weight & BMI"413    onLeftIconClick={() => navigation.goBack()}414  />415);416export const ReportWeightBmiHeaderHoc = connect()(ReportWeightBmiHeader);417//Report blood pressure418const ReportBloodPressureHeader = ({navigation}) => (419  <GradientHeader420    backIcon="left_arrow"421    title="Blood Pressure"422    onLeftIconClick={() => navigation.goBack()}423  />424);425export const ReportBloodPressureHeaderHoc = connect()(426  ReportBloodPressureHeader,427);428//Report blood pressure429const ReportSugarHeader = ({navigation}) => (430  <GradientHeader431    backIcon="left_arrow"432    title="Sugar Report"433    onLeftIconClick={() => navigation.goBack()}434  />435);436export const ReportSugarHeaderHoc = connect()(ReportSugarHeader);437//Report blood pressure438const ReportTemperatureHeader = ({navigation}) => (439  <GradientHeader440    backIcon="left_arrow"441    title="Temperature Report"442    onLeftIconClick={() => navigation.goBack()}443  />444);445export const ReportTemperatureHeaderHoc = connect()(ReportTemperatureHeader);446//Notification447const NotificationHeader = ({navigation}) => (448    <GradientHeader449      backIcon="left_arrow"450      title="Reminders"451      onLeftIconClick={() => navigation.goBack()}452    />453  );454  export const NotificationHeaderHoc = connect()(NotificationHeader);455  //Notification details456const NotificationDetailsHeader = ({navigation}) => (457    <GradientHeader458      backIcon="left_arrow"459      title="Manage Notification"460      onLeftIconClick={() => navigation.goBack()}461    />462  );...assignIcon.js
Source:assignIcon.js  
1import {2  faCar,3  faChild,4  faCouch,5  faEarthAmericas,6  faFaceSmile,7  faFish,8  faFootball,9  faGlasses,10  faGuitar,11  faHand,12  faHeart,13  faHouse,14  faKey,15  faLaptopCode,16  faLock,17  faMobileScreenButton,18  faMusic,19  faShirt,20} from '@fortawesome/free-solid-svg-icons';21export const assignIcon = (internNumber) => {22  let backIcon;23  switch (internNumber) {24    case 1:25      backIcon = faCar;26      break;27    case 2:28      backIcon = faChild;29      break;30    case 3:31      backIcon = faCouch;32      break;33    case 4:34      backIcon = faEarthAmericas;35      break;36    case 5:37      backIcon = faFaceSmile;38      break;39    case 6:40      backIcon = faFish;41      break;42    case 7:43      backIcon = faFootball;44      break;45    case 8:46      backIcon = faGlasses;47      break;48    case 9:49      backIcon = faGuitar;50      break;51    case 10:52      backIcon = faHand;53      break;54    case 11:55      backIcon = faHeart;56      break;57    case 12:58      backIcon = faHouse;59      break;60    case 13:61      backIcon = faKey;62      break;63    case 14:64      backIcon = faLaptopCode;65      break;66    case 15:67      backIcon = faLock;68      break;69    case 16:70      backIcon = faMobileScreenButton;71      break;72    case 17:73      backIcon = faMusic;74      break;75    case 18:76      backIcon = faShirt;77      break;78    default:79      backIcon = faCar;80  }81  return backIcon;...Using AI Code Generation
1tracetest.BackIcon();2tracetest.ForwardIcon();3tracetest.RefreshIcon();4tracetest.HelpIcon();5tracetest.PrintIcon();6tracetest.Open();7tracetest.Close();8tracetest.Save();9tracetest.SaveAs();10tracetest.Print();11tracetest.Open();12tracetest.Close();13tracetest.Save();14tracetest.SaveAs();15tracetest.Print();16tracetest.Open();17tracetest.Close();18tracetest.Save();19tracetest.SaveAs();20tracetest.Print();21tracetest.Open();22tracetest.Close();23tracetest.Save();24tracetest.SaveAs();25tracetest.Print();26tracetest.Open();27tracetest.Close();Using AI Code Generation
1var tracetest = require('tracetest');2tracetest.BackIcon();3exports.BackIcon = function() {4    console.log("BackIcon method is invoked");5};6for (var key in require.cache) {7    delete require.cache[key];8}9delete require.cache[require.resolve(moduleName)];10var moduleName = "tracetest";11var modulePath = require.resolve(moduleName);12require.cache[modulePath] = null;13var moduleName = "tracetest";14var modulePath = require.resolve(moduleName);15delete require.cache[modulePath];16var moduleName = "tracetest";17var modulePath = require.resolve(moduleName);18require.cache[modulePath] = undefined;Using AI Code Generation
1var tracetest = require('tracetest');2var backIcon = tracetest.createBackIcon();3backIcon.show();4module.exports = {5    createBackIcon: function() {6        return {7            show: function() {8                console.log("BackIcon is shown");9            }10        };11    }12};13var fs = require("fs");14console.log("Going to open an existing file");15fs.open('input.txt', 'r+', function(err, fd) {16    if (err) {17        return console.error(err);18    }19    console.log("File opened successfully!");20});21Here, the fs module is used to open an existing file. The fs.open() method takes the following arguments −22The fs module is used to open an existing file. The fs.open() method takes the following arguments −Using AI Code Generation
1var tracetest = require('./tracetest.js');2tracetest.BackIcon();3var BackIcon = function(){4    console.log("BackIcon");5}6exports.BackIcon = BackIcon;Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.
You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.
Get 100 minutes of automation test minutes FREE!!
