Simplify useGaslessCommiteVotes

src/containers/votingTerminal/gaslessVotingTerminal.tsx

@@ -58,8 +58,8 @@ export const GaslessVotingTerminal: React.FC<GaslessVotingTerminalProps> = ({
 
   const {
     canApprove,
-    approved,
-    isApproved,
+    isUserApproved,
+    isProposalApproved,
     canBeExecuted,
     executableWithNextApproval,
     isApprovalPeriod,
@@ -110,8 +110,8 @@ export const GaslessVotingTerminal: React.FC<GaslessVotingTerminalProps> = ({
     if (proposal) {
       return getCommitteVoteButtonLabel(
         notBegan,
-        approved,
-        isApproved,
+        isUserApproved,
+        isProposalApproved,
         isApprovalPeriod,
         executableWithNextApproval,
         t
@@ -120,8 +120,8 @@ export const GaslessVotingTerminal: React.FC<GaslessVotingTerminalProps> = ({
   }, [
     proposal,
     notBegan,
-    approved,
-    isApproved,
+    isUserApproved,
+    isProposalApproved,
     isApprovalPeriod,
     executableWithNextApproval,
     t,
@@ -131,7 +131,7 @@ export const GaslessVotingTerminal: React.FC<GaslessVotingTerminalProps> = ({
   // todo(kon): Should be refactored to use the same logic as the proposal page (using stateRef)
   const {voteNowDisabled, onClick} = useMemo(() => {
     // disable voting on non-active proposals or when wallet has voted or can't vote
-    if (!isApprovalPeriod || !canApprove || approved) {
+    if (!isApprovalPeriod || !canApprove || isUserApproved) {
       return {voteNowDisabled: true};
     }
 
@@ -172,7 +172,7 @@ export const GaslessVotingTerminal: React.FC<GaslessVotingTerminalProps> = ({
   }, [
     isApprovalPeriod,
     canApprove,
-    approved,
+    isUserApproved,
     address,
     isOnWrongNetwork,
     statusRef,
@@ -214,20 +214,11 @@ export const GaslessVotingTerminal: React.FC<GaslessVotingTerminalProps> = ({
       isApprovalPeriod && // active proposal
       address && // logged in
       !isOnWrongNetwork && // on proper network
-      !canApprove && // cannot vote
-      !approved // Already voted
+      !canApprove // cannot vote
     ) {
       return t('votingTerminal.status.ineligibleWhitelist');
     }
-  }, [
-    isApprovalPeriod,
-    proposal,
-    address,
-    isOnWrongNetwork,
-    canApprove,
-    approved,
-    t,
-  ]);
+  }, [isApprovalPeriod, proposal, address, isOnWrongNetwork, canApprove, t]);
 
   const ApprovalVotingTerminal = () => {
     return (

src/context/useGaslessVoting.tsx

@@ -162,26 +162,27 @@ export const useGaslessCommiteVotes = (
   const isApprovalPeriod = (proposal => {
     if (!proposal || proposal.status !== 'Active') return false;
     return (
-      proposal.endDate.valueOf() < new Date().valueOf() &&
-      proposal.tallyEndDate.valueOf() > new Date().valueOf()
+      (proposal.endDate.valueOf() < new Date().valueOf() &&
+        proposal.tallyEndDate.valueOf() > new Date().valueOf() &&
+        proposal?.canBeApproved) ??
+      false
     );
   })(proposal);
 
-  const proposalCanBeApproved = isApprovalPeriod && proposal.canBeApproved;
-  const approved = useMemo(() => {
+  const isUserApproved = useMemo(() => {
     return proposal.approvers?.some(
       approver => approver.toLowerCase() === address?.toLowerCase()
     );
   }, [address, proposal.approvers]);
 
-  const isApproved = (proposal => {
+  const isProposalApproved = (proposal => {
     if (!proposal) return false;
     return proposal.settings.minTallyApprovals <= proposal.approvers.length;
   })(proposal);
 
   const canBeExecuted = (proposal => {
     if (!client || !proposal || proposal.status !== 'Active') return false;
-    return isApproved && proposalCanBeApproved;
+    return isProposalApproved && isApprovalPeriod;
   })(proposal);
 
   const executed = proposal.executed;
@@ -206,27 +207,19 @@ export const useGaslessCommiteVotes = (
       return;
     }
 
-    if (approved || !isApprovalPeriod || !proposalCanBeApproved) {
+    if (isUserApproved || !isApprovalPeriod) {
       setCanApprove(false);
       return;
     }
-    checkCanVote();
-  }, [
-    address,
-    client,
-    isApprovalPeriod,
-    pluginAddress,
-    proposalCanBeApproved,
-    approved,
-  ]);
+    void checkCanVote();
+  }, [address, client, isApprovalPeriod, pluginAddress, isUserApproved]);
 
   return {
     isApprovalPeriod,
     canApprove,
-    approved,
-    isApproved,
+    isUserApproved,
+    isProposalApproved,
     canBeExecuted,
-    proposalCanBeApproved,
     executableWithNextApproval,
     executed,
     notBegan,