Components

TopicSingleScreen

<TopicSingleScreen />

Constructor

# <TopicSingleScreen />

You can use this component to display your Discussion/Topic single screen in your custom screen.

Properties:
Name Type Attributes Description
topicId Number <optional>

The id of the topic to display

searchTerm String <optional>

If the topic is not yet available in the app state, the component will attempt to a list of topics. You can use this field to search for the specific topic you want to load instead of loading a list of topics.

LoadingComponent ReactComponent <optional>

Use this to display your own loading component while the screen is loading

Example

Use TopicSingleScreen in custom navigation route "book"

//In custom_code/components/MyCustomScreen.js

import React from 'react';
import TopicSingleScreen from '@src/containers/Custom/TopicSingleScreen';

 const MyCustomScreen = (props) => {

   const topicId = 149; //Pass id of topic to load
   const searchTerm = "Performance" //Pass search term to get a direct result

   if (! props.isFocused)
       return null;

   return <TopicSingleScreen topicId={topicId} searchTerm={searchTerm}/>

}


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