From 31df995d6a786e2b0e7e56c1bebab89448ffc865 Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Thu, 13 Feb 2025 12:03:34 +0530
Subject: [PATCH 01/10] refactor(sdk): allow-custom-description-for-rta

---
 .../src/dataMappings/utils/populateTemplate.ts      | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/kleros-sdk/src/dataMappings/utils/populateTemplate.ts b/kleros-sdk/src/dataMappings/utils/populateTemplate.ts
index a70668ab7..7797f0ff9 100644
--- a/kleros-sdk/src/dataMappings/utils/populateTemplate.ts
+++ b/kleros-sdk/src/dataMappings/utils/populateTemplate.ts
@@ -11,9 +11,18 @@ export const populateTemplate = (mustacheTemplate: string, data: any): DisputeDe
     throw validation.error;
   }
 
-  // Filter out any existing answer with id 0 and add our standard Refuse to Arbitrate option
+  const templateRTAAnswer = (dispute as DisputeDetails).answers.find(
+    (answer) => answer.id && BigInt(answer.id) === BigInt(0)
+  );
+
+  const CustomRTA: DisputeDetails["answers"][number] = {
+    ...RefuseToArbitrateAnswer,
+    description: templateRTAAnswer?.description ?? RefuseToArbitrateAnswer.description,
+  };
+
+  // Filter out any existing answer with id 0 and add customised Refuse to Arbitrate option
   (dispute as DisputeDetails).answers = [
-    RefuseToArbitrateAnswer,
+    CustomRTA,
     ...((dispute as DisputeDetails).answers.filter((answer) => answer.id && BigInt(answer.id) !== BigInt(0)) || []),
   ];
 

From 6d752f3dd0f958ddb3526a58e9b610afd8cd91a1 Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Thu, 13 Feb 2025 12:15:36 +0530
Subject: [PATCH 02/10] refactor(web):
 hide-default-rta-option-if-alrd-shown-in-options

---
 .../Voting/Classic/OptionsContainer.tsx       | 32 ++++++++++++-------
 1 file changed, 20 insertions(+), 12 deletions(-)

diff --git a/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx b/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
index e3c4e2744..08186b682 100644
--- a/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
+++ b/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from "react";
+import React, { useCallback, useMemo, useState } from "react";
 import styled from "styled-components";
 
 import ReactMarkdown from "react-markdown";
@@ -53,6 +53,12 @@ const Options: React.FC<IOptions> = ({ arbitrable, handleSelection, justificatio
   const [chosenOption, setChosenOption] = useState(BigInt(-1));
   const [isSending, setIsSending] = useState(false);
 
+  // if RTA not found in dispute.answers, show RTA. shows RTA in case of invalid dispute too
+  const showRTA = useMemo(
+    () => isUndefined(disputeDetails?.answers.find((answer) => BigInt(answer.id) === BigInt(0))),
+    [disputeDetails]
+  );
+
   const onClick = useCallback(
     async (id: bigint) => {
       setIsSending(true);
@@ -86,17 +92,19 @@ const Options: React.FC<IOptions> = ({ arbitrable, handleSelection, justificatio
           })}
         </OptionsContainer>
       </MainContainer>
-      <RefuseToArbitrateContainer>
-        <EnsureChain>
-          <Button
-            variant="secondary"
-            text="Refuse to Arbitrate"
-            disabled={isSending}
-            isLoading={chosenOption === BigInt(0)}
-            onClick={() => onClick(BigInt(0))}
-          />
-        </EnsureChain>
-      </RefuseToArbitrateContainer>
+      {showRTA ? (
+        <RefuseToArbitrateContainer>
+          <EnsureChain>
+            <Button
+              variant="secondary"
+              text="Refuse to Arbitrate"
+              disabled={isSending}
+              isLoading={chosenOption === BigInt(0)}
+              onClick={() => onClick(BigInt(0))}
+            />
+          </EnsureChain>
+        </RefuseToArbitrateContainer>
+      ) : null}
     </>
   ) : null;
 };

From e34ed7afe6c7cd6d3cac940292759a64af51b3d9 Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Thu, 13 Feb 2025 12:19:03 +0530
Subject: [PATCH 03/10] refactor(web): single-ensure-chain-button

---
 .../Voting/Classic/OptionsContainer.tsx       | 21 ++++++++++++-------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx b/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
index 08186b682..261ee6e93 100644
--- a/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
+++ b/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
@@ -17,6 +17,8 @@ import { Answer } from "@kleros/kleros-sdk";
 const MainContainer = styled.div`
   width: 100%;
   height: auto;
+  display: flex;
+  flex-direction: column;
 `;
 
 const OptionsContainer = styled.div`
@@ -40,6 +42,9 @@ const RefuseToArbitrateContainer = styled.div`
   justify-content: center;
 `;
 
+const StyledEnsureChain = styled(EnsureChain)`
+  align-self: center;
+`;
 interface IOptions {
   arbitrable: `0x${string}`;
   handleSelection: (arg0: bigint) => Promise<void>;
@@ -77,20 +82,20 @@ const Options: React.FC<IOptions> = ({ arbitrable, handleSelection, justificatio
         {!isUndefined(justification) && !isUndefined(setJustification) ? (
           <JustificationArea {...{ justification, setJustification }} />
         ) : null}
-        <OptionsContainer>
-          {disputeDetails?.answers?.map((answer: Answer) => {
-            return (
-              <EnsureChain key={answer.title}>
+        <StyledEnsureChain>
+          <OptionsContainer>
+            {disputeDetails?.answers?.map((answer: Answer) => {
+              return (
                 <Button
                   text={answer.title}
                   disabled={isSending}
                   isLoading={chosenOption === BigInt(answer.id)}
                   onClick={() => onClick(BigInt(answer.id))}
                 />
-              </EnsureChain>
-            );
-          })}
-        </OptionsContainer>
+              );
+            })}
+          </OptionsContainer>
+        </StyledEnsureChain>
       </MainContainer>
       {showRTA ? (
         <RefuseToArbitrateContainer>

From 07c46dc5811fb719e408f907637d42dd1918339b Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Thu, 13 Feb 2025 12:20:57 +0530
Subject: [PATCH 04/10] feat(web): show-answer-description-in-tooltip

---
 .../Voting/Classic/OptionsContainer.tsx          | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx b/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
index 261ee6e93..715233130 100644
--- a/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
+++ b/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
@@ -4,7 +4,7 @@ import styled from "styled-components";
 import ReactMarkdown from "react-markdown";
 import { useParams } from "react-router-dom";
 
-import { Button } from "@kleros/ui-components-library";
+import { Button, Tooltip } from "@kleros/ui-components-library";
 
 import { usePopulatedDisputeData } from "hooks/queries/usePopulatedDisputeData";
 import { isUndefined } from "utils/index";
@@ -86,12 +86,14 @@ const Options: React.FC<IOptions> = ({ arbitrable, handleSelection, justificatio
           <OptionsContainer>
             {disputeDetails?.answers?.map((answer: Answer) => {
               return (
-                <Button
-                  text={answer.title}
-                  disabled={isSending}
-                  isLoading={chosenOption === BigInt(answer.id)}
-                  onClick={() => onClick(BigInt(answer.id))}
-                />
+                <Tooltip text={answer.description} key={answer.title}>
+                  <Button
+                    text={answer.title}
+                    disabled={isSending}
+                    isLoading={chosenOption === BigInt(answer.id)}
+                    onClick={() => onClick(BigInt(answer.id))}
+                  />
+                </Tooltip>
               );
             })}
           </OptionsContainer>

From decdda8f4696181d3985d7134d5d2eea39035ea8 Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Thu, 13 Feb 2025 12:25:00 +0530
Subject: [PATCH 05/10] refactor(web): chain-check-for-reveal-button

---
 .../CaseDetails/Voting/Classic/Reveal.tsx     | 21 ++++++++++++-------
 1 file changed, 14 insertions(+), 7 deletions(-)

diff --git a/web/src/pages/Cases/CaseDetails/Voting/Classic/Reveal.tsx b/web/src/pages/Cases/CaseDetails/Voting/Classic/Reveal.tsx
index 5b45bc100..8d4818b21 100644
--- a/web/src/pages/Cases/CaseDetails/Voting/Classic/Reveal.tsx
+++ b/web/src/pages/Cases/CaseDetails/Voting/Classic/Reveal.tsx
@@ -21,6 +21,7 @@ import InfoCard from "components/InfoCard";
 
 import JustificationArea from "./JustificationArea";
 import { Answer } from "@kleros/kleros-sdk";
+import { EnsureChain } from "components/EnsureChain";
 
 const Container = styled.div`
   width: 100%;
@@ -35,6 +36,10 @@ const StyledButton = styled(Button)`
   margin: 16px auto;
 `;
 
+const StyledEnsureChain = styled(EnsureChain)`
+  margin: 8px auto;
+`;
+
 const ReactMarkdownWrapper = styled.div``;
 interface IReveal {
   arbitrable: `0x${string}`;
@@ -106,13 +111,15 @@ const Reveal: React.FC<IReveal> = ({ arbitrable, voteIDs, setIsOpen, commit, isR
             <ReactMarkdown>{disputeDetails?.question ?? ""}</ReactMarkdown>
           </ReactMarkdownWrapper>
           <JustificationArea {...{ justification, setJustification }} />
-          <StyledButton
-            variant="secondary"
-            text="Justify & Reveal"
-            disabled={isSending || isUndefined(disputeDetails)}
-            isLoading={isSending}
-            onClick={handleReveal}
-          />
+          <StyledEnsureChain>
+            <StyledButton
+              variant="secondary"
+              text="Justify & Reveal"
+              disabled={isSending || isUndefined(disputeDetails)}
+              isLoading={isSending}
+              onClick={handleReveal}
+            />
+          </StyledEnsureChain>
         </>
       ) : (
         <StyledInfoCard msg="Your vote was successfully commited, please wait until reveal period to reveal it." />

From 0676d67cf89ddb011214ef83c9e05b0892479654 Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Thu, 13 Feb 2025 12:29:14 +0530
Subject: [PATCH 06/10] refactor(web): hide-switch-chain-for-invalid-dispute

---
 .../Voting/Classic/OptionsContainer.tsx       | 36 ++++++++++---------
 1 file changed, 19 insertions(+), 17 deletions(-)

diff --git a/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx b/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
index 715233130..bafbf18bd 100644
--- a/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
+++ b/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
@@ -60,7 +60,7 @@ const Options: React.FC<IOptions> = ({ arbitrable, handleSelection, justificatio
 
   // if RTA not found in dispute.answers, show RTA. shows RTA in case of invalid dispute too
   const showRTA = useMemo(
-    () => isUndefined(disputeDetails?.answers.find((answer) => BigInt(answer.id) === BigInt(0))),
+    () => isUndefined(disputeDetails?.answers?.find((answer) => BigInt(answer.id) === BigInt(0))),
     [disputeDetails]
   );
 
@@ -82,22 +82,24 @@ const Options: React.FC<IOptions> = ({ arbitrable, handleSelection, justificatio
         {!isUndefined(justification) && !isUndefined(setJustification) ? (
           <JustificationArea {...{ justification, setJustification }} />
         ) : null}
-        <StyledEnsureChain>
-          <OptionsContainer>
-            {disputeDetails?.answers?.map((answer: Answer) => {
-              return (
-                <Tooltip text={answer.description} key={answer.title}>
-                  <Button
-                    text={answer.title}
-                    disabled={isSending}
-                    isLoading={chosenOption === BigInt(answer.id)}
-                    onClick={() => onClick(BigInt(answer.id))}
-                  />
-                </Tooltip>
-              );
-            })}
-          </OptionsContainer>
-        </StyledEnsureChain>
+        {isUndefined(disputeDetails?.answers) ? null : (
+          <StyledEnsureChain>
+            <OptionsContainer>
+              {disputeDetails?.answers?.map((answer: Answer) => {
+                return (
+                  <Tooltip text={answer.description} key={answer.title}>
+                    <Button
+                      text={answer.title}
+                      disabled={isSending}
+                      isLoading={chosenOption === BigInt(answer.id)}
+                      onClick={() => onClick(BigInt(answer.id))}
+                    />
+                  </Tooltip>
+                );
+              })}
+            </OptionsContainer>
+          </StyledEnsureChain>
+        )}
       </MainContainer>
       {showRTA ? (
         <RefuseToArbitrateContainer>

From 1b152ac86c8901b8c29323b88b8aa2d06b5144a4 Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Thu, 13 Feb 2025 12:38:37 +0530
Subject: [PATCH 07/10] refactor(web):
 show-human-readable-title-for-rta-in-invalid-dispute

---
 web/src/utils/getVoteChoice.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/web/src/utils/getVoteChoice.ts b/web/src/utils/getVoteChoice.ts
index 9e5543bca..d2d58d2fb 100644
--- a/web/src/utils/getVoteChoice.ts
+++ b/web/src/utils/getVoteChoice.ts
@@ -1,5 +1,6 @@
 import { Answer } from "@kleros/kleros-sdk";
 import { isUndefined } from ".";
+import { RefuseToArbitrateAnswer } from "@kleros/kleros-sdk/src/dataMappings/utils/disputeDetailsSchema";
 
 export const getVoteChoice = (vote: string, answers: Answer[]) => {
   // answer.id is hexadecimal number
@@ -8,6 +9,6 @@ export const getVoteChoice = (vote: string, answers: Answer[]) => {
   if (!isUndefined(selectedAnswer)) {
     return selectedAnswer.title;
   } else {
-    return `Answer 0x${vote}`;
+    return BigInt(vote) === BigInt(0) ? RefuseToArbitrateAnswer.title : `Answer 0x${vote}`;
   }
 };

From b709cb29c4fcd9eac8c74d9a9a2dfed1649975d0 Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Thu, 13 Feb 2025 17:47:14 +0530
Subject: [PATCH 08/10] chore(kleros-sdk): update-get-dispute-test

---
 kleros-sdk/test/getDispute.test.ts | 29 ++++++++++++++---------------
 1 file changed, 14 insertions(+), 15 deletions(-)

diff --git a/kleros-sdk/test/getDispute.test.ts b/kleros-sdk/test/getDispute.test.ts
index 0d1fadc0f..553a0ec27 100644
--- a/kleros-sdk/test/getDispute.test.ts
+++ b/kleros-sdk/test/getDispute.test.ts
@@ -105,7 +105,14 @@ describe("getDispute", () => {
     expect(result?.answers[2].id).toBe("0x2");
   });
 
-  it("should overwrite existing answer with id 0x0 or 0x00", async () => {
+  it("should only overwrite existing answer with id 0x0 or 0x00's title and not overwrite description", async () => {
+    const customRTAAnswer = {
+      id: "0x0",
+      title: "Custom Refuse Title",
+      description: "Custom Refuse Description",
+      reserved: true,
+    };
+
     // Test with 0x0
     const mockTemplate0x0 = {
       disputeTemplate: {
@@ -114,12 +121,7 @@ describe("getDispute", () => {
           description: "Test Description",
           question: "Test Question",
           answers: [
-            {
-              id: "0x0",
-              title: "Custom Refuse Title",
-              description: "Custom Refuse Description",
-              reserved: true,
-            },
+            customRTAAnswer,
             {
               id: "0x1",
               title: "Yes",
@@ -145,7 +147,8 @@ describe("getDispute", () => {
     });
 
     expect(result?.answers).toHaveLength(2);
-    expect(result?.answers[0]).toEqual(standardRefuseToArbitrateAnswer);
+    expect(result?.answers[0].title).toEqual(standardRefuseToArbitrateAnswer.title);
+    expect(result?.answers[0].description).toEqual(customRTAAnswer.description);
     expect(result?.answers[1].id).toBe("0x1");
 
     // Test with 0x00
@@ -156,12 +159,7 @@ describe("getDispute", () => {
           description: "Test Description",
           question: "Test Question",
           answers: [
-            {
-              id: "0x00",
-              title: "Custom Refuse Title",
-              description: "Custom Refuse Description",
-              reserved: true,
-            },
+            customRTAAnswer,
             {
               id: "0x1",
               title: "Yes",
@@ -186,7 +184,8 @@ describe("getDispute", () => {
     });
 
     expect(result?.answers).toHaveLength(2);
-    expect(result?.answers[0]).toEqual(standardRefuseToArbitrateAnswer);
+    expect(result?.answers[0].title).toEqual(standardRefuseToArbitrateAnswer.title);
+    expect(result?.answers[0].description).toEqual(customRTAAnswer.description);
     expect(result?.answers[1].id).toBe("0x1");
   });
 

From 14496f2de123bf37b706f313b3194e15c4390495 Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Fri, 14 Feb 2025 17:52:32 +0530
Subject: [PATCH 09/10] refactor(sdk): rta-update-logic

---
 .../dataMappings/utils/populateTemplate.ts    | 25 +++++++++++--------
 1 file changed, 14 insertions(+), 11 deletions(-)

diff --git a/kleros-sdk/src/dataMappings/utils/populateTemplate.ts b/kleros-sdk/src/dataMappings/utils/populateTemplate.ts
index 7797f0ff9..68ae983ec 100644
--- a/kleros-sdk/src/dataMappings/utils/populateTemplate.ts
+++ b/kleros-sdk/src/dataMappings/utils/populateTemplate.ts
@@ -11,20 +11,23 @@ export const populateTemplate = (mustacheTemplate: string, data: any): DisputeDe
     throw validation.error;
   }
 
-  const templateRTAAnswer = (dispute as DisputeDetails).answers.find(
+  return findAndUpdateRTA(dispute);
+};
+
+// Filter out any existing answer with id 0 and add customised Refuse to Arbitrate option
+const findAndUpdateRTA = (dispute: DisputeDetails) => {
+  const templateRTAIndex = (dispute as DisputeDetails).answers.findIndex(
     (answer) => answer.id && BigInt(answer.id) === BigInt(0)
   );
 
-  const CustomRTA: DisputeDetails["answers"][number] = {
-    ...RefuseToArbitrateAnswer,
-    description: templateRTAAnswer?.description ?? RefuseToArbitrateAnswer.description,
-  };
-
-  // Filter out any existing answer with id 0 and add customised Refuse to Arbitrate option
-  (dispute as DisputeDetails).answers = [
-    CustomRTA,
-    ...((dispute as DisputeDetails).answers.filter((answer) => answer.id && BigInt(answer.id) !== BigInt(0)) || []),
-  ];
+  if (templateRTAIndex !== -1) {
+    dispute.answers[templateRTAIndex] = {
+      ...RefuseToArbitrateAnswer,
+      description: dispute.answers[templateRTAIndex].description ?? RefuseToArbitrateAnswer.description,
+    };
+  } else {
+    dispute.answers = [RefuseToArbitrateAnswer, ...dispute.answers];
+  }
 
   return dispute;
 };

From eb9bbe039c6b6a41f2beed6eafc3a13d65b86d95 Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Fri, 14 Feb 2025 22:41:28 +0530
Subject: [PATCH 10/10] refactor(web): rta-option

---
 .../Voting/Classic/OptionsContainer.tsx       | 29 ++++++++++---------
 1 file changed, 15 insertions(+), 14 deletions(-)

diff --git a/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx b/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
index bafbf18bd..640c3dd9b 100644
--- a/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
+++ b/web/src/pages/Cases/CaseDetails/Voting/Classic/OptionsContainer.tsx
@@ -13,6 +13,7 @@ import { EnsureChain } from "components/EnsureChain";
 
 import JustificationArea from "./JustificationArea";
 import { Answer } from "@kleros/kleros-sdk";
+import { RefuseToArbitrateAnswer } from "@kleros/kleros-sdk/src/dataMappings/utils/disputeDetailsSchema";
 
 const MainContainer = styled.div`
   width: 100%;
@@ -58,11 +59,11 @@ const Options: React.FC<IOptions> = ({ arbitrable, handleSelection, justificatio
   const [chosenOption, setChosenOption] = useState(BigInt(-1));
   const [isSending, setIsSending] = useState(false);
 
-  // if RTA not found in dispute.answers, show RTA. shows RTA in case of invalid dispute too
-  const showRTA = useMemo(
-    () => isUndefined(disputeDetails?.answers?.find((answer) => BigInt(answer.id) === BigInt(0))),
-    [disputeDetails]
-  );
+  const updatedRTA = useMemo(() => {
+    const RTAFromTemplate = disputeDetails?.answers?.find((answer) => BigInt(answer.id) === BigInt(0));
+    if (!RTAFromTemplate) return RefuseToArbitrateAnswer;
+    return RTAFromTemplate;
+  }, [disputeDetails]);
 
   const onClick = useCallback(
     async (id: bigint) => {
@@ -86,7 +87,7 @@ const Options: React.FC<IOptions> = ({ arbitrable, handleSelection, justificatio
           <StyledEnsureChain>
             <OptionsContainer>
               {disputeDetails?.answers?.map((answer: Answer) => {
-                return (
+                return BigInt(answer.id) !== BigInt(0) ? (
                   <Tooltip text={answer.description} key={answer.title}>
                     <Button
                       text={answer.title}
@@ -95,25 +96,25 @@ const Options: React.FC<IOptions> = ({ arbitrable, handleSelection, justificatio
                       onClick={() => onClick(BigInt(answer.id))}
                     />
                   </Tooltip>
-                );
+                ) : null;
               })}
             </OptionsContainer>
           </StyledEnsureChain>
         )}
       </MainContainer>
-      {showRTA ? (
-        <RefuseToArbitrateContainer>
-          <EnsureChain>
+      <RefuseToArbitrateContainer>
+        <EnsureChain>
+          <Tooltip text={updatedRTA.description}>
             <Button
               variant="secondary"
-              text="Refuse to Arbitrate"
+              text={updatedRTA.title}
               disabled={isSending}
               isLoading={chosenOption === BigInt(0)}
               onClick={() => onClick(BigInt(0))}
             />
-          </EnsureChain>
-        </RefuseToArbitrateContainer>
-      ) : null}
+          </Tooltip>
+        </EnsureChain>
+      </RefuseToArbitrateContainer>
     </>
   ) : null;
 };