From 647d62969d54c5fcf88fe21e1eba411d00091658 Mon Sep 17 00:00:00 2001
From: Riley Davis <riley.davis@gmail.com>
Date: Fri, 16 Dec 2016 12:24:32 -0700
Subject: [PATCH 1/2] design tweaks per kim

---
 client/coral-plugin-history/Comment.css            |  8 ++++++++
 client/coral-plugin-history/Comment.js             |  4 ++--
 client/coral-plugin-history/CommentHistory.js      |  1 -
 .../coral-settings/containers/SettingsContainer.js | 14 ++++++++++++--
 4 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/client/coral-plugin-history/Comment.css b/client/coral-plugin-history/Comment.css
index ba2a59f4b..f54b0ad29 100644
--- a/client/coral-plugin-history/Comment.css
+++ b/client/coral-plugin-history/Comment.css
@@ -1,3 +1,11 @@
+.myComment {
+  border-bottom: 1px solid lightgrey;
+}
+
+.myComment:last-child {
+  border-bottom: none;
+}
+
 .assetURL {
   font-size: 16px;
   color: black;
diff --git a/client/coral-plugin-history/Comment.js b/client/coral-plugin-history/Comment.js
index fd515e628..036753623 100644
--- a/client/coral-plugin-history/Comment.js
+++ b/client/coral-plugin-history/Comment.js
@@ -4,9 +4,9 @@ import styles from './Comment.css';
 
 const Comment = props => {
   return (
-    <div>
+    <div className={styles.myComment}>
       <p className="myCommentAsset">
-        <a className={`${styles.assetURL} myCommentAnchor`} href={`${props.asset.url}#${props.comment.id}`}>{`${props.asset.url}#${props.comment.id}`}</a>
+        <a className={`${styles.assetURL} myCommentAnchor`} href={`${props.asset.url}#${props.comment.id}`}>{props.asset.url}</a>
       </p>
       <p className={`${styles.commentBody} myCommentBody`}>{props.comment.body}</p>
     </div>
diff --git a/client/coral-plugin-history/CommentHistory.js b/client/coral-plugin-history/CommentHistory.js
index 44d06bc91..c18846066 100644
--- a/client/coral-plugin-history/CommentHistory.js
+++ b/client/coral-plugin-history/CommentHistory.js
@@ -5,7 +5,6 @@ import styles from './CommentHistory.css';
 const CommentHistory = props => {
   return (
     <div className={`${styles.header} commentHistory`}>
-      <h2>All Comments</h2>
       <div className="commentHistory__list">
         {props.comments.map((comment, i) => {
           const asset = props.assets.find(asset => asset.id === comment.asset_id);
diff --git a/client/coral-settings/containers/SettingsContainer.js b/client/coral-settings/containers/SettingsContainer.js
index 8f1b32687..1036c0668 100644
--- a/client/coral-settings/containers/SettingsContainer.js
+++ b/client/coral-settings/containers/SettingsContainer.js
@@ -34,18 +34,28 @@ class SignInContainer extends Component {
   render() {
     const {loggedIn, userData, showSignInDialog, items, user} = this.props;
     const {activeTab} = this.state;
+
+    const commentsMostRecentFirst = user
+      .myComments.map(id => items.comments[id])
+      .sort(({created_at:a}, {created_at:b}) => {
+        // descending order, created_at
+        // js date strings can be sorted lexigraphically.
+        const aLessThanB = a < b ? 1 : 0;
+        return a > b ? -1 : aLessThanB;
+      });
+
     return (
       <RestrictedContent restricted={!loggedIn} restrictedComp={<NotLoggedIn showSignInDialog={showSignInDialog} />}>
         <SettingsHeader {...this.props} />
         <TabBar onChange={this.handleTabChange} activeTab={activeTab} cStyle='material'>
-          <Tab>All Comments (120)</Tab>
+          <Tab>All Comments ({user.myComments.length})</Tab>
           <Tab>Profile Settings</Tab>
         </TabBar>
         <TabContent show={activeTab === 0}>
           {
             user.myComments.length && user.myAssets.length
             ? <CommentHistory
-              comments={user.myComments.map(id => items.comments[id])}
+              comments={commentsMostRecentFirst}
               assets={user.myAssets.map(id => items.assets[id])} />
             : <p>Loading comment history...</p>
           }

From 0aa7a216be6c0f4c908269c75c74d80579c7e05c Mon Sep 17 00:00:00 2001
From: Riley Davis <riley.davis@gmail.com>
Date: Fri, 16 Dec 2016 12:29:27 -0700
Subject: [PATCH 2/2] update tests

---
 tests/client/coral-plugin-history/Comment.spec.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/tests/client/coral-plugin-history/Comment.spec.js b/tests/client/coral-plugin-history/Comment.spec.js
index 2098fa1b3..78ad104bf 100644
--- a/tests/client/coral-plugin-history/Comment.spec.js
+++ b/tests/client/coral-plugin-history/Comment.spec.js
@@ -21,7 +21,8 @@ describe('coral-plugin-history/Comment', () => {
   it('should render the asset url as a link', () => {
     const wrapper = mount(<Comment asset={asset} comment={comment} />);
     expect(wrapper.find('.myCommentAnchor')).to.have.length(1);
-    expect(wrapper.find('.myCommentAnchor').text()).to.equal('https://google.com#123');
+    expect(wrapper.find('.myCommentAnchor').text()).to.equal('https://google.com');
+    expect(wrapper.find('.myCommentAnchor').props().href).to.equal('https://google.com#123');
   });
 
   it('should render the comment with styles', () => {