Pull share extension title from i18n (#1931)

* Pull share extension title from i18n

* Reuse current i18n id.

* Remove unused i18n key

share_extension/ios/extension.js

@@ -4,6 +4,7 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import {Animated, Dimensions, NavigatorIOS, StyleSheet, View} from 'react-native';
+import {intlShape} from 'react-intl';
 
 import {Preferences} from 'mattermost-redux/constants';
 
@@ -20,6 +21,10 @@ export default class SharedApp extends PureComponent {
         onClose: PropTypes.func.isRequired,
     };
 
+    static contextTypes = {
+        intl: intlShape,
+    };
+
     constructor(props) {
         super(props);
 
@@ -75,22 +80,30 @@ export default class SharedApp extends PureComponent {
 
     render() {
         const {init, isLandscape} = this.state;
+        const {intl} = this.context;
+        const {formatMessage} = intl;
 
         if (!init) {
             return null;
         }
 
+        const title = formatMessage({
+            id: 'mobile.extension.title',
+            defaultMessage: 'Share in Mattermost',
+        });
+
         const theme = Preferences.THEMES.default;
 
         const initialRoute = {
             component: ExtensionPost,
-            title: 'Mattermost',
+            title,
             passProps: {
                 authenticated: this.userIsLoggedIn(),
                 entities: this.entities,
                 onClose: this.props.onClose,
                 isLandscape,
                 theme,
+                title,
             },
             wrapperStyle: {
                 borderRadius: 10,

share_extension/ios/extension_nav_bar.js

@@ -24,7 +24,6 @@ export default class ExtensionNavBar extends PureComponent {
     static defaultProps = {
         backButton: false,
         onLeftButtonPress: emptyFunction,
-        title: 'Mattermost',
     };
 
     renderLeftButton = (styles) => {
@@ -114,12 +113,12 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
         },
         backButtonContainer: {
             justifyContent: 'center',
-            paddingHorizontal: 15,
-            width: '30%',
+            flex: 1,
+            paddingLeft: 15,
         },
         titleContainer: {
             alignItems: 'center',
-            flex: 1,
+            flex: 3,
             justifyContent: 'center',
         },
         backButton: {
@@ -129,21 +128,23 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
         leftButton: {
             color: theme.linkColor,
             fontSize: 16,
+            fontWeight: '600',
         },
         title: {
             fontSize: 17,
             fontWeight: '600',
+            textAlign: 'center',
         },
         rightButtonContainer: {
-            alignItems: 'flex-end',
             justifyContent: 'center',
-            paddingHorizontal: 15,
-            width: '30%',
+            flex: 1,
+            paddingRight: 15,
         },
         rightButton: {
             color: theme.linkColor,
             fontSize: 16,
             fontWeight: '600',
+            textAlign: 'right',
         },
     };
 });

share_extension/ios/extension_post.js

@@ -67,6 +67,7 @@ export default class ExtensionPost extends PureComponent {
         navigator: PropTypes.object.isRequired,
         onClose: PropTypes.func.isRequired,
         theme: PropTypes.object.isRequired,
+        title: PropTypes.string,
     };
 
     static contextTypes = {
@@ -655,7 +656,7 @@ export default class ExtensionPost extends PureComponent {
     };
 
     render() {
-        const {authenticated, theme} = this.props;
+        const {authenticated, theme, title} = this.props;
         const {channel, error, totalSize, sending} = this.state;
         const {formatMessage} = this.context.intl;
         const styles = getStyleSheet(theme);
@@ -684,6 +685,7 @@ export default class ExtensionPost extends PureComponent {
                     onRightButtonPress={this.sendMessage}
                     rightButtonTitle={postButtonText}
                     theme={theme}
+                    title={title}
                 />
                 {this.renderBody(styles)}
                 {!error && this.renderTeamButton(styles)}