App Codex Version: 1.0.0

Components

ForumsScreen

<ForumsScreen />

Constructor

# <ForumsScreen />

You can use this component to display your Forums screen in your custom screen.

Properties:
Name Type Attributes Description
headerHeight Number <optional>

Define header height
hideFilters Boolean <optional>

Use true to hide filters in the screen
hideNavigationHeader Boolean <optional>

Use true to hide the screen title container when scrolling
hideTitle Boolean <optional>

Use true to hide title of the screen
screenTitle String <optional>

List screen title. Default comes from translation files in BuddyBoss site
searchFocusedAnimationDuration Number <optional>

Adjust the duration of the Search animation. A higher value means a longer duration of the animation.
searchFocusedListTopSpace Number <optional>

Amount of space which the header moves up when Search input is focused. A greater value means that the header will move higher.
showSearch Boolean <optional>

Use false to hide search box
Example
//In custom_code/components/MyCustomScreen.js...

import React, {useState, useEffect} from "react";
import {View, Button} from "react-native";
import {useSelector} from "react-redux";
import {useScreenProps} from "@src/navigators/v5/ScreenPropsProvider";
import {CommonActions} from "@react-navigation/native";
import ForumsScreen from "@src/containers/Custom/ForumsScreen";

const MyCustomScreen = props => {
    const {colors} = useScreenProps(["colors"]);
    const state = useSelector(state => state);
    const [buttonDisabled, setButtonDisabled] = useState(true);
    const featuredForumId = 93;

    //Wait 3 seconds to enable button
    useEffect(() => {
        setTimeout(() => {
            setButtonDisabled(false);
        }, 3000);
    }, []);

    const goToFeaturedForum = forumId => {
        const forum = state.forumsCache.byId.get(forumId ? forumId.toString() : "");

        //Navigate to featured forum
        props.navigation.dispatch(
            CommonActions.navigate({
                name: "ForumsSingleScreen",
                params: {
                    forum
                }
            })
        );
    };

    return (
        <View style={{flex: 1}}>
            <View style={{flex: 0.8}}>
                <ForumsScreen {...props} showSearch={false} screenTitle="My Forums" />
            </View>

            <View
                style={{
                    flex: 0.2,
                    backgroundColor: colors.bodyFrontBg
                }}
            >
                <Button
                    title="Go to featured forum"
                    onPress={() => goToFeaturedForum(featuredForumId)}
                    disabled={buttonDisabled}
                />
            </View>
        </View>
    );
};

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"
 );
}