refactor(web): downgrade-viem-and-sonar-feedback

Author: Harman-singh-waraich

web/package.json

@@ -117,7 +117,7 @@
     "react-toastify": "^9.1.3",
     "react-use": "^17.5.1",
     "styled-components": "^5.3.3",
-    "viem": "^2.21.54",
-    "wagmi": "^2.13.3"
+    "viem": "^2.21.48",
+    "wagmi": "^2.13.0"
   }
 }

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

@@ -145,8 +145,7 @@ const StakeWithdrawButton: React.FC<IActionButton> = ({ amount, parsedAmount, ac
             isWithdraw ? StakeSteps.WithdrawInitiate : StakeSteps.StakeInitiate,
             amount,
             theme,
-            approvalHash,
-            undefined
+            approvalHash
           ),
           current: 1,
         });

web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawPopup/Header.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useMemo } from "react";
 import styled from "styled-components";
 
 import { useParams } from "react-router-dom";
@@ -64,14 +64,11 @@ const Header: React.FC<IHeader> = ({ action, amount, isSuccess }) => {
   const jurorCurrentSpecificStake = address && jurorStakeData ? Number(formatEther(jurorStakeData.staked)) : 0;
 
   const isWithdraw = action === ActionType.withdraw;
+  const actionText = useMemo(() => (isWithdraw ? "withdrew" : "staked"), [isWithdraw]);
   return (
     <StakingMsgContainer>
       {isSuccess ? <CheckIcon /> : null}
-      <StakingMsg>
-        {isSuccess
-          ? `You successfully ${isWithdraw ? "withdrew" : "staked"}`
-          : `You are ${isWithdraw ? "withdrawing" : "staking"}`}
-      </StakingMsg>
+      <StakingMsg>{isSuccess ? `You successfully ${actionText}` : `You are ${actionText}`}</StakingMsg>
       <StakingAmount>{amount} PNK</StakingAmount>
       {courtDetails?.court?.name ? <CourtName>on {courtDetails.court.name}</CourtName> : null}
       {isSuccess ? null : (

web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawPopup/index.tsx

@@ -89,7 +89,7 @@ const StakeWithdrawPopup: React.FC<IStakeWithdrawPopup> = ({ amount, closePopup,
         <InnerContainer>
           <Header {...{ amount, isSuccess, action }} />
           <Divider />
-          {steps && steps.items && <CustomTimeline items={steps.items} />}
+          {steps?.items && <CustomTimeline items={steps.items} />}
         </InnerContainer>
       </Container>
     </Overlay>