Skip to content
Snippets Groups Projects
Commit 4de1519f authored by chris's avatar chris
Browse files

fix feedback rerender

parent 95b1a5ca
No related branches found
No related tags found
1 merge request!519Move tool groups
import React, { useContext, useRef, useState } from 'react';
import React, { useContext, useRef, useState, useMemo, useEffect } from 'react';
import styled from 'styled-components';
import { TextSelection } from 'prosemirror-state';
import { WaxContext, DocumentHelpers } from 'wax-prosemirror-core';
......@@ -50,17 +50,10 @@ export default ({ node, getPos, readOnly }) => {
pmViews: { main },
} = context;
const [isFirstRun, setFirstRun] = useState(true);
const [feedBack, setFeedBack] = useState(node.attrs.feedback);
const feedBackRef = useRef(null);
const setHeight = () => {
const textarea = feedBackRef.current;
if (!textarea) return;
const heightLimit = 200;
textarea.style.height = '';
textarea.style.height = `${Math.min(textarea.scrollHeight, heightLimit)}px`;
};
const feedBackInput = () => {
setFeedBack(feedBackRef.current.value);
const allNodes = getNodes(main);
......@@ -79,6 +72,14 @@ export default ({ node, getPos, readOnly }) => {
return false;
};
const setHeight = () => {
const textarea = feedBackRef.current;
if (!textarea) return;
const heightLimit = 200;
textarea.style.height = '';
textarea.style.height = `${Math.min(textarea.scrollHeight, heightLimit)}px`;
};
const setNullSelection = () => {
main.dispatch(
main.state.tr.setSelection(TextSelection.create(main.state.tr.doc, null)),
......@@ -91,20 +92,30 @@ export default ({ node, getPos, readOnly }) => {
}, 50);
};
return (
<FeedBack>
<FeedBackLabel>Feedback</FeedBackLabel>
<FeedBackInput
onChange={feedBackInput}
onFocus={onFocus}
placeholder="Insert feedback"
readOnly={readOnly}
ref={feedBackRef}
rows="1"
type="text"
value={feedBack}
/>
</FeedBack>
useEffect(() => {
setTimeout(() => {
setFirstRun(false);
});
}, []);
return useMemo(
() => (
<FeedBack>
<FeedBackLabel>Feedback</FeedBackLabel>
<FeedBackInput
onChange={feedBackInput}
onFocus={onFocus}
placeholder="Insert feedback"
readOnly={readOnly}
ref={feedBackRef}
rows="1"
style={{ height: setHeight() }}
type="text"
value={feedBack}
/>
</FeedBack>
),
[feedBack, isFirstRun],
);
};
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment