Merge branch 'feat/Markdown-editor-for-comment' into feat/Markdown-editor-for-comment-mizobuchi

lib/views/layout-growi/widget/comments.html

@@ -45,6 +45,7 @@
         </div>
       </div>
     </form>
+    <div id="page-comment-write"></div>
     <div id="page-comment-form-behavior"></div>
     {% endif %}
 

resource/js/app.js

@@ -14,6 +14,7 @@ import Page             from './components/Page';
 import PageListSearch   from './components/PageListSearch';
 import PageHistory      from './components/PageHistory';
 import PageComments     from './components/PageComments';
+import CommentForm from './components/PageComment/CommentForm';
 import PageCommentFormBehavior from './components/PageCommentFormBehavior';
 import PageAttachment   from './components/PageAttachment';
 import SeenUserList     from './components/SeenUserList';
@@ -127,6 +128,12 @@ Object.keys(componentMappings).forEach((key) => {
   }
 });
 
+// render comment form
+const writeCommentElem = document.getElementById('page-comment-write');
+if (writeCommentElem) {
+  ReactDOM.render(<CommentForm />, writeCommentElem);
+}
+
 // render components with refs to another component
 const elem = document.getElementById('page-comment-form-behavior');
 if (elem) {

resource/js/components/Page.js

@@ -117,7 +117,7 @@ export default class Page extends React.Component {
           isMathJaxEnabled={isMathJaxEnabled}
           renderMathJaxOnInit={true}
       />
-    );
+    )
   }
 }
 

resource/js/components/PageComment/Comment.js

@@ -5,7 +5,6 @@ import dateFnsFormat from 'date-fns/format';
 
 import ReactUtils from '../ReactUtils';
 import UserPicture from '../User/UserPicture';
-import RevisionBody from '../Page/RevisionBody';
 
 /**
  *
@@ -20,10 +19,6 @@ export default class Comment extends React.Component {
   constructor(props) {
     super(props);
 
-    this.state = {
-      html: '',
-    };
-
     this.isCurrentUserIsAuthor = this.isCurrentUserEqualsToAuthor.bind(this);
     this.isCurrentRevision = this.isCurrentRevision.bind(this);
     this.getRootClassName = this.getRootClassName.bind(this);
@@ -114,11 +109,15 @@ export default class Comment extends React.Component {
   render() {
     const comment = this.props.comment;
     const creator = comment.creator;
+
+    // temporary from here
     const isMarkdown = comment.isMarkdown;
+    let markdownText = isMarkdown ? 'markdown' : 'plain';
+    // to here
 
     const rootClassName = this.getRootClassName();
     const commentDate = dateFnsFormat(comment.createdAt, 'YYYY/MM/DD HH:mm');
-    const commentBody = isMarkdown ? this.renderRevisionBody() : ReactUtils.nl2br(comment.comment);
+    const commentBody = ReactUtils.nl2br(comment.comment);
     const creatorsPage = `/user/${creator.username}`;
     const revHref = `?revision=${comment.revision}`;
     const revFirst8Letters = comment.revision.substr(-8);
@@ -132,6 +131,7 @@ export default class Comment extends React.Component {
         <div className="page-comment-main">
           <div className="page-comment-creator">
             <a href={creatorsPage}>{creator.username}</a>
+            <p>{markdownText}!!!</p>
           </div>
           <div className="page-comment-body">{commentBody}</div>
           <div className="page-comment-meta">

resource/js/components/PageComment/CommentForm.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+/**
+ *
+ * @author Yuki Takei <yuki@weseek.co.jp>
+ *
+ * @export
+ * @class Comment
+ * @extends {React.Component}
+ */
+export default class CommentForm extends React.Component {
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+    };
+  }
+
+  render() {
+    return (
+      <h1>CommentForm.js</h1>
+    );
+  }
+}
+
+CommentForm.propTypes = {
+};