change timing of generate link text

src/client/js/components/PageEditor/CodeMirrorEditor.jsx

@@ -876,7 +876,7 @@ export default class CodeMirrorEditor extends AbstractEditor {
 
         <LinkEditModal
           ref={this.linkEditModal}
-          onSave={(link) => { return mlu.replaceFocusedMarkdownLinkWithEditor(this.getCodeMirror(), link) }}
+          onSave={(linkText) => { return mlu.replaceFocusedMarkdownLinkWithEditor(this.getCodeMirror(), linkText) }}
         />
         <HandsontableModal
           ref={this.handsontableModal}

src/client/js/components/PageEditor/LinkEditModal.jsx

@@ -35,6 +35,7 @@ class LinkEditModal extends React.PureComponent {
       linkerType: Linker.types.markdownLink,
       markdown: '',
       permalink: '',
+      linkText: '',
     };
 
     this.isApplyPukiwikiLikeLinkerPlugin = window.growiRenderer.preProcessors.some(process => process.constructor.name === 'PukiwikiLikeLinker');
@@ -54,6 +55,7 @@ class LinkEditModal extends React.PureComponent {
     this.getRootPath = this.getRootPath.bind(this);
 
     this.getPreviewDebounced = debounce(200, this.getPreview.bind(this));
+    this.getLinkTextPreviewDebounced = debounce(200, this.getLinkTextPreview.bind(this));
   }
 
   componentDidUpdate(prevState) {
@@ -62,6 +64,7 @@ class LinkEditModal extends React.PureComponent {
     if (linkInputValue !== prevLinkInputValue) {
       this.getPreviewDebounced(linkInputValue);
     }
+    this.getLinkTextPreviewDebounced();
   }
 
   // defaultMarkdownLink is an instance of Linker
@@ -162,6 +165,12 @@ class LinkEditModal extends React.PureComponent {
     this.setState({ markdown, permalink });
   }
 
+  getLinkTextPreview() {
+    const linker = this.generateLink();
+    const linkText = linker.generateMarkdownText();
+    this.setState({ linkText });
+  }
+
   handleChangeTypeahead(selected) {
     const page = selected[0];
     if (page != null) {
@@ -191,10 +200,8 @@ class LinkEditModal extends React.PureComponent {
   }
 
   save() {
-    const output = this.generateLink();
-
     if (this.props.onSave != null) {
-      this.props.onSave(output);
+      this.props.onSave(this.state.linkText);
     }
 
     this.hide();

src/client/js/components/PageEditor/MarkdownLinkUtil.js

@@ -27,16 +27,15 @@ class MarkdownLinkUtil {
   }
 
   // replace link(link is an instance of Linker)
-  replaceFocusedMarkdownLinkWithEditor(editor, link) {
+  replaceFocusedMarkdownLinkWithEditor(editor, linkText) {
     const curPos = editor.getCursor();
-    const linkStr = link.generateMarkdownText();
     if (!this.isInLink(editor)) {
-      editor.getDoc().replaceSelection(linkStr);
+      editor.getDoc().replaceSelection(linkText);
     }
     else {
       const line = editor.getDoc().getLine(curPos.line);
       const { beginningOfLink, endOfLink } = Linker.getBeginningAndEndIndexOfLink(line, curPos.ch);
-      editor.getDoc().replaceRange(linkStr, { line: curPos.line, ch: beginningOfLink }, { line: curPos.line, ch: endOfLink });
+      editor.getDoc().replaceRange(linkText, { line: curPos.line, ch: beginningOfLink }, { line: curPos.line, ch: endOfLink });
     }
   }