implemented nested comments and fix #43

lib/boards-api.js

@@ -215,6 +215,12 @@ BoardsAPI.prototype.getProfile = function(userID,done){
 }
 
 BoardsAPI.prototype.getBoardSettings = function(userID,board){
+  if(!userID){
+    return console.log('Invalid USERID',userID)
+  }
+  if(!board){
+    return console.log('Invalid BOARD',board)
+  }
   this.resolveIPNS(userID,(r,e) => {
     if(e){
       this.ee.emit('error',e)
@@ -377,19 +383,25 @@ BoardsAPI.prototype.downloadComment = function(hash,adminID,board,done){
 }
 
 BoardsAPI.prototype.getCommentsFor = function(parent,board,adminID){
+  if(!parent || !board || !adminID){
+    return console.log('malformed arguments:',parent,board,adminID)
+  }
   this.ee.on('approved comments for '+board+'@'+adminID,ret => {
     ret.forEach(item => this.downloadComment(item.hash,adminID,board))
   })
   // get the admin's comments
   this.getUserCommentList(parent,adminID,(err,res) => {
-    if(err){
-      console.log(err)
-    } else res.forEach(item => this.downloadComment(item.hash,adminID,board))
+    if(!err){
+      res.forEach(item => this.downloadComment(item.hash,adminID,board))
+    }
   })
   this.getAllowedContentProducers(adminID,board,{ comments: true })
 }
 
 BoardsAPI.prototype.getUserCommentList = function(parent,user,done){
+  if(!parent || !user){
+    return console.log('Malformed arguments:',parent,user)
+  }
   this.resolveIPNS(user,(url,err) => {
     if(err){
       this.ee.emit('error',err)
@@ -399,12 +411,14 @@ BoardsAPI.prototype.getUserCommentList = function(parent,user,done){
         this.ee.emit('error',e)
         done(e)
       } else if(r && !r.split){
+        if(r.Objects && r.Objects[0]){ // If this is not true, then there are no comments
           console.log('Found',r.Objects[0].Links.length,'comments for',parent,'at',user)
           var l = r.Objects[0].Links.map(i => {
             return { date: i.Name, hash: i.Hash }
           })
           done(null,l)
         }
+      }
     })
     return true // remove myself from listeners
   })

webapp/components/comment.jsx

@@ -16,12 +16,14 @@ module.exports = function(boardsAPI){
     },
     render: function(){
       if(this.props.comment){
+        var Comments = this.props.comment.comments || require('comments.jsx')(boardsAPI)
         return <div className="comment"><hr/>
           <div className="icons">
             <UserID id={this.props.comment.op} />
             <Clock date={this.props.comment.date} />
           </div>
           <Markdown source={this.props.comment.text} />
+          <Comments className="shifted" parent={this.props.comment.hash} adminID={this.props.adminID} board={this.props.board}/>
         <hr/></div>
       } else {
         return <div><hr/>Invalid Comment<hr/></div>

webapp/components/comments.jsx

@@ -21,10 +21,12 @@ module.exports = function(boardsAPI){
       })
     },
     getComments: function(){
-      return this.state.comments.map(cmnt => (<Comment key={cmnt.hash} comment={cmnt} />) )
+      if(this.state.comments.length > 0)
+        return this.state.comments.map(cmnt => (<Comment key={cmnt.hash} comment={cmnt} comments={this} adminID={this.props.adminID} board={this.props.board}/>) )
+      else return <div></div>
     },
     render: function(){
-      return <div>{this.getComments()}</div>
+      return <div className={this.props.className+' comments'} >{this.getComments()}</div>
     }
   })
 }

webapp/components/profile.jsx

@@ -71,7 +71,7 @@ module.exports = function(boardsAPI){
           <h1>{this.state.name}</h1>
           <Markdown source={this.state.description} skipHtml={true} />
           <hr/>
-          <h5 className="light">@{uid}</h5>
+          <div className="light breaker">@{uid}</div>
           {this.state.boards.map(n => {
             return <h6 className="light" key={uid+'/'+n.name}>
               <Link to={'/@'+uid+'/'+n.name}># {n.name}</Link>

webapp/style.css

@@ -58,6 +58,10 @@ a:hover {
   color: #707070
 }
 
+.breaker {
+  word-break: break-all;
+}
+
 .app {
   padding-top: 9rem
 }
@@ -107,6 +111,9 @@ a:hover {
   margin-right: 1rem;
 }
 
+.shifted {
+  margin-left: 2rem;
+}
 
 .navbar {
   border-bottom: 1px solid #eee;