Merge pull request #948 from kleros/fix(web)/fix-assertions-undefined

refactor: started assertion refactoring

Author: alcercu

web/src/pages/Cases/CaseDetails/Appeal/Classic/Fund.tsx

@@ -12,14 +12,17 @@ import {
   useSelectedOptionContext,
   useFundingContext,
 } from "hooks/useClassicAppealContext";
-import { notUndefined } from "utils/index";
+import { isUndefined } from "utils/index";
 
 const Fund: React.FC = () => {
   const loserSideCountdown = useLoserSideCountdownContext();
   const { fundedChoices, winningChoice } = useFundingContext();
   const needFund =
-    notUndefined([loserSideCountdown, fundedChoices]) &&
-    (loserSideCountdown! > 0 || (fundedChoices!.length > 0 && !fundedChoices?.includes(winningChoice!)));
+    (loserSideCountdown ?? 0) > 0 ||
+    (!isUndefined(fundedChoices) &&
+      !isUndefined(winningChoice) &&
+      fundedChoices.length > 0 &&
+      !fundedChoices.includes(winningChoice));
   const { id } = useParams();
   const { address, isDisconnected } = useAccount();
   const { data: balance } = useBalance({
@@ -33,8 +36,8 @@ const Fund: React.FC = () => {
   const [isSending, setIsSending] = useState(false);
   const { selectedOption } = useSelectedOptionContext();
   const { config: fundAppealConfig } = usePrepareDisputeKitClassicFundAppeal({
-    enabled: notUndefined([id, selectedOption]),
-    args: [BigInt(id!), BigInt(selectedOption!)],
+    enabled: !isUndefined(id) && !isUndefined(selectedOption),
+    args: [BigInt(id ?? 0), BigInt(selectedOption ?? 0)],
     value: parsedAmount,
   });
   const { writeAsync: fundAppeal } = useDisputeKitClassicFundAppeal(fundAppealConfig);

web/src/pages/Cases/CaseDetails/Appeal/Classic/Options/StageTwo.tsx

@@ -2,20 +2,22 @@ import React, { useEffect } from "react";
 import styled from "styled-components";
 import OptionCard from "../../OptionCard";
 import { useFundingContext, useOptionsContext, useSelectedOptionContext } from "hooks/useClassicAppealContext";
-import { notUndefined } from "utils/index";
+import { isUndefined } from "utils/index";
 
 const StageOne: React.FC = () => {
   const { paidFees, winningChoice, winnerRequiredFunding, fundedChoices } = useFundingContext();
   const options = useOptionsContext();
   const { selectedOption, setSelectedOption } = useSelectedOptionContext();
   useEffect(() => {
-    if (notUndefined(winningChoice)) setSelectedOption(parseInt(winningChoice!));
+    if (!isUndefined(winningChoice)) setSelectedOption(parseInt(winningChoice));
   });
   return (
     <Container>
-      {notUndefined([winningChoice, fundedChoices, paidFees]) &&
-      fundedChoices!.length > 0 &&
-      !fundedChoices?.includes(winningChoice!) ? (
+      {!isUndefined(winningChoice) &&
+      !isUndefined(fundedChoices) &&
+      !isUndefined(paidFees) &&
+      fundedChoices.length > 0 &&
+      !fundedChoices.includes(winningChoice) ? (
         <>
           <label>Loser deadline has finalized, you can only fund the current winner.</label>
           <OptionsContainer>

web/src/pages/Cases/CaseDetails/Evidence/SubmitEvidenceModal.tsx

@@ -33,13 +33,13 @@ const SubmitEvidenceModal: React.FC<{
             uploadFormDataToIPFS(formData)
               .then(async (res) => {
                 const response = await res.json();
-                if (res.status === 200) {
+                if (res.status === 200 && walletClient) {
                   const cid = "/ipfs/" + response["cid"];
                   const { request } = await prepareWriteDisputeKitClassic({
                     functionName: "submitEvidence",
                     args: [BigInt(evidenceGroup), cid],
                   });
-                  await wrapWithToast(walletClient!.writeContract(request)).then(() => {
+                  await wrapWithToast(walletClient.writeContract(request)).then(() => {
                     setMessage("");
                     close();
                   });

web/src/pages/Cases/CaseDetails/Voting/Binary.tsx

@@ -9,7 +9,7 @@ import { prepareWriteDisputeKitClassic } from "hooks/contracts/generated";
 
 const Binary: React.FC<{ arbitrable?: string; voteIDs: string[] }> = ({ arbitrable, voteIDs }) => {
   const { id } = useParams();
-  const parsedDisputeID = BigInt(id!);
+  const parsedDisputeID = BigInt(id ?? 0);
   const parsedVoteIDs = useMemo(() => voteIDs.map((voteID) => BigInt(voteID)), [voteIDs]);
   const { data: metaEvidence } = useGetMetaEvidence(id, arbitrable);
   const [chosenOption, setChosenOption] = useState(-1);
@@ -44,10 +44,12 @@ const Binary: React.FC<{ arbitrable?: string; voteIDs: string[] }> = ({ arbitrab
                   functionName: "castVote",
                   args: [parsedDisputeID, parsedVoteIDs, BigInt(i + 1), 0n, justification],
                 });
-                wrapWithToast(walletClient!.writeContract(request)).finally(() => {
-                  setChosenOption(-1);
-                  setIsSending(false);
-                });
+                if (walletClient) {
+                  wrapWithToast(walletClient?.writeContract(request)).finally(() => {
+                    setChosenOption(-1);
+                    setIsSending(false);
+                  });
+                }
               }}
             />
           ))}
@@ -66,10 +68,12 @@ const Binary: React.FC<{ arbitrable?: string; voteIDs: string[] }> = ({ arbitrab
               functionName: "castVote",
               args: [parsedDisputeID, parsedVoteIDs, 0n, 0n, justification],
             });
-            wrapWithToast(walletClient!.writeContract(request)).finally(() => {
-              setChosenOption(-1);
-              setIsSending(false);
-            });
+            if (walletClient) {
+              wrapWithToast(walletClient.writeContract(request)).finally(() => {
+                setChosenOption(-1);
+                setIsSending(false);
+              });
+            }
           }}
         />
       </RefuseToArbitrateContainer>

web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx

@@ -26,7 +26,7 @@ const InputDisplay: React.FC<IInputDisplay> = ({ action, isSending, setIsSending
   const { id } = useParams();
   const { address } = useAccount();
   const { data: balance } = usePNKBalance(address);
-  const parsedBalance = formatEther(balance!);
+  const parsedBalance = formatEther(balance ?? 0n);
   const { data: jurorBalance } = useJurorBalance(address, id);
   const parsedStake = formatEther(jurorBalance?.[0] || 0n);
   const isStaking = action === ActionType.stake;

web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx

@@ -13,7 +13,7 @@ import {
 } from "hooks/contracts/generated";
 import { useJurorBalance } from "queries/useJurorBalance";
 import { wrapWithToast } from "utils/wrapWithToast";
-import { notUndefined } from "utils/index";
+import { isUndefined } from "utils/index";
 
 export enum ActionType {
   allowance = "allowance",
@@ -33,7 +33,7 @@ const StakeWithdrawButton: React.FC<IActionButton> = ({ parsedAmount, action, se
   const { id } = useParams();
   const { address } = useAccount();
   const { data: balance } = usePnkBalanceOf({
-    enabled: notUndefined(address),
+    enabled: !isUndefined(address),
     args: [address!],
     watch: true,
   });
@@ -55,12 +55,12 @@ const StakeWithdrawButton: React.FC<IActionButton> = ({ parsedAmount, action, se
 
   const klerosCore = getKlerosCore({});
   const { config: increaseAllowanceConfig } = usePreparePnkIncreaseAllowance({
-    enabled: notUndefined([klerosCore, targetStake, allowance]),
+    enabled: !isUndefined([klerosCore, targetStake, allowance]),
     args: [klerosCore?.address, BigInt(targetStake ?? 0) - BigInt(allowance ?? 0)],
   });
   const { writeAsync: increaseAllowance } = usePnkIncreaseAllowance(increaseAllowanceConfig);
   const handleAllowance = () => {
-    if (notUndefined(increaseAllowance)) {
+    if (!isUndefined(increaseAllowance)) {
       setIsSending(true);
       wrapWithToast(increaseAllowance!()).finally(() => {
         setIsSending(false);
@@ -69,8 +69,8 @@ const StakeWithdrawButton: React.FC<IActionButton> = ({ parsedAmount, action, se
   };
 
   const { config: setStakeConfig } = usePrepareKlerosCoreSetStake({
-    enabled: notUndefined([targetStake, id]),
-    args: [BigInt(id!), targetStake!],
+    enabled: !isUndefined(targetStake) && !isUndefined(id),
+    args: [BigInt(id ?? 0), targetStake],
   });
   const { writeAsync: setStake } = useKlerosCoreSetStake(setStakeConfig);
   const handleStake = () => {
@@ -107,7 +107,7 @@ const StakeWithdrawButton: React.FC<IActionButton> = ({ parsedAmount, action, se
     <Button
       text={text}
       isLoading={isSending}
-      disabled={isSending || parsedAmount == 0n || !notUndefined(targetStake) || checkDisabled()}
+      disabled={isSending || parsedAmount == 0n || !!isUndefined(targetStake) || checkDisabled()}
       onClick={onClick}
     />
   );