fix: properly handle header title

react-navigation · Oct 16, 2019 · 92f0f69 · 92f0f69
1 parent 90a72fa
commit 92f0f69
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 15 deletions.
diff --git a/src/views/Header/Header.tsx b/src/views/Header/Header.tsx
@@ -1,8 +1,7 @@
 import * as React from 'react';
 import { StackActions } from 'react-navigation';
 import HeaderSegment from './HeaderSegment';
-import { HeaderProps, HeaderTitleProps } from '../../types';
-import HeaderTitle from './HeaderTitle';
+import { HeaderProps } from '../../types';
 
 export default class Header extends React.PureComponent<HeaderProps> {
   render() {
@@ -46,11 +45,6 @@ export default class Header extends React.PureComponent<HeaderProps> {
         scene={scene}
         title={title}
         leftLabel={leftLabel}
-        headerTitle={
-          options.headerTitle === undefined
-            ? (props: HeaderTitleProps) => <HeaderTitle {...props} />
-            : options.headerTitle
-        }
         onGoBack={
           previous
             ? () =>

diff --git a/src/views/Header/HeaderSegment.tsx b/src/views/Header/HeaderSegment.tsx
@@ -8,6 +8,7 @@ import {
 } from 'react-native';
 import Animated from 'react-native-reanimated';
 import { SafeAreaContext, EdgeInsets } from 'react-native-safe-area-context';
+import HeaderTitle from './HeaderTitle';
 import HeaderBackButton from './HeaderBackButton';
 import HeaderBackground from './HeaderBackground';
 import memoize from '../../utils/memoize';
@@ -358,14 +359,22 @@ export default class HeaderSegment extends React.Component<Props, State> {
                 titleContainerStyle,
               ]}
             >
-              {typeof headerTitle === 'function'
-                ? headerTitle({
-                    children: currentTitle,
-                    onLayout: this.handleTitleLayout,
-                    allowFontScaling: titleAllowFontScaling,
-                    style: [{ color: headerTintColor }, customTitleStyle],
-                  })
-                : headerTitle}
+              {typeof headerTitle === 'function' ? (
+                headerTitle({
+                  children: currentTitle,
+                  onLayout: this.handleTitleLayout,
+                  allowFontScaling: titleAllowFontScaling,
+                  style: [{ color: headerTintColor }, customTitleStyle],
+                })
+              ) : (
+                <HeaderTitle
+                  onLayout={this.handleTitleLayout}
+                  allowFontScaling={titleAllowFontScaling}
+                  style={[{ color: headerTintColor }, customTitleStyle]}
+                >
+                  {currentTitle}
+                </HeaderTitle>
+              )}
             </Animated.View>
             {right !== undefined ? (
               <Animated.View