ProfileEmailInvitesScreen

# <ProfileEmailInvitesScreen />

Properties:

Example

//In custom_code/components/MyCustomScreen.js...
import React, {useContext, useEffect} from "react";
import {Text, StyleSheet, Platform} from "react-native";
import {NavigationContext} from "@react-navigation/native";

import {backButtonProfile} from "@src/utils";
import {useScreenProps} from "@src/navigators/v5/ScreenPropsProvider";
import EmailInviteTabsScreen from "@src/containers/Custom/Profile/EmailInviteTabsScreen";

const MyCustomScreen = props => {
    if (!props.isFocused) return null;

    const {global, colors, t} = useScreenProps([
        "global",
        "colors",
        "t",
        "calcFontSize"
    ]);

    const {params = {}} = props.route;
    const {borderColor} = colors;

    const options = () => {
        const headerLeft = () => backButtonProfile({
            navigation,
            global,
            name: "John"
        });

        const headerRight = null;
        if (Platform.OS === "android") {
            headerRight = () => <View style={global.headerFakeRight} />;
        }

        return {
            headerShown: true,
            headerTitleAlign: "center",
            headerTitle: () => (
                <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={global.appHeaderTitle}
                >
                    {t("profile:emailInvites")}
                </Text>
            ),
            headerLeft,
            headerRight,
            headerStyle: {
                ...StyleSheet.flatten(global.header),
                borderBottomColor: borderColor,
                borderBottomWidth: StyleSheet.hairlineWidth
            }
        };
    };

    const navigation = useContext(NavigationContext);

    useEffect(
        () => {
            navigation?.setOptions(options());
        },
        [params]
    );

    return (
        <>
            <EmailInviteTabsScreen
                //In the given example, a "book" route is registered using the addNavigationRoute() hook.
                //Therefore, you can use it to redirect back to the custom screen by choosing it as the redirectScreen's value
                redirectScreen="book"
                {...props}
            />
        </>
    );
};

export default MyCustomScreen;


//In custom_code/index.js...

...

import MyCustomScreen from "./components/MyCustomScreen";
export const applyCustomCode = externalCodeSetup => {

 externalCodeSetup.navigationApi.addNavigationRoute(
   "book",
   "BookScreen",
   MyCustomScreen,
   "All"
 );
 externalCodeSetup.navigationApi.addNavigationRoute(
   "book",
   "BookScreen",
   MyCustomScreen,
   "Main"
 );
}