From 886b71fd0fa50bcb4926d51d4c7ef1f1f5cce91c Mon Sep 17 00:00:00 2001
From: Max Daunarovich <max.daunarovich@gmail.com>
Date: Thu, 5 Sep 2019 19:30:22 +0300
Subject: [PATCH 1/4] Store voting history in local storage

---
 src/App.js                                |  1 +
 src/MainPage.js                           |  9 ++---
 src/volt/components/Footer/index.js       | 10 ++++--
 src/volt/components/Footer/styles.js      | 14 +++++---
 src/volt/components/VoteControls/index.js | 42 ++++++++++++++++++++++-
 5 files changed, 62 insertions(+), 14 deletions(-)

diff --git a/src/App.js b/src/App.js
index f0dc59da0..87db7a01b 100644
--- a/src/App.js
+++ b/src/App.js
@@ -883,6 +883,7 @@ export default class App extends Component {
                     favorites={favorites}
                     voteStartTime={voteStartTime}
                     voteEndTime={voteEndTime}
+                    account={account}
                   />
                 )} />
 
diff --git a/src/MainPage.js b/src/MainPage.js
index 64bd2b368..6eb71208e 100644
--- a/src/MainPage.js
+++ b/src/MainPage.js
@@ -18,6 +18,7 @@ export default function MainPage({
   favorites,
   voteStartTime,
   voteEndTime,
+  account
 }) {
   const filteredList = React.useMemo(() => {
     const sortFunctions = {
@@ -60,12 +61,8 @@ export default function MainPage({
       <Footer
         voteStartTime={voteStartTime}
         voteEndTime={voteEndTime}
-        history={[
-          { id: "EA001", votes: 2 },
-          { id: "EA003", votes: 4 },
-          { id: "EA002", votes: 1 }
-        ]}
+        account={account}
       />
     </>
   );
-}
\ No newline at end of file
+}
diff --git a/src/volt/components/Footer/index.js b/src/volt/components/Footer/index.js
index 20817e2e1..94ebb5528 100644
--- a/src/volt/components/Footer/index.js
+++ b/src/volt/components/Footer/index.js
@@ -1,12 +1,18 @@
 import React from "react";
 import { FooterContainer, History, Timer } from "./styles";
+import {getStoredValue} from "../../../services/localStorage";
 
 const Footer = (props) => {
-  const { history } = props;
+  const { account } = props;
+
+  // TODO: Need optimization with use of state or context
+  const prevValues = getStoredValue("votesHistory", account);
+  const parsedHistory = prevValues ? JSON.parse(prevValues) : [];
+
+  const history = parsedHistory.reverse().slice(3);
   return (
     <FooterContainer>
       <History history={history} />
-      <Timer {...props} />
     </FooterContainer>
   );
 };
diff --git a/src/volt/components/Footer/styles.js b/src/volt/components/Footer/styles.js
index 98fae3d60..bf6a0dd72 100644
--- a/src/volt/components/Footer/styles.js
+++ b/src/volt/components/Footer/styles.js
@@ -45,19 +45,23 @@ export const History = ({ history }) => {
   return (
     <HistoryContainer>
       <HistoryTitle>Voice History</HistoryTitle>
-      {history.map(item => {
+      {history.length > 0 ?
+      history.map(item => {
+        const {votes, proposalId, timestamp} = item;
         let suffix = "Voice Credit";
-        if (item.votes !== 1) {
+        if (Math.abs(votes) !== 1 ) {
           suffix += "s";
         }
         const t = `${item.votes} ${suffix}`;
 
         return (
-          <HistoryItem key={item.id}>
-            <span>{item.id}</span> {t}
+          <HistoryItem key={timestamp}>
+            <span>{proposalId}</span> {t}
           </HistoryItem>
         );
-      })}
+      })
+        : <Text color={"voltBrandWhite"} opacity={0.6}>No votes casted</Text>
+      }
     </HistoryContainer>
   );
 };
diff --git a/src/volt/components/VoteControls/index.js b/src/volt/components/VoteControls/index.js
index c04746517..df19034ca 100644
--- a/src/volt/components/VoteControls/index.js
+++ b/src/volt/components/VoteControls/index.js
@@ -67,6 +67,8 @@ class VoteControls extends Component {
     this.submitVote = this.submitVote.bind(this);
     this.withdrawVote = this.withdrawVote.bind(this);
 
+    this.storeVotingAction = this.storeVotingAction.bind(this);
+
     const treeData = this.getDataFromTree();
     this.state = {
       expanded: false,
@@ -404,6 +406,13 @@ class VoteControls extends Component {
       console.log({receipt});
       this.writeDataToTree(newVotesTotal, newNumOfVotes);
 
+      // Store voting action in history
+      this.storeVotingAction({
+        type: "cast",
+        votes: sign * newVotesTotal,
+        balanceCard,
+      });
+
       this.setProgressState(false);
       this.setReceiptState(true);
     } catch (error) {
@@ -519,7 +528,8 @@ class VoteControls extends Component {
       const treeData = this.getDataFromTree();
       console.log({treeData});
 
-      const currentVotes = utils.parseEther(castedVotes.toString());
+      const votes = castedVotes.toString();
+      const currentVotes = utils.parseEther(votes);
 
       const data = this.cookWithdrawParams(balanceCard.id, currentVotes);
 
@@ -547,6 +557,13 @@ class VoteControls extends Component {
 
       this.writeDataToTree(0, zeroVotes);
 
+      // Store voting action in history
+      this.storeVotingAction({
+        type: "withdraw",
+        votes,
+        balanceCard,
+      });
+
       this.setProgressState(false);
       this.setReceiptState(true);
 
@@ -601,6 +618,29 @@ class VoteControls extends Component {
     });
   }
 
+  storeVotingAction(params){
+    const { account , proposal } = this.props;
+    const { proposalId } = proposal;
+    const { type, votes, balanceCard } = params;
+    const timestamp = new Date();
+
+    // TODO: We shall use balance card id, but needed quick solution
+    // const { id } = balanceCard;
+    const id = account;
+
+    const prevValues = getStoredValue("votesHistory", id);
+    const parsedHistory = prevValues ? JSON.parse(prevValues) : [];
+    parsedHistory.push({
+      type,
+      votes,
+      proposalId,
+      timestamp
+    });
+    const history = JSON.stringify(parsedHistory);
+
+    storeValues({history}, id);
+  }
+
   render() {
     const { expanded, votes, choice } = this.state;
     const { showReceipt, showProgress } = this.state;

From d94df038d598bb37a79f79e820f0f8b6931177eb Mon Sep 17 00:00:00 2001
From: Max Daunarovich <max.daunarovich@gmail.com>
Date: Thu, 5 Sep 2019 19:39:36 +0300
Subject: [PATCH 2/4] Take first 3

---
 src/volt/components/Footer/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/volt/components/Footer/index.js b/src/volt/components/Footer/index.js
index 94ebb5528..dacabe1dc 100644
--- a/src/volt/components/Footer/index.js
+++ b/src/volt/components/Footer/index.js
@@ -8,8 +8,8 @@ const Footer = (props) => {
   // TODO: Need optimization with use of state or context
   const prevValues = getStoredValue("votesHistory", account);
   const parsedHistory = prevValues ? JSON.parse(prevValues) : [];
+  const history = parsedHistory.reverse().slice(0, 3);
 
-  const history = parsedHistory.reverse().slice(3);
   return (
     <FooterContainer>
       <History history={history} />

From 4a0fc26a2378b7fcb120a39b7c9d8fba4cc4368e Mon Sep 17 00:00:00 2001
From: Max Daunarovich <max.daunarovich@gmail.com>
Date: Thu, 5 Sep 2019 19:39:51 +0300
Subject: [PATCH 3/4] Render history item in different way

---
 src/volt/components/Footer/styles.js | 31 ++++++++++++++--------------
 1 file changed, 15 insertions(+), 16 deletions(-)

diff --git a/src/volt/components/Footer/styles.js b/src/volt/components/Footer/styles.js
index bf6a0dd72..b67ada7e8 100644
--- a/src/volt/components/Footer/styles.js
+++ b/src/volt/components/Footer/styles.js
@@ -29,8 +29,7 @@ export const HistoryItem = styled(Text).attrs(() => ({
 }))`
   & span {
     font-weight: bold;
-    &:before {
-      content: ">";
+    i {
       margin-right: 4px;
     }
     &:after {
@@ -46,20 +45,20 @@ export const History = ({ history }) => {
     <HistoryContainer>
       <HistoryTitle>Voice History</HistoryTitle>
       {history.length > 0 ?
-      history.map(item => {
-        const {votes, proposalId, timestamp} = item;
-        let suffix = "Voice Credit";
-        if (Math.abs(votes) !== 1 ) {
-          suffix += "s";
-        }
-        const t = `${item.votes} ${suffix}`;
-
-        return (
-          <HistoryItem key={timestamp}>
-            <span>{proposalId}</span> {t}
-          </HistoryItem>
-        );
-      })
+        history.map(item => {
+          const {type, votes, proposalId, timestamp} = item;
+          let suffix = "Voice Credit";
+          if (Math.abs(votes) !== 1 ) {
+            suffix += "s";
+          }
+          const t = `${item.votes} ${suffix}`;
+          const prefix = type === "cast" ? ">" : "<";
+          return (
+            <HistoryItem key={timestamp}>
+              <span><i>{prefix}</i>{proposalId}</span> {t}
+            </HistoryItem>
+          );
+        })
         : <Text color={"voltBrandWhite"} opacity={0.6}>No votes casted</Text>
       }
     </HistoryContainer>

From 698b04765d71ee33ceaa51efb903d810591503e0 Mon Sep 17 00:00:00 2001
From: Max Daunarovich <max.daunarovich@gmail.com>
Date: Thu, 5 Sep 2019 19:40:07 +0300
Subject: [PATCH 4/4] Store int representation of votes

---
 src/volt/components/VoteControls/index.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/volt/components/VoteControls/index.js b/src/volt/components/VoteControls/index.js
index df19034ca..05a2b1538 100644
--- a/src/volt/components/VoteControls/index.js
+++ b/src/volt/components/VoteControls/index.js
@@ -560,7 +560,7 @@ class VoteControls extends Component {
       // Store voting action in history
       this.storeVotingAction({
         type: "withdraw",
-        votes,
+        votes: parseInt(votes),
         balanceCard,
       });
 
@@ -636,9 +636,9 @@ class VoteControls extends Component {
       proposalId,
       timestamp
     });
-    const history = JSON.stringify(parsedHistory);
+    const votesHistory = JSON.stringify(parsedHistory);
 
-    storeValues({history}, id);
+    storeValues({votesHistory}, id);
   }
 
   render() {