Added upvote percentage to the popup for votes made

The upvote percentage can be viewed when hovering over the vote count and seeing the voters and their vote reward value.

client/src/actions/summaryPostActions.js

@@ -64,7 +64,7 @@ export const getSummaryContent = (selectedFilter, query, page, action) => (dispa
   if (posts.length && action === 'more') {
     startAuthor = summaryPost.startAuthor;
     startPermlink = summaryPost.startPermlink;
-    query.limit = query.limit+1;
+    query.limit = query.limit + 1;
   }
 
   let nextPost = false;

client/src/components/pages/Manage/ManageGroups.js

@@ -34,7 +34,7 @@ class ManageGroups extends Component {
     section: PropTypes.string.isRequired,
     headerText: PropTypes.string.isRequired,
     match: PropTypes.shape(PropTypes.object.isRequired),
-    groups: PropTypes.shape(PropTypes.object.isRequired),
+    groups: PropTypes.arrayOf(PropTypes.object.isRequired),
     areGroupsLoading: PropTypes.bool,
     onChangeOwnership: PropTypes.func.isRequired,
   };

client/src/components/pages/Steem/PercentDisplay.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+/**
+ *  Formats a number to a percentage with 2 decimal places.
+ *
+ *  @param {number} value Number to be formatted
+ *  @return {element} Span element containing formatted value
+ */
+const PercentDisplay = ({ value }) => {
+  const formatter = new Intl.NumberFormat('en-US', {
+    style: 'percent',
+    minimumFractionDigits: 2
+  })
+  return (
+    <span>{formatter.format(value)}</span>
+  )
+}
+
+PercentDisplay.propTypes = {
+  value: PropTypes.number,
+};
+
+PercentDisplay.defaultProps = {
+  value: 0,
+};
+
+export default PercentDisplay;

client/src/components/pages/Steem/PostsSummary.css

@@ -69,7 +69,7 @@
   right: 0;
   left: 0;
   background: rgb(0, 0, 0);
-  background: rgba(0, 0, 0, 0.7);
+  background: rgba(0, 0, 0, 0.8);
   color: #f1f1f1;
   opacity:1;
   font-size: 1.1rem;
@@ -100,6 +100,7 @@
   position: relative;
   display: block;
   max-height: 6.2rem;
+  line-height: 1.7rem;
 }
 
 .infSummary .overlayImage a {
@@ -121,6 +122,10 @@
   margin-top: 0.5rem;
 }
 
+.postBox .item {
+  line-height: inherit;
+}
+
 .postBox .timeago {
   text-align: right;
 }

client/src/components/pages/Steem/PostsSummaryGrid.js

@@ -71,7 +71,6 @@ const PostsSummary = (props) => {
         const reblogged_by = post.reblogged_by;
 
         let isResteemed = false;
-        let isResteemedByUser = false;
 
         if (page === 'blog') {
           isResteemed = pageOwner !== author
@@ -183,7 +182,6 @@ const PostsSummary = (props) => {
                       pid={pid}
                       image={thumb}
                       handleResteem={handleResteem}
-                      isResteemedByUser={isResteemedByUser}
                       resteemedPayload={resteemedPayload}
                       pageOwner={pageOwner}
                     />

client/src/components/pages/Steem/Vote.js

@@ -4,6 +4,7 @@ import Slider from 'react-rangeslider';
 import PropTypes from 'prop-types';
 
 import DollarDisplay from './DollarDisplay';
+import PercentDisplay from './PercentDisplay';
 import UserLink from './UserLink';
 import { getUpvotes, sortVotes } from '../../../utils/helpers';
 
@@ -202,14 +203,21 @@ class Vote extends Component {
     if (votesCount) {
       votersPopup = voters.slice(0, 14).map(vote => (
         <div key={vote.voter}>
-          {<UserLink user={vote.voter} />}
+          { <UserLink user={vote.voter} /> }
 
-          {vote.rshares * ratio > 0.01 && (
-            <span style={{ opacity: '0.5' }}>
-              {' '}
+          { vote.rshares * ratio > 0.001 && (
+            <span>
+              {`\u00A0\u00A0`}
               <DollarDisplay value={vote.rshares * ratio} />
             </span>
           )}
+
+          {
+            <span style={{ opacity: '0.7' }}>
+              {`\u00A0\u2022\u00A0`}
+              <PercentDisplay value={vote.percent / 10000} />
+            </span>
+          }
         </div>
       ));
     }else {