From b387c82382b421190183a74a2b3d3800a5d564ca Mon Sep 17 00:00:00 2001
From: David Totrashvili <8580261+totraev@users.noreply.github.com>
Date: Fri, 10 Jan 2025 15:16:47 +0500
Subject: [PATCH] fix: default term value (#612)

* fix: default term value

* fix: set term field as dirty and touched
---
 src/app/components/Staking/StakingForm.tsx       |  2 +-
 src/app/page.tsx                                 |  2 +-
 src/app/state/StakingState.tsx                   |  7 +++++++
 .../staking/StakingForm/components/TermField.tsx |  7 ++++---
 src/components/staking/StakingForm/index.tsx     |  8 +++++++-
 src/components/staking/StakingModal/index.tsx    | 16 +++++++++++++---
 src/config/index.ts                              |  3 +++
 7 files changed, 36 insertions(+), 9 deletions(-)

diff --git a/src/app/components/Staking/StakingForm.tsx b/src/app/components/Staking/StakingForm.tsx
index 18ace567..951383a5 100644
--- a/src/app/components/Staking/StakingForm.tsx
+++ b/src/app/components/Staking/StakingForm.tsx
@@ -29,7 +29,7 @@ export function StakingForm() {
             <FinalityProviders />
           </div>
 
-          <div className="flex items-center justify-center lg:w-2/5 xl:w-1/3 p-6 rounded border bg-secondary-contrast border-primary-light/20">
+          <div className="flex lg:w-2/5 xl:w-1/3 p-6 rounded border bg-secondary-contrast border-primary-light/20">
             <DelegationForm
               loading={loading}
               disabled={hasError}
diff --git a/src/app/page.tsx b/src/app/page.tsx
index fb2e3ce8..25d94e60 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -29,7 +29,7 @@ const Home = () => {
 
       <Container
         as="main"
-        className="-mt-[10rem] md:-mt-[6.25rem] flex flex-col gap-12 md:gap-16 pb-16"
+        className="-mt-[10rem] md:-mt-[6.5rem] flex flex-col gap-12 md:gap-16 pb-16"
       >
         <Stats />
         <PersonalBalance />
diff --git a/src/app/state/StakingState.tsx b/src/app/state/StakingState.tsx
index 076f12ba..0123d373 100644
--- a/src/app/state/StakingState.tsx
+++ b/src/app/state/StakingState.tsx
@@ -8,6 +8,7 @@ import { useNetworkFees } from "@/app/hooks/client/api/useNetworkFees";
 import { useHealthCheck } from "@/app/hooks/useHealthCheck";
 import { useAppState } from "@/app/state";
 import type { DelegationV2 } from "@/app/types/delegationsV2";
+import { IS_FIXED_TERM_FIELD } from "@/config";
 import { getNetworkConfigBTC } from "@/config/network/btc";
 import { btcToSatoshi, satoshiToBtc } from "@/utils/btc";
 import { createStateUtils } from "@/utils/createStateUtils";
@@ -53,6 +54,7 @@ export interface StakingState {
     defaultFeeRate: number;
     minStakingTimeBlocks: number;
     maxStakingTimeBlocks: number;
+    defaultStakingTimeBlocks?: number;
     minStakingAmountSat: number;
     maxStakingAmountSat: number;
     unbondingFeeSat: number;
@@ -161,6 +163,10 @@ export function StakingState({ children }: PropsWithChildren) {
 
     const { minFeeRate, defaultFeeRate, maxFeeRate } =
       getFeeRateFromMempool(mempoolFeeRates);
+    const defaultStakingTimeBlocks =
+      IS_FIXED_TERM_FIELD || minStakingTimeBlocks === maxStakingTimeBlocks
+        ? maxStakingTimeBlocks
+        : undefined;
 
     return {
       defaultFeeRate,
@@ -170,6 +176,7 @@ export function StakingState({ children }: PropsWithChildren) {
       maxStakingAmountSat,
       minStakingTimeBlocks,
       maxStakingTimeBlocks,
+      defaultStakingTimeBlocks,
       unbondingFeeSat,
       unbondingTime,
     };
diff --git a/src/components/staking/StakingForm/components/TermField.tsx b/src/components/staking/StakingForm/components/TermField.tsx
index b3450a2e..8dfcf27a 100644
--- a/src/components/staking/StakingForm/components/TermField.tsx
+++ b/src/components/staking/StakingForm/components/TermField.tsx
@@ -3,11 +3,12 @@ import { HiddenField, NumberField } from "@babylonlabs-io/bbn-core-ui";
 interface TermFieldProps {
   min?: number;
   max?: number;
+  defaultValue?: number;
 }
 
-export function TermField({ min = 0, max = 0 }: TermFieldProps) {
-  if (min === max) {
-    return <HiddenField name="term" defaultValue={max.toString()} />;
+export function TermField({ min = 0, defaultValue }: TermFieldProps) {
+  if (defaultValue) {
+    return <HiddenField name="term" defaultValue={defaultValue.toString()} />;
   }
 
   const label = (
diff --git a/src/components/staking/StakingForm/index.tsx b/src/components/staking/StakingForm/index.tsx
index 8435f918..fef4b3be 100644
--- a/src/components/staking/StakingForm/index.tsx
+++ b/src/components/staking/StakingForm/index.tsx
@@ -31,6 +31,7 @@ interface DelegationFormProps {
     maxStakingTimeBlocks: number;
     minStakingAmountSat: number;
     maxStakingAmountSat: number;
+    defaultStakingTimeBlocks?: number;
   };
 }
 
@@ -45,7 +46,11 @@ export function DelegationForm({
 
   if (loading) {
     return (
-      <StatusView className="flex-1" icon={<Loader />} title="Please wait..." />
+      <StatusView
+        className="flex-1 h-auto"
+        icon={<Loader />}
+        title="Please wait..."
+      />
     );
   }
 
@@ -85,6 +90,7 @@ export function DelegationForm({
         <div className="flex flex-1 flex-col">
           <FormOverlay>
             <TermField
+              defaultValue={stakingInfo?.defaultStakingTimeBlocks}
               min={stakingInfo?.minStakingTimeBlocks}
               max={stakingInfo?.maxStakingTimeBlocks}
             />
diff --git a/src/components/staking/StakingModal/index.tsx b/src/components/staking/StakingModal/index.tsx
index cb8952d6..d727111b 100644
--- a/src/components/staking/StakingModal/index.tsx
+++ b/src/components/staking/StakingModal/index.tsx
@@ -34,7 +34,11 @@ export function StakingModal() {
   } = useStakingState();
   const { getFinalityProvider } = useFinalityProviderState();
   const { createEOI, stakeDelegation } = useStakingService();
-  const { reset: resetForm, trigger: revalidateForm } = useFormContext();
+  const {
+    reset: resetForm,
+    trigger: revalidateForm,
+    setValue: setFieldValue,
+  } = useFormContext();
 
   const fp = useMemo(
     () => getFinalityProvider(formData?.finalityProvider ?? ""),
@@ -65,9 +69,15 @@ export function StakingModal() {
               finalityProvider: "",
               term: "",
               amount: "",
-              feeRate: stakingInfo?.defaultFeeRate ?? 0,
-              feeAmount: 0,
+              feeRate: stakingInfo?.defaultFeeRate?.toString() ?? "0",
+              feeAmount: "0",
             });
+            if (stakingInfo?.defaultStakingTimeBlocks) {
+              setFieldValue("term", stakingInfo?.defaultStakingTimeBlocks, {
+                shouldDirty: true,
+                shouldTouch: true,
+              });
+            }
             revalidateForm();
           }}
         />
diff --git a/src/config/index.ts b/src/config/index.ts
index d67d60a5..668a435f 100644
--- a/src/config/index.ts
+++ b/src/config/index.ts
@@ -21,3 +21,6 @@ export const getNetworkAppUrl = (): string => {
 export const getBtcNetwork = (): Network => {
   return network;
 };
+
+export const IS_FIXED_TERM_FIELD =
+  process.env.NEXT_PUBLIC_FIXED_STAKING_TERM === "true";