MM-15215 fix crash caused by malformed post textbox localize string

app/components/post_textbox/index.js

@@ -47,6 +47,7 @@ function mapStateToProps(state, ownProps) {
         channelId: ownProps.channelId || (currentChannel ? currentChannel.id : ''),
         channelTeamId: currentChannel ? currentChannel.team_id : '',
         canUploadFiles: canUploadFilesOnMobile(state),
+        channelDisplayName: state.views.channel.displayName || (currentChannel ? currentChannel.display_name : ''),
         channelIsLoading: state.views.channel.loading,
         channelIsReadOnly: isCurrentChannelReadOnly(state) || false,
         channelIsArchived: ownProps.channelIsArchived || (currentChannel ? currentChannel.delete_at !== 0 : false),

app/components/post_textbox/post_textbox.js

@@ -46,6 +46,7 @@ export default class PostTextbox extends PureComponent {
         }).isRequired,
         canUploadFiles: PropTypes.bool.isRequired,
         channelId: PropTypes.string.isRequired,
+        channelDisplayName: PropTypes.string,
         channelTeamId: PropTypes.string.isRequired,
         channelIsLoading: PropTypes.bool,
         channelIsReadOnly: PropTypes.bool.isRequired,
@@ -518,6 +519,7 @@ export default class PostTextbox extends PureComponent {
         const {
             canUploadFiles,
             channelId,
+            channelDisplayName,
             channelIsLoading,
             channelIsReadOnly,
             deactivatedChannel,
@@ -559,7 +561,7 @@ export default class PostTextbox extends PureComponent {
         } else if (rootId) {
             placeholder = {id: t('create_comment.addComment'), defaultMessage: 'Add a comment...'};
         } else {
-            placeholder = {id: t('create_post.write'), defaultMessage: 'Write a message...'};
+            placeholder = {id: t('create_post.write'), defaultMessage: 'Write to {channelDisplayName}'};
         }
 
         let attachmentButton = null;
@@ -611,7 +613,7 @@ export default class PostTextbox extends PureComponent {
                                 value={textValue}
                                 onChangeText={this.handleTextChange}
                                 onSelectionChange={this.handlePostDraftSelectionChanged}
-                                placeholder={intl.formatMessage(placeholder)}
+                                placeholder={intl.formatMessage(placeholder, {channelDisplayName})}
                                 placeholderTextColor={changeOpacity('#000', 0.5)}
                                 multiline={true}
                                 numberOfLines={5}

assets/base/i18n/en.json

@@ -68,7 +68,7 @@
   "combined_system_message.you": "You",
   "create_comment.addComment": "Add a comment...",
   "create_post.deactivated": "You are viewing an archived channel with a deactivated user.",
-  "create_post.write": "Write a message...",
+  "create_post.write": "Write to {channelDisplayName}",
   "edit_post.editPost": "Edit the post...",
   "edit_post.save": "Save",
   "error.team_not_found.title": "Team Not Found",

share_extension/android/extension_post/extension_post.js

@@ -44,7 +44,7 @@ import {
 import ChannelButton from './channel_button';
 import TeamButton from './team_button';
 
-const defalultTheme = Preferences.THEMES.default;
+const defaultTheme = Preferences.THEMES.default;
 const extensionSvg = {
     csv: ExcelSvg,
     pdf: PdfSvg,
@@ -64,6 +64,7 @@ export default class ExtensionPost extends PureComponent {
             getTeamChannels: PropTypes.func.isRequired,
         }).isRequired,
         channelId: PropTypes.string,
+        channels: PropTypes.object.isRequired,
         currentUserId: PropTypes.string.isRequired,
         maxFileSize: PropTypes.number.isRequired,
         navigation: PropTypes.object.isRequired,
@@ -111,7 +112,7 @@ export default class ExtensionPost extends PureComponent {
                 >
                     <View style={styles.left}>
                         <PaperPlane
-                            color={defalultTheme.sidebarHeaderTextColor}
+                            color={defaultTheme.sidebarHeaderTextColor}
                             height={20}
                             width={20}
                         />
@@ -352,7 +353,10 @@ export default class ExtensionPost extends PureComponent {
 
     renderBody = () => {
         const {formatMessage} = this.context.intl;
-        const {value} = this.state;
+        const {channelId, value} = this.state;
+
+        const channel = this.props.channels[channelId];
+        const channelDisplayName = channel?.display_name || ''; //eslint-disable-line camelcase
 
         return (
             <ScrollView
@@ -368,8 +372,8 @@ export default class ExtensionPost extends PureComponent {
                     onBlur={this.handleBlur}
                     onChangeText={this.handleTextChange}
                     onFocus={this.handleFocus}
-                    placeholder={formatMessage({id: 'create_post.write', defaultMessage: 'Write a message...'})}
-                    placeholderTextColor={changeOpacity(defalultTheme.centerChannelColor, 0.5)}
+                    placeholder={formatMessage({id: 'create_post.write', defaultMessage: 'Write to {channelDisplayName}'}, {channelDisplayName})}
+                    placeholderTextColor={changeOpacity(defaultTheme.centerChannelColor, 0.5)}
                     style={styles.input}
                     underlineColorAndroid='transparent'
                     value={value}
@@ -386,7 +390,7 @@ export default class ExtensionPost extends PureComponent {
             <ChannelButton
                 channelId={channelId}
                 onPress={this.goToChannels}
-                theme={defalultTheme}
+                theme={defaultTheme}
             />
         );
     };
@@ -489,7 +493,7 @@ export default class ExtensionPost extends PureComponent {
             <TeamButton
                 onPress={this.goToTeams}
                 teamId={teamId}
-                theme={defalultTheme}
+                theme={defaultTheme}
             />
         );
     };
@@ -661,4 +665,4 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
     };
 });
 
-const styles = getStyleSheet(defalultTheme);
+const styles = getStyleSheet(defaultTheme);

share_extension/android/extension_post/index.js

@@ -4,7 +4,7 @@
 import {bindActionCreators} from 'redux';
 import {connect} from 'react-redux';
 
-import {getCurrentChannel, getDefaultChannel} from 'mattermost-redux/selectors/entities/channels';
+import {getAllChannels, getCurrentChannel, getDefaultChannel} from 'mattermost-redux/selectors/entities/channels';
 import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams';
 import {getCurrentUserId} from 'mattermost-redux/selectors/entities/users';
 import {getConfig} from 'mattermost-redux/selectors/entities/general';
@@ -25,6 +25,7 @@ function mapStateToProps(state) {
 
     return {
         channelId: channel?.id,
+        channels: getAllChannels(state),
         currentUserId: getCurrentUserId(state),
         maxFileSize: getAllowedServerMaxFileSize(config),
         teamId: getCurrentTeamId(state),