Progress

app/javascript/gabsocial/components/recursive_comment.js

@@ -0,0 +1,91 @@
+import { Fragment } from 'react'
+import { NavLink } from 'react-router-dom'
+import ImmutablePropTypes from 'react-immutable-proptypes'
+import { defineMessages, injectIntl } from 'react-intl'
+import ImmutablePureComponent from 'react-immutable-pure-component'
+import { makeGetStatus } from '../selectors';
+import CommentHeader from './comment_header'
+import Avatar from './avatar'
+import Button from './button'
+import DisplayName from './display_name'
+import DotTextSeperator from './dot_text_seperator'
+import RelativeTimestamp from './relative_timestamp'
+import Text from './text'
+import StatusContent from './status_content'
+
+const messages = defineMessages({
+  follow: { id: 'follow', defaultMessage: 'Follow' },
+})
+
+const makeMapStateToProps = () => {
+  const getStatus = makeGetStatus()
+
+  const mapStateToProps = (state, props) => {
+    const status = getStatus(state, props)
+    let descendantsIds = Immutable.List()
+
+    if (status) {
+      // ALL descendants
+      descendantsIds = descendantsIds.withMutations(mutable => {
+        const ids = [status.get('id')]
+
+        while (ids.length > 0) {
+          let id = ids.shift();
+          const replies = state.getIn(['contexts', 'replies', id])
+
+          if (status.get('id') !== id) {
+            mutable.push(id)
+          }
+
+          if (replies) {
+            replies.reverse().forEach(reply => {
+              ids.unshift(reply)
+            });
+          }
+        }
+      })
+    }
+
+    return {
+      status,
+      descendantsIds,
+    }
+  }
+
+  return mapStateToProps
+}
+
+export default
+@injectIntl
+@connect(makeMapStateToProps)
+class Comment extends ImmutablePureComponent {
+
+  static propTypes = {
+    status: ImmutablePropTypes.map.isRequired,
+    descendantsIds: ImmutablePropTypes.list,
+
+  }
+
+  constructListItem = (item) => {
+    if (item.nestedItems) {
+      return (
+        <List key={item.key}>
+          {item.nestedItems.map(this.constructListItem)}
+        </List>
+      )
+    } else {
+      return <ListItem key={item.key} item={item} />
+    }
+  }
+
+  render() {
+    const { listItems } = this.props
+
+    return (
+      <List>
+        {listItems.map(this.constructListItem)}
+      </List>
+    )
+  }
+
+}