From fa3ae9ebc2d72520ddc957fc00cc77c0ed9d1ce3 Mon Sep 17 00:00:00 2001
From: chris <kokosias@yahoo.gr>
Date: Thu, 11 Feb 2021 13:53:28 +0200
Subject: [PATCH] add new tag to array and remove previous funcionality
---
.../CustomTagInlineOverlayCompoment.js | 42 ++++++++++++-------
1 file changed, 26 insertions(+), 16 deletions(-)
diff --git a/wax-prosemirror-components/src/components/customtag/CustomTagInlineOverlayCompoment.js b/wax-prosemirror-components/src/components/customtag/CustomTagInlineOverlayCompoment.js
index e7156d8a3..d99100fee 100644
--- a/wax-prosemirror-components/src/components/customtag/CustomTagInlineOverlayCompoment.js
+++ b/wax-prosemirror-components/src/components/customtag/CustomTagInlineOverlayCompoment.js
@@ -73,10 +73,13 @@ const CustomTagInlineOverlayComponent = ({ mark, setPosition, position }) => {
const [inputValue, setInputValue] = useState('');
const [selectedTagName, setSelectedTagName] = useState([]);
const localTagList = JSON.parse(localStorage.getItem('tagList'));
+
const [isCustomTagInline, setCustomTag] = useState(
JSON.parse(localStorage.getItem('isInline')),
);
+
const {
+ app,
view: { main },
} = useContext(WaxContext);
const { state, dispatch } = main;
@@ -84,23 +87,28 @@ const CustomTagInlineOverlayComponent = ({ mark, setPosition, position }) => {
selection: { $from, $to },
} = state;
- const onChangeTagName = e => {
+ const customTagsConfig = app.config.get('config.CustomTagService');
+ const configTags =
+ customTagsConfig && customTagsConfig.tags ? customTagsConfig.tags : [];
+ const [allTags, setAllTags] = useState(configTags);
+
+ const onChangeTagName = () => {
setInputValue(ref.current.value);
};
- const onClickAdd = () => {
- const localItem = localStorage.getItem('isInline');
- let tagNameList = [];
- if (localStorage.getItem('tagList') === null) {
- tagNameList.push({ label: inputValue, type: 'inline' });
- localStorage.setItem('tagList', JSON.stringify(tagNameList));
- } else {
- tagNameList = JSON.parse(localStorage.getItem('tagList'));
- tagNameList.push({ label: inputValue, type: 'inline' });
- localStorage.clear('tagList');
- localStorage.setItem('tagList', JSON.stringify(tagNameList));
- localStorage.setItem('isInline', localItem);
+ const handleKeyDown = event => {
+ if (event.key === 'Enter' || event.which === 13) {
+ onClickAdd();
}
+ };
+
+ const onClickAdd = () => {
+ if (inputValue.trim() === '') return;
+
+ configTags.push({ label: inputValue, tagType: 'inline' });
+ setAllTags(configTags);
+ setInputValue('');
+ if (ref.current) ref.current.focus();
setInputValue('');
};
@@ -207,7 +215,7 @@ const CustomTagInlineOverlayComponent = ({ mark, setPosition, position }) => {
useEffect(() => {
setCustomTag(JSON.parse(localStorage.getItem('isInline')));
- });
+ }, []);
return isCustomTagInline === true ? (
<Wrapper>
@@ -237,9 +245,11 @@ const CustomTagInlineOverlayComponent = ({ mark, setPosition, position }) => {
</Flex>
</ListStyle>
))}
- <CustomWrapper ref={ref}>
+ <CustomWrapper>
<Input
- onChange={() => onChangeTagName()}
+ onChange={onChangeTagName}
+ onKeyPress={handleKeyDown}
+ ref={ref}
type="text"
value={inputValue}
/>
--
GitLab