feat(namadillo): updating transaction fees components

anoma · Jul 2, 2024 · 4d2eb6e · 4d2eb6e
1 parent a59fd5f
commit 4d2eb6e
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 9 deletions.
diff --git a/apps/namadillo/src/App/Common/TransactionFees.tsx b/apps/namadillo/src/App/Common/TransactionFees.tsx
@@ -1,27 +1,33 @@
 import clsx from "clsx";
-import { useGasEstimate } from "hooks/useGasEstimate";
+import { useAtomValue } from "jotai";
+import { TxKind, gasLimitsAtom, minimumGasPriceAtom } from "slices/fees";
 import { NamCurrency } from "./NamCurrency";
 import { TextLink } from "./TextLink";
+
 type TransactionFeesProps = {
+  txKind: TxKind;
   numberOfTransactions: number;
   className?: string;
 };
 
 export const TransactionFees = ({
+  txKind,
   numberOfTransactions,
   className,
 }: TransactionFeesProps): JSX.Element => {
-  const { calculateMinGasRequired } = useGasEstimate();
-  const minimumGas = calculateMinGasRequired(numberOfTransactions);
+  const gasLimits = useAtomValue(gasLimitsAtom);
+  const gasPrice = useAtomValue(minimumGasPriceAtom);
 
-  if (!minimumGas || minimumGas.eq(0)) return <></>;
+  if (!gasLimits.isSuccess || !gasPrice.isSuccess) return <></>;
   return (
     <div className={clsx("text-white text-sm", className)}>
       <TextLink>Transaction fee:</TextLink>{" "}
       <NamCurrency
         className="font-medium"
-        amount={minimumGas}
         forceBalanceDisplay={true}
+        amount={gasLimits.data[txKind].native.multipliedBy(
+          numberOfTransactions
+        )}
       />
     </div>
   );

diff --git a/apps/namadillo/src/App/Governance/SubmitVote.tsx b/apps/namadillo/src/App/Governance/SubmitVote.tsx
@@ -175,6 +175,7 @@ export const WithProposalId: React.FC<{ proposalId: bigint }> = ({
             </Stack>
             <footer>
               <TransactionFees
+                txKind="VoteProposal"
                 className="flex justify-between"
                 numberOfTransactions={1}
               />

diff --git a/apps/namadillo/src/App/Staking/IncrementBonding.tsx b/apps/namadillo/src/App/Staking/IncrementBonding.tsx
@@ -264,10 +264,15 @@ const IncrementBonding = (): JSX.Element => {
             >
               {isPerformingBond ? "Processing..." : errorMessage || "Stake"}
             </ActionButton>
-            <TransactionFees
-              className="absolute right-4 top-1/2 -translate-y-1/2"
-              numberOfTransactions={Object.keys(updatedAmountByAddress).length}
-            />
+            {gasLimits.isSuccess && (
+              <TransactionFees
+                txKind="Bond"
+                className="absolute right-4 top-1/2 -translate-y-1/2"
+                numberOfTransactions={
+                  Object.keys(updatedAmountByAddress).length
+                }
+              />
+            )}
           </div>
         </form>
       </ModalContainer>

diff --git a/apps/namadillo/src/App/Staking/ReDelegateAssignStake.tsx b/apps/namadillo/src/App/Staking/ReDelegateAssignStake.tsx
@@ -135,6 +135,7 @@ export const ReDelegateAssignStake = ({
           : "Re-Delegate"}
         </ActionButton>
         <TransactionFees
+          txKind="Redelegation"
           className="absolute right-4 top-1/2 -translate-y-1/2"
           numberOfTransactions={numberOfTransactions}
         />

diff --git a/apps/namadillo/src/App/Staking/Unstake.tsx b/apps/namadillo/src/App/Staking/Unstake.tsx
@@ -253,6 +253,7 @@ const Unstake = (): JSX.Element => {
               : validationMessage || "Unstake"}
             </ActionButton>
             <TransactionFees
+              txKind="Unbond"
               className="absolute right-4 top-1/2 -translate-y-1/2"
               numberOfTransactions={Object.keys(updatedAmountByAddress).length}
             />