mattermost-mobile/app/screens/interactive_dialog/dialog_introduction_text.js
Theo Gkourasas 30f91a3814 MM-15219 Added support for introduction text in interactive dialogs (#3222)
* MM-15219 Added support for optional introduction text in interactive dialogs

* Fixed margins in introduction text for interactive dialogs

* Created DialogIntroductionText component to render the introduction text.  Changed text color

* Changed DialogIntroductionText component to only render if a value is supplied
2019-09-16 09:22:59 -07:00

58 lines
1.7 KiB
JavaScript

// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React, {PureComponent} from 'react';
import {View} from 'react-native';
import PropTypes from 'prop-types';
import Markdown from 'app/components/markdown';
import {getMarkdownTextStyles, getMarkdownBlockStyles} from 'app/utils/markdown';
import {makeStyleSheetFromTheme} from 'app/utils/theme';
export default class DialogIntroductionText extends PureComponent {
static propTypes = {
value: PropTypes.string.isRequired,
theme: PropTypes.object.isRequired,
};
render() {
const {
value,
theme,
} = this.props;
if (value) {
const style = getStyleFromTheme(theme);
const blockStyles = getMarkdownBlockStyles(theme);
const textStyles = getMarkdownTextStyles(theme);
return (
<View style={style.introductionTextView}>
<Markdown
baseTextStyle={style.introductionText}
textStyles={textStyles}
blockStyles={blockStyles}
value={value}
disableHashtags={true}
disableAtMentions={true}
disableChannelLink={true}
/>
</View>
);
}
return null;
}
}
const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
return {
introductionTextView: {
marginHorizontal: 15,
},
introductionText: {
color: theme.centerChannelColor,
},
};
});