Pulling refs/heads/staging into test-staging

components/court/DelegateButton.tsx

@@ -168,6 +168,7 @@ const DelegateButton = ({ address }: { address: string }) => {
                 </span>
               </div>
               <FormTransactionButton
+                loading={isLoading}
                 className="w-full max-w-[250px]"
                 disabled={formState.isValid === false || isLoading}
               >

components/court/JoinCourtAsJurorButton.tsx

@@ -216,6 +216,7 @@ const JoinCourtAsJurorButton = ({ className }: { className?: string }) => {
               </div>
 
               <FormTransactionButton
+                loading={isLoading}
                 className="w-full max-w-[250px]"
                 disabled={formState.isValid === false || isLoading}
               >

components/court/ManageDelegationsForm.tsx

@@ -249,6 +249,7 @@ const ManageDelegationsForm = (props: ManageDelegationsFormProps) => {
       </div>
 
       <FormTransactionButton
+        loading={isLoading}
         className="w-full max-w-[250px]"
         disabled={
           formState.isValid === false ||

components/liquidity/ExitPoolFormAmm2.tsx

@@ -245,6 +245,7 @@ const ExitPoolForm = ({
         {...register("poolSharesPercentage", { min: 0, value: "0" })}
       />
       <FormTransactionButton
+        loading={isLoading}
         disabled={formState.isValid === false || isLoading}
       >
         Exit Pool

components/liquidity/JoinPoolFormAmm2.tsx

@@ -235,6 +235,7 @@ const JoinPoolForm = ({
       </div>
 
       <FormTransactionButton
+        loading={isLoading}
         disabled={
           formState.isValid === false ||
           isLoading ||

components/markets/BuyFullSetForm.tsx

@@ -158,7 +158,11 @@ const BuyFullSetForm = ({
           </p>
         </div>
       </div>
-      <TransactionButton onClick={handleSignTransaction} disabled={disabled}>
+      <TransactionButton
+        onClick={handleSignTransaction}
+        disabled={disabled}
+        loading={isLoading}
+      >
         Confirm Buy
         {fee && (
           <span className="block text-xs font-normal">

components/markets/SellFullSetForm.tsx

@@ -137,7 +137,11 @@ const SellFullSetForm = ({
           </p>
         </div>
       </div>
-      <TransactionButton onClick={handleSignTransaction} disabled={disabled}>
+      <TransactionButton
+        onClick={handleSignTransaction}
+        disabled={disabled}
+        loading={isLoading}
+      >
         Confirm Sell
         {fee && (
           <span className="block text-xs font-normal">

components/portfolio/DepositButton.tsx

@@ -235,6 +235,7 @@ const DepositModal = ({
             </span>
           </div>
           <FormTransactionButton
+            loading={isLoading}
             className="w-full max-w-[250px]"
             disabled={formState.isValid === false || isLoading}
             disableFeeCheck={true}

components/portfolio/TransferButton.tsx

@@ -298,7 +298,10 @@ const TransferModal = ({
               : ""}
           </span>
         </div>
-        <FormTransactionButton disabled={!isValid || txIsLoading}>
+        <FormTransactionButton
+          loading={txIsLoading}
+          disabled={!isValid || txIsLoading}
+        >
           Transfer
         </FormTransactionButton>
       </form>

components/portfolio/WithdrawButton.tsx

@@ -288,6 +288,7 @@ const WithdrawModal = ({
             <span className="ml-1 text-black">{chain?.withdrawFee}</span>
           </div>
           <FormTransactionButton
+            loading={isLoading}
             className="w-full max-w-[250px]"
             disabled={formState.isValid === false || isLoading}
           >

components/settings/AccountSettingsForm.tsx

@@ -155,6 +155,7 @@ const AcccountSettingsForm: React.FC<AcccountSettingsFormProps> = ({
       </div>
 
       <FormTransactionButton
+        loading={isUpdating}
         disabled={!isDirty || !isValid || isUpdating || isClearing}
       >
         Set Identity

components/trade-form/BuyForm.tsx

@@ -327,6 +327,7 @@ const BuyForm = ({
           className="w-full max-w-[250px]"
           disabled={formState.isValid === false || isLoading}
           disableFeeCheck={true}
+          loading={isLoading}
         >
           <div>
             <div className="center h-[20px] font-normal">Buy</div>

components/trade-form/SellForm.tsx

@@ -300,6 +300,7 @@ const SellForm = ({
           className="w-full max-w-[250px]"
           disabled={formState.isValid === false || isLoading}
           disableFeeCheck={true}
+          loading={isLoading}
         >
           <div>
             <div className="center h-[20px] font-normal">Sell</div>

components/ui/FormTransactionButton.tsx

@@ -7,6 +7,7 @@ interface TransactionButtonProps {
   dataTest?: string;
   disableFeeCheck?: boolean;
   type?: "button" | "submit" | "reset";
+  loading: boolean | undefined;
 }
 
 const FormTransactionButton: FC<PropsWithChildren<TransactionButtonProps>> = ({
@@ -16,6 +17,7 @@ const FormTransactionButton: FC<PropsWithChildren<TransactionButtonProps>> = ({
   disableFeeCheck = false,
   type = "submit",
   children,
+  loading = undefined,
 }) => {
   return (
     <TransactionButton
@@ -24,6 +26,7 @@ const FormTransactionButton: FC<PropsWithChildren<TransactionButtonProps>> = ({
       className={className}
       dataTest={dataTest}
       disableFeeCheck={disableFeeCheck}
+      loading={loading}
     >
       {children}
     </TransactionButton>

pages/deposit.tsx

@@ -267,6 +267,7 @@ const DotDeposit = ({ address }: { address: string }) => {
           )}
       </div>
       <FormTransactionButton
+        loading={isLoading}
         className="w-full rounded-none !bg-white !text-black disabled:bg-white disabled:text-white"
         disabled={isValid === false || isLoading}
         disableFeeCheck={true}