From 4ea543b77e94010c1ce48b69cbc0f495bf990c5b Mon Sep 17 00:00:00 2001
From: Sem <931684+sembrestels@users.noreply.github.com>
Date: Mon, 23 Sep 2024 17:28:03 +0100
Subject: [PATCH] Increment and decrement votes by 10% in the UI

---
 apps/web/src/components/VotingCard.tsx | 21 +++++++++++++++++----
 apps/web/src/hooks/useAllocation.ts    | 19 ++++++++-----------
 2 files changed, 25 insertions(+), 15 deletions(-)

diff --git a/apps/web/src/components/VotingCard.tsx b/apps/web/src/components/VotingCard.tsx
index 852480f..43b1cce 100644
--- a/apps/web/src/components/VotingCard.tsx
+++ b/apps/web/src/components/VotingCard.tsx
@@ -90,7 +90,6 @@ const VotingCard = ({
               </div>
             </div>
             {projects.map((project) => {
-              console.log(totalVotes, votingPower);
               const voteCount = votes[project.account] || 0;
               return (
                 <div
@@ -101,7 +100,12 @@ const VotingCard = ({
                   <div className="flex items-center">
                     <Button
                       disabled={voteCount <= 0}
-                      onClick={() => handleVote(project.account, voteCount - 1)}
+                      onClick={() =>
+                        handleVote(
+                          project.account,
+                          Math.max(0, voteCount - Math.floor(votingPower / 10)),
+                        )
+                      }
                       className="bg-gray-700 w-8 py-1 text-white hover:bg-gray-500 rounded-r-none"
                     >
                       -
@@ -123,14 +127,23 @@ const VotingCard = ({
                           !votes[project.account]) ||
                         totalVotes >= votingPower
                       }
-                      onClick={() => handleVote(project.account, voteCount + 1)}
+                      onClick={() =>
+                        handleVote(
+                          project.account,
+                          voteCount +
+                            Math.min(
+                              votingPower - totalVotes,
+                              Math.floor(votingPower / 10),
+                            ),
+                        )
+                      }
                       className="bg-gray-700 w-8 py-1 text-white hover:bg-gray-500 rounded-l-none"
                     >
                       +
                     </Button>
                     <span className="w-12 text-right">
                       {totalVotes > 0
-                        ? Math.round((voteCount / totalVotes) * 100)
+                        ? Math.round((voteCount / votingPower) * 100)
                         : 0}
                       %
                     </span>
diff --git a/apps/web/src/hooks/useAllocation.ts b/apps/web/src/hooks/useAllocation.ts
index db7f377..89f6388 100644
--- a/apps/web/src/hooks/useAllocation.ts
+++ b/apps/web/src/hooks/useAllocation.ts
@@ -44,18 +44,15 @@ export const useAllocation = (
     enabled: !!council && !!councilMember,
   });
   const allocation = data?.allocations?.[0];
-  if (!allocation) {
-    return { data: undefined, isLoading, votingPower: 0 };
-  }
-  const formattedAllocation: { [grantee: `0x${string}`]: number } =
-    Object.fromEntries(
-      allocation.grantees.map((g, index) => [
-        g.account as `0x${string}`,
-        Number(allocation.amounts[index]),
-      ]),
-    );
   return {
-    data: formattedAllocation,
+    data: allocation
+      ? Object.fromEntries(
+          allocation.grantees.map((g, index) => [
+            g.account as `0x${string}`,
+            Number(allocation.amounts[index]),
+          ]),
+        )
+      : undefined,
     votingPower: Number(data?.councilMember?.votingPower ?? 0),
     isLoading,
   };