Components

ProfilePhotosScreen

<ProfilePhotosScreen />

Constructor

# <ProfilePhotosScreen />

You can use this component to display the Profile Photos Screen in your custom screen.

Properties:
Name Type Attributes Description
userId Number <optional>

You can use this to display a specific user's profile photos by assigning their userId as this props's value

screenTitle String <optional>

List screen title

searchTerm String <optional>

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

hidePhotoBackButton Boolean <optional>

Use true to hide the back button in the photos screen.

hideSelectButton Boolean <optional>

Use true to hide the select button in the photos screen.

hideNewPhotoButton Boolean <optional>

Use true to hide the new photo button in the photos screen.

hidePhotoNavigationHeader Boolean <optional>

Use true to hide the screen title container in the photos screen.

hideAlbumBackButton Boolean <optional>

Use true to hide the back button in the albums screen.

hideNewAlbumButton Boolean <optional>

Use true to hide the new photo button in the albums screen.

hideAlbumNavigationHeader Boolean <optional>

Use true to hide the screen title container in the albums screen.

LoadingComponent ReactComponent <optional>

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

Example

Display own profile photos

//In custom_code/components/MyCustomScreen.js...
import React from 'react';
import ProfilePhotosScreen from '@src/containers/Custom/Profile/ProfilePhotosScreen';
const MyCustomScreen = (props) => {

 if (!props.isFocused)
   return null;

 return <ProfilePhotosScreen

   hidePhotoBackButton={true}
   hideSelectButton={true}
   hideNewPhotoButton={true}
   // hidePhotoNavigationHeader={true}
   hideAlbumBackButton={true}
   hideNewAlbumButton={true}
   // hideAlbumNavigationHeader={true}

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