Merge pull request #770 from Prop-House/snca-add-metadata-to-votes

Display proposal title vote activity item
prop-house · Jan 26, 2024 · ecccde0 · ecccde0
2 parents f389350 + 1f4c749
commit ecccde0
Show file tree

Hide file tree

Showing 6 changed files with 73 additions and 33 deletions.
diff --git a/packages/prop-house-webapp/package.json b/packages/prop-house-webapp/package.json
@@ -10,7 +10,7 @@
     "@fortawesome/react-fontawesome": "^0.1.17",
     "@nouns/prop-house-wrapper": "1.0.0",
     "@prophouse/protocol": "1.0.6",
-    "@prophouse/sdk-react": "1.0.18",
+    "@prophouse/sdk-react": "1.0.21",
     "@rainbow-me/rainbowkit": "^1.3.0",
     "@reduxjs/toolkit": "^1.7.0",
     "@supabase/supabase-js": "^2.39.0",

diff --git a/packages/prop-house-webapp/src/components/ActivityFeed/index.tsx b/packages/prop-house-webapp/src/components/ActivityFeed/index.tsx
@@ -10,7 +10,6 @@ import {
 import { useEffect, useState } from 'react';
 import { Col, Row } from 'react-bootstrap';
 import Button, { ButtonColor } from '../Button';
-import { lumpVotes } from '../../utils/lumpVotes';
 import Skeleton from 'react-loading-skeleton';
 import ActivityFeedItem from '../ActivityFeedItem';
 
@@ -33,13 +32,11 @@ const ActivityFeed: React.FC<{}> = () => {
       try {
         setFetchMoreActivity(false);
 
-        const votes = lumpVotes(
-          await propHouse.query.getVotes({
-            page: votesPageIndex,
-            orderBy: Vote_Order_By.ReceivedAt,
-            orderDirection: OrderDirection.Desc,
-          }),
-        );
+        const votes = await propHouse.query.getVotes({
+          page: votesPageIndex,
+          orderBy: Vote_Order_By.ReceivedAt,
+          orderDirection: OrderDirection.Desc,
+        });
 
         votes.length === 0 ? setEndOfVotes(true) : setVotesPageIndex(prev => prev + 1);
 

diff --git a/packages/prop-house-webapp/src/components/ActivityFeedItem/ActivityFeedItem.module.css b/packages/prop-house-webapp/src/components/ActivityFeedItem/ActivityFeedItem.module.css
@@ -14,8 +14,8 @@
   min-width: 2.5rem;
 }
 .activityItem .address {
-  font-size: 16px;
-  font-weight: medium;
+  font-size: 14px;
+  font-weight: bold;
   color: var(--brand-black);
 }
 .activityItem .activityContent {

diff --git a/packages/prop-house-webapp/src/components/ActivityFeedItem/index.tsx b/packages/prop-house-webapp/src/components/ActivityFeedItem/index.tsx
@@ -2,25 +2,10 @@ import classes from './ActivityFeedItem.module.css';
 import { Proposal, Vote } from '@prophouse/sdk-react';
 import EthAddress from '../EthAddress';
 import { timeFromNow } from '../../utils/timeFromNow';
-import { parsedVotingPower } from '../../utils/parsedVotingPower';
 import PropActivityItem from '../PropActivityItem';
-import { truncateThousands } from '../../utils/truncateThousands';
+import VoteActivityItem from '../VoteActivityItem';
 
 const ActivityFeedItem: React.FC<{ item: Proposal | Vote }> = ({ item }) => {
-  const activityContent = (item: Proposal | Vote) => {
-    let votes = parsedVotingPower(item.votingPower, item.round);
-
-    return 'proposer' in item ? (
-      <PropActivityItem proposal={item} />
-    ) : (
-      <>
-        cast&nbsp;
-        {votes.gte(1000) ? truncateThousands(votes.toNumber()) : votes.toString()}
-        &nbsp;vote{votes.eq(1) ? '' : 's'}
-      </>
-    );
-  };
-
   return (
     <div className={classes.activityItem} style={{ cursor: 'proposer' in item ? 'pointer' : '' }}>
       <div className={classes.header}>
@@ -32,7 +17,13 @@ const ActivityFeedItem: React.FC<{ item: Proposal | Vote }> = ({ item }) => {
         />
         <div className={classes.timestamp}>{timeFromNow(item.receivedAt * 1000)}</div>
       </div>
-      <div className={classes.activityContent}>{activityContent(item)}</div>
+      <div className={classes.activityContent}>
+        {'proposer' in item ? (
+          <PropActivityItem proposal={item} />
+        ) : (
+          <VoteActivityItem vote={item} />
+        )}
+      </div>
     </div>
   );
 };

diff --git a/packages/prop-house-webapp/src/components/VoteActivityItem/index.tsx b/packages/prop-house-webapp/src/components/VoteActivityItem/index.tsx
@@ -0,0 +1,21 @@
+import { Vote } from '@prophouse/sdk-react';
+import { useNavigate } from 'react-router-dom';
+import { parsedVotingPower } from '../../utils/parsedVotingPower';
+import { truncateThousands } from '../../utils/truncateThousands';
+
+const VoteActivityItem: React.FC<{ vote: Vote }> = ({ vote }) => {
+  const navigate = useNavigate();
+  let votes = parsedVotingPower(vote.votingPower, vote.round);
+
+  return (
+    <div style={{ cursor: 'pointer' }} onClick={() => navigate(`/${vote.round}`)}>
+      {`cast `}
+      <b>{` ${votes.gte(1000) ? truncateThousands(votes.toNumber()) : votes.toString()} vote${
+        votes.eq(1) ? '' : 's'
+      }`}</b>
+      {` for ${vote.proposalTitle}`}
+    </div>
+  );
+};
+
+export default VoteActivityItem;
diff --git a/yarn.lock b/yarn.lock
@@ -5985,12 +5985,12 @@
   dependencies:
     ethers "~5.7.2"
 
-"@prophouse/[email protected].18":
-  version "1.0.18"
-  resolved "https://registry.yarnpkg.com/@prophouse/sdk-react/-/sdk-react-1.0.18.tgz#a8874acae62814cd57123e1eee21fcb4dfc62069"
-  integrity sha512-Lk1Zek/vuvNEF8Cr/SmTSnoMjeQeFav94NCyWDbo3/javQfwZzH6L6RZAKXr7+mR662SWh38woXKgB6E3yGdcg==
+"@prophouse/[email protected].21":
+  version "1.0.21"
+  resolved "https://registry.yarnpkg.com/@prophouse/sdk-react/-/sdk-react-1.0.21.tgz#eea3111122aac89a45ae6154aa2f8071b3af72f8"
+  integrity sha512-Zr6CcORAynv8kr0O8D5cAckZC8jifTT+P1UbwyUbauWDnlUepa9VlCWDzS2gkF5K7qzwqX3Gb/rpYBKQW99KrA==
   dependencies:
-    "@prophouse/sdk" "1.0.24"
+    "@prophouse/sdk" "1.0.27"
 
 "@prophouse/[email protected]":
   version "1.0.24"
@@ -6023,6 +6023,37 @@
     starknet "5.19.5"
     time-ts "^0.1.0"
 
+"@prophouse/[email protected]":
+  version "1.0.27"
+  resolved "https://registry.yarnpkg.com/@prophouse/sdk/-/sdk-1.0.27.tgz#06fec2c4ca07a7ec9cf144621925f6d21cce4070"
+  integrity sha512-lQoa0S3fqty4ccYJ0EJoklRU3812SB3dSmR4xmw/qExCndkuqswndHzt/dZLHQwdZFJy8oHUZ1ac3TKB2SRgiw==
+  dependencies:
+    "@ethersproject/abi" "~5.7.0"
+    "@ethersproject/abstract-provider" "~5.7.0"
+    "@ethersproject/abstract-signer" "~5.7.0"
+    "@ethersproject/address" "~5.7.0"
+    "@ethersproject/bignumber" "~5.7.0"
+    "@ethersproject/bytes" "~5.7.0"
+    "@ethersproject/constants" "~5.7.0"
+    "@ethersproject/contracts" "~5.7.0"
+    "@ethersproject/keccak256" "~5.7.0"
+    "@ethersproject/providers" "~5.7.0"
+    "@ethersproject/solidity" "~5.7.0"
+    "@ethersproject/strings" "~5.7.0"
+    "@ethersproject/wallet" "^5.7.0"
+    "@pinata/sdk" "^2.1.0"
+    "@prophouse/protocol" "1.0.8"
+    bn.js "^5.2.1"
+    ethereumjs-fork-block "^4.2.4"
+    ethereumjs-fork-common "^3.1.3"
+    graphql "^16.5.0"
+    graphql-request "5.0.0"
+    merkletreejs "^0.3.11"
+    micro-starknet "^0.2.3"
+    randombytes "^2.1.0"
+    starknet "5.19.5"
+    time-ts "^0.1.0"
+
 "@protobufjs/aspromise@^1.1.1", "@protobufjs/aspromise@^1.1.2":
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/@protobufjs/aspromise/-/aspromise-1.1.2.tgz#9b8b0cc663d669a7d8f6f5d0893a14d348f30fbf"