From 78df4129180cdc30c2bacbf0fd8ce47e139092e6 Mon Sep 17 00:00:00 2001
From: selankon <selankon@selankon.xyz>
Date: Thu, 10 Oct 2024 12:58:38 +0200
Subject: [PATCH] Split VoteButton logic

---
 .../components/Election/Questions/Fields.tsx    |  5 ++---
 .../src/components/Election/VoteButton.tsx      | 17 +++++++++++++----
 2 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/packages/chakra-components/src/components/Election/Questions/Fields.tsx b/packages/chakra-components/src/components/Election/Questions/Fields.tsx
index 881cafb..fb1a2ff 100644
--- a/packages/chakra-components/src/components/Election/Questions/Fields.tsx
+++ b/packages/chakra-components/src/components/Election/Questions/Fields.tsx
@@ -22,11 +22,10 @@ export const QuestionField = ({ question, index }: QuestionFieldProps) => {
     formState: { errors },
   } = useFormContext()
 
-  const [key, i] = index.split('.')
-
+  const [election, questionI] = index.split('.')
   return (
     <chakra.div __css={styles.question}>
-      <FormControl isInvalid={!!errors[key]?.[Number(i)]}>
+      <FormControl isInvalid={!!errors[election]?.[Number(questionI)]}>
         <chakra.div __css={styles.header}>
           <chakra.label __css={styles.title}>{question.title.default}</chakra.label>
         </chakra.div>
diff --git a/packages/chakra-components/src/components/Election/VoteButton.tsx b/packages/chakra-components/src/components/Election/VoteButton.tsx
index 9b31b10..1e3e54f 100644
--- a/packages/chakra-components/src/components/Election/VoteButton.tsx
+++ b/packages/chakra-components/src/components/Election/VoteButton.tsx
@@ -2,15 +2,24 @@ import { ButtonProps } from '@chakra-ui/button'
 import { Text } from '@chakra-ui/layout'
 import { chakra, useMultiStyleConfig } from '@chakra-ui/system'
 import { Signer } from '@ethersproject/abstract-signer'
-import { useClient, useElection } from '@vocdoni/react-providers'
+import { ElectionState, useClient, useElection } from '@vocdoni/react-providers'
 import { ElectionStatus, InvalidElection, PublishedElection } from '@vocdoni/sdk'
-import { useContext, useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { Button } from '../layout/Button'
 import { results } from './Results'
-import { MultiElectionsContext } from './Questions/MultiElectionContext'
 import { DefaultElectionFormId } from './Questions'
 
 export const VoteButton = (props: ButtonProps) => {
+  const election = useElection()
+  return <VoteButtonLogic {...props} electionState={election} />
+}
+
+export const VoteButtonLogic = ({
+  electionState,
+  ...props
+}: {
+  electionState: ElectionState
+} & ButtonProps) => {
   const { connected } = useClient()
   const {
     client,
@@ -23,7 +32,7 @@ export const VoteButton = (props: ButtonProps) => {
     localize,
     sik: { signature },
     sikSignature,
-  } = useElection()
+  } = electionState
   const [loading, setLoading] = useState<boolean>(false)
 
   if (!election || election instanceof InvalidElection) {