luisgulo/focalboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Hack to fix SimpleMDE not updating events

Browse source
This commit is contained in:
Jesús Espino 2021-04-29 21:26:25 +02:00
parent 58776dd94d
commit d09d6e0e40
1 changed files with 24 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
webapp/src/components/markdownEditor.tsx
View file

@ -1,6 +1,6 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React, {useState, useEffect} from 'react'
import React, {useState, useEffect, useRef} from 'react'
import EasyMDE from 'easymde'
import SimpleMDE from 'react-simplemde-editor'
@ -48,6 +48,17 @@ const MarkdownEditor = (props: Props): JSX. Element => {
}
}, [props.text])
const stateAndPropsValue = {
isEditing,
setIsEditing,
setActive,
onBlur,
onChange,
onFocus,
}
const stateAndPropsRef = useRef(stateAndPropsValue)
stateAndPropsRef.current = stateAndPropsValue
const html: string = Utils.htmlFromMarkdown(text || placeholderText || '')
const previewElement = (
@ -99,32 +110,33 @@ const MarkdownEditor = (props: Props): JSX. Element => {
events={{
change: (instance: any) => {
if (isEditing) {
if (stateAndPropsRef.current.isEditing) {
const newText = instance.getValue()
onChange?.(newText)
stateAndPropsRef.current.onChange?.(newText)
}
},
blur: (instance: any) => {
const newText = instance.getValue()
const oldText = text || ''
if (newText !== oldText && onChange) {
onChange(newText)
if (newText !== oldText && stateAndPropsRef.current.onChange) {
stateAndPropsRef.current.onChange(newText)
}
setActive(false)
stateAndPropsRef.current.setActive(false)
if (onBlur) {
onBlur(newText)
if (stateAndPropsRef.current.onBlur) {
stateAndPropsRef.current.onBlur(newText)
}
instance.getInputField()?.blur()
setIsEditing(false)
stateAndPropsRef.current.setIsEditing(false)
},
focus: () => {
setActive(true)
stateAndPropsRef.current.setActive(true)
stateAndPropsRef.current.setIsEditing(true)
if (onFocus) {
onFocus()
if (stateAndPropsRef.current.onFocus) {
stateAndPropsRef.current.onFocus()
}
},
}}