my Comment History working 🎉 : TADA :

client/coral-configure/containers/ConfigureStreamContainer.js

@@ -1,5 +1,6 @@
 import React, {Component} from 'react';
 import {connect} from 'react-redux';
+import {compose} from 'react-apollo';
 
 import {I18n} from '../../coral-framework';
 import {updateOpenStatus, updateConfiguration} from '../../coral-framework/actions/asset';
@@ -89,7 +90,6 @@ const mapDispatchToProps = dispatch => ({
   updateConfiguration: newConfig => dispatch(updateConfiguration(newConfig))
 });
 
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
+export default compose(
+  connect(mapStateToProps, mapDispatchToProps)
 )(ConfigureStreamContainer);

client/coral-embed-stream/src/Embed.js

@@ -1,5 +1,4 @@
 import React, {Component} from 'react';
-import gql from 'graphql-tag';
 import {compose} from 'react-apollo';
 import {connect} from 'react-redux';
 import {isEqual} from 'lodash';
@@ -10,8 +9,8 @@ const {logout, showSignInDialog} = authActions;
 const {addNotification, clearNotification} = notificationActions;
 const {fetchAssetSuccess} = assetActions;
 
-import {queryStream} from './graphql/queries';
-import {postComment, postAction, deleteAction} from './graphql/mutations';
+import {queryStream} from 'coral-framework/graphql/queries';
+import {postComment, postAction, deleteAction} from 'coral-framework/graphql/mutations';
 import {Notification, notificationActions, authActions, assetActions, pym} from 'coral-framework';
 
 import Stream from './Stream';
@@ -196,37 +195,6 @@ const mapDispatchToProps = dispatch => ({
   dispatch: d => dispatch(d)
 });
 
-// import commentView from './graphql/fragments/commentView.graphql';
-//
-// Embed.fragments = {
-//   entry: commentView
-// };
-
-Embed.fragments = {
-  entry: gql`
-    fragment commentView on Comment {
-      id
-      body
-      created_at
-      user {
-        id
-        name: displayName
-        settings {
-          bio
-        }
-      }
-      actions {
-        type: action_type
-        count
-        current: current_user {
-          id
-          created_at
-        }
-      }
-    }
-  `,
-};
-
 export default compose(
   connect(mapStateToProps, mapDispatchToProps),
   postComment,

client/coral-framework/client.js

@@ -2,6 +2,7 @@ import ApolloClient, {addTypename} from 'apollo-client';
 import getNetworkInterface from './transport';
 
 export const client = new ApolloClient({
+  connectToDevTools: true,
   queryTransformer: addTypename,
   dataIdFromObject: (result) => {
     if (result.id && result.__typename) { // eslint-disable-line no-underscore-dangle

client/coral-framework/graphql/queries/index.js

@@ -1,7 +1,8 @@
 import {graphql} from 'react-apollo';
 import STREAM_QUERY from './streamQuery.graphql';
-import pym from 'coral-framework/PymConnection';
+import MY_COMMENT_HISTORY from './myCommentHistory.graphql';
 
+import pym from 'coral-framework/PymConnection';
 let url = pym.parentUrl.split('#')[0] || 'http://localhost:3000/';
 
 export const queryStream = graphql(STREAM_QUERY, {
@@ -11,3 +12,5 @@ export const queryStream = graphql(STREAM_QUERY, {
     }
   })
 });
+
+export const myCommentHistory = graphql(MY_COMMENT_HISTORY, {});

client/coral-framework/graphql/queries/myCommentHistory.graphql

@@ -0,0 +1,9 @@
+query myCommentHistory {
+    me {
+        comments {
+            id
+            body
+            created_at
+        }
+    }
+}

client/coral-plugin-history/CommentHistory.js

@@ -7,12 +7,12 @@ const CommentHistory = props => {
     <div className={`${styles.header} commentHistory`}>
       <div className="commentHistory__list">
         {props.comments.map((comment, i) => {
-          const asset = props.assets.find(asset => asset.id === comment.asset_id);
-          return <Comment
-            key={i}
-            comment={comment}
-            link={props.link}
-            asset={asset} />;
+          return <div>{comment.body}</div>
+          {/*return <Comment*/}
+            {/*key={i}*/}
+            {/*comment={comment}*/}
+            {/*link={props.link}*/}
+            {/*asset={asset} />;*/}
         })}
       </div>
     </div>

client/coral-settings/containers/SettingsContainer.js

@@ -1,12 +1,15 @@
 import {connect} from 'react-redux';
+import {compose} from 'react-apollo';
 import React, {Component} from 'react';
 import I18n from 'coral-framework/modules/i18n/i18n';
 
+import {myCommentHistory} from 'coral-framework/graphql/queries';
 import {saveBio} from 'coral-framework/actions/user';
 
 import BioContainer from './BioContainer';
 import {TabBar, Tab, TabContent} from 'coral-ui';
 import NotLoggedIn from '../components/NotLoggedIn';
+import CommentHistory from 'coral-plugin-history/CommentHistory';
 import SettingsHeader from '../components/SettingsHeader';
 import RestrictedContent from 'coral-framework/components/RestrictedContent';
 
@@ -30,9 +33,13 @@ class SettingsContainer extends Component {
   }
 
   render() {
-    const {loggedIn, userData, showSignInDialog, user} = this.props;
+    const {loggedIn, userData, showSignInDialog, user, data} = this.props;
     const {activeTab} = this.state;
 
+    if (data.loading) {
+      return <div>Loading</div>
+    }
+
     return (
       <RestrictedContent restricted={!loggedIn} restrictedComp={<NotLoggedIn showSignInDialog={showSignInDialog} />}>
         <SettingsHeader {...this.props} />
@@ -41,7 +48,12 @@ class SettingsContainer extends Component {
           <Tab>{lang.t('profileSettings')}</Tab>
         </TabBar>
         <TabContent show={activeTab === 0}>
-          {lang.t('myCommentHistory')}
+          {
+            data.me.comments.length ?
+              <CommentHistory comments={data.me.comments}/>
+            :
+              <p>{lang.t('user-no-comment')}</p>
+          }
         </TabContent>
         <TabContent show={activeTab === 1}>
           <BioContainer bio={userData.settings.bio} handleSave={this.handleSave} {...this.props} />
@@ -59,7 +71,7 @@ const mapDispatchToProps = dispatch => ({
   saveBio: (user_id, formData) => dispatch(saveBio(user_id, formData))
 });
 
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
+export default compose(
+  connect(mapStateToProps, mapDispatchToProps),
+  myCommentHistory
 )(SettingsContainer);