React Native - Header Right Icon wont display

Question

Hi I am having problem with placing Right header Icon, please advise how to solve it. I got error " variable - navigation" not found. On other screens i have put "static navigationOptions = ({ navigation }) => { and it is working.

from 'react-native'
import { UIActivityIndicator } from 'react-native-indicators'
import { CardStyleInterpolators } from 'react-navigation-stack'
import { withNavigation } from 'react-navigation'
import { ActionSheet, Picker, Icon } from 'native-base'
import { connect } from 'react-redux'
import WooComFetch, { getUrl } from '../common/WooComFetch'
import FlatListViewShop from '../common/FlatListViewShop'
import SyncStorage from 'sync-storage'
import themeStyle from '../common/Theme.style'
import ShoppingCartIcon from '../common/ShoppingCartIcon'
import Spinner from 'react-native-loading-spinner-overlay'
import { createSelector } from 'reselect'
const CANCEL_INDEX = 9
const WIDTH = Dimensions.get('window').width
class Newest extends PureComponent {
  **static navigationOptions = props => {**
    const headerStyle = props.navigation.getParam('headerTitle')
    return {
      headerTitle: headerStyle,
      cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
      headerStyle: {
        backgroundColor: themeStyle.primary
      },
      headerTitleAlign: 'center',
      headerForceInset: { top: 'never', vertical: 'never' },
      headerTintColor: themeStyle.headerTintColor,
      gesturesEnabled: false,
      headerTitleStyle: {
        fontWeight: Platform.OS === 'android' ? 'bold' : 'normal'
      },
      gesturesDirection: 'inverted',
      headerRight: () => <ShoppingCartIcon navigation={navigation} />,
      headerLeft: (
        <Icon
          onPress={() => props.navigation.pop()}
          name={!I18nManager.isRTL ? 'arrow-back' : 'arrow-forward'}
          style={{
            color: themeStyle.primaryContrast,
            fontSize: 25,
            padding: 5,
            paddingLeft: 16,
            paddingRight: 16,
            marginRight: 16
          }}
        />
      )
    }
  }

Answer 1

You are missing props here.

 headerRight: () => <ShoppingCartIcon navigation={navigation} />,

this should be

 headerRight: () => <ShoppingCartIcon navigation={props.navigation} />,