diff --git a/app/javascript/gabsocial/components/autosuggest_textbox.js b/app/javascript/gabsocial/components/autosuggest_textbox.js index 9bbc2ca0..a2d257e7 100644 --- a/app/javascript/gabsocial/components/autosuggest_textbox.js +++ b/app/javascript/gabsocial/components/autosuggest_textbox.js @@ -17,6 +17,7 @@ export default class AutosuggestTextbox extends ImmutablePureComponent { static propTypes = { value: PropTypes.string, + valueMarkdown: PropTypes.string, suggestions: ImmutablePropTypes.list, disabled: PropTypes.bool, placeholder: PropTypes.string, @@ -214,6 +215,7 @@ export default class AutosuggestTextbox extends ImmutablePureComponent { onKeyUp, autoFocus, children, + valueMarkdown, className, id, maxLength, @@ -280,6 +282,7 @@ export default class AutosuggestTextbox extends ImmutablePureComponent { placeholder={placeholder} autoFocus={autoFocus} value={value} + valueMarkdown={valueMarkdown} onChange={this.onChange} onKeyDown={this.onKeyDown} onKeyUp={onKeyUp} diff --git a/app/javascript/gabsocial/components/composer.js b/app/javascript/gabsocial/components/composer.js index 90691bac..05d5946c 100644 --- a/app/javascript/gabsocial/components/composer.js +++ b/app/javascript/gabsocial/components/composer.js @@ -4,9 +4,11 @@ import { CompositeDecorator, RichUtils, convertToRaw, + convertFromRaw, ContentState, } from 'draft-js' import draftToMarkdown from '../features/ui/util/draft-to-markdown' +import markdownToDraft from '../features/ui/util/markdown-to-draft' import { urlRegex } from '../features/ui/util/url_regex' import classNames from 'classnames/bind' import RichTextEditorBar from './rich_text_editor_bar' @@ -81,6 +83,7 @@ export default class Composer extends PureComponent { disabled: PropTypes.bool, placeholder: PropTypes.string, value: PropTypes.string, + valueMarkdown: PropTypes.string, onChange: PropTypes.func, onKeyDown: PropTypes.func, onKeyUp: PropTypes.func, @@ -95,6 +98,24 @@ export default class Composer extends PureComponent { plainText: this.props.value, } + componentDidMount() { + if (this.props.valueMarkdown) { + const rawData = markdownToDraft(this.props.valueMarkdown) + const contentState = convertFromRaw(rawData) + const editorState = EditorState.createWithContent(contentState) + this.setState({ + editorState, + plainText: this.props.value, + }) + } else if (this.props.value) { + editorState = EditorState.push(this.state.editorState, ContentState.createFromText(this.props.value)) + this.setState({ + editorState, + plainText: this.props.value, + }) + } + } + componentDidUpdate() { if (this.state.plainText !== this.props.value) { let editorState diff --git a/app/javascript/gabsocial/features/compose/components/compose_form.js b/app/javascript/gabsocial/features/compose/components/compose_form.js index 02ed2bde..0700cf96 100644 --- a/app/javascript/gabsocial/features/compose/components/compose_form.js +++ b/app/javascript/gabsocial/features/compose/components/compose_form.js @@ -45,7 +45,7 @@ class ComposeForm extends ImmutablePureComponent { static contextTypes = { router: PropTypes.object, } - + state = { composeFocused: false, } @@ -55,6 +55,7 @@ class ComposeForm extends ImmutablePureComponent { edit: PropTypes.bool, isMatch: PropTypes.bool, text: PropTypes.string.isRequired, + markdown: PropTypes.string, suggestions: ImmutablePropTypes.list, account: ImmutablePropTypes.map.isRequired, status: ImmutablePropTypes.map, @@ -133,9 +134,9 @@ class ComposeForm extends ImmutablePureComponent { handleSubmit = () => { // if (this.props.text !== this.autosuggestTextarea.textbox.value) { - // Something changed the text inside the textarea (e.g. browser extensions like Grammarly) - // Update the state to match the current text - // this.props.onChange(this.autosuggestTextarea.textbox.value); + // Something changed the text inside the textarea (e.g. browser extensions like Grammarly) + // Update the state to match the current text + // this.props.onChange(this.autosuggestTextarea.textbox.value); // } // Submit disabled: @@ -244,6 +245,7 @@ class ComposeForm extends ImmutablePureComponent { isSubmitting, selectedGifSrc, } = this.props + const disabled = isSubmitting const text = [this.props.spoilerText, countableText(this.props.text)].join(''); const disabledButton = disabled || isUploading || isChangingUpload || length(text) > MAX_POST_CHARACTER_COUNT || (length(text) !== 0 && length(text.trim()) === 0 && !anyMedia); @@ -325,9 +327,9 @@ class ComposeForm extends ImmutablePureComponent {