refactor(fb): selected lockdate state when going back to 1st step fixed

joinmarket-webui · Aug 21, 2024 · 497ee5f · 497ee5f
1 parent 1ff015c
commit 497ee5f
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 5 deletions.
diff --git a/src/components/fb2/CreateFidelityBond.tsx b/src/components/fb2/CreateFidelityBond.tsx
@@ -458,6 +458,7 @@ const CreateFidelityBond2 = ({ otherFidelityBondExists, wallet, walletInfo, onDo
                     <SelectDate
                       description={t('earn.fidelity_bond.select_date.description')}
                       yearsRange={yearsRange}
+                      lockdate={lockDate}
                       onChange={(date) => setLockDate(date)}
                     />
                     {bondWithSelectedLockDateAlreadyExists && (

diff --git a/src/components/fb2/FidelityBondSteps.tsx b/src/components/fb2/FidelityBondSteps.tsx
@@ -43,13 +43,13 @@ interface ConfirmationProps {
   timelockedAddress: Api.BitcoinAddress
 }
 
-const SelectDate = ({ description, yearsRange, disabled, onChange }: SelectDateProps) => {
+const SelectDate = ({ description, yearsRange, lockdate, disabled, onChange }: SelectDateProps) => {
   return (
     <div className="d-flex gap-4">
       <Sprite symbol="clock" width="24" height="24" />
       <div className="d-flex flex-column gap-4 w-100">
         <div className={styles.stepDescription}>{description}</div>
-        <LockdateForm yearsRange={yearsRange} onChange={onChange} disabled={disabled} />
+        <LockdateForm yearsRange={yearsRange} lockdate={lockdate} onChange={onChange} disabled={disabled} />
       </div>
     </div>
   )

diff --git a/src/components/fb2/LockdateForm.test.tsx b/src/components/fb2/LockdateForm.test.tsx
@@ -9,10 +9,11 @@ import LockdateForm, { _minMonth, _selectableMonths, _selectableYears } from './
 
 describe('<LockdateForm />', () => {
   const now = new Date(Date.UTC(2009, 0, 3))
+  const lockdate = null
   const setup = (onChange: (lockdate: Api.Lockdate | null) => void) => {
     render(
       <I18nextProvider i18n={i18n}>
-        <LockdateForm onChange={onChange} now={now} />
+        <LockdateForm onChange={onChange} lockdate={lockdate} now={now} />
       </I18nextProvider>,
     )
   }

diff --git a/src/components/fb2/LockdateForm.tsx b/src/components/fb2/LockdateForm.tsx
@@ -59,17 +59,21 @@ export const _selectableYears = (yearsRange: fb.YearsRange, now = new Date()): n
 
 export interface LockdateFormProps {
   onChange: (lockdate: Api.Lockdate | null) => void
+  lockdate: Api.Lockdate | null
   yearsRange?: fb.YearsRange
   now?: Date
   disabled?: boolean
 }
 
-const LockdateForm = ({ onChange, now, yearsRange, disabled }: LockdateFormProps) => {
+const LockdateForm = ({ onChange, now, lockdate, yearsRange, disabled }: LockdateFormProps) => {
   const { i18n } = useTranslation()
   const _now = useMemo<Date>(() => now || new Date(), [now])
   const _yearsRange = useMemo<fb.YearsRange>(() => yearsRange || fb.DEFAULT_TIMELOCK_YEARS_RANGE, [yearsRange])
 
-  const initialValue = useMemo<Api.Lockdate>(() => fb.lockdate.initial(_now, _yearsRange), [_now, _yearsRange])
+  const initialValue = useMemo<Api.Lockdate>(() => {
+    if (lockdate) return lockdate
+    return fb.lockdate.initial(_now, _yearsRange)
+  }, [_now, _yearsRange, lockdate])
   const initialDate = useMemo(() => new Date(fb.lockdate.toTimestamp(initialValue)), [initialValue])
   const initialYear = useMemo(() => initialDate.getUTCFullYear(), [initialDate])
   const initialMonth = useMemo(() => (initialDate.getUTCMonth() + 1) as Month, [initialDate])

diff --git a/src/components/fb2/SpendFidelityBondModal.tsx b/src/components/fb2/SpendFidelityBondModal.tsx
@@ -372,6 +372,7 @@ const RenewFidelityBondModal = ({
         <SelectDate
           description={t('earn.fidelity_bond.select_date.description')}
           yearsRange={yearsRange}
+          lockdate={null}
           disabled={isLoading}
           onChange={onSelectedDateChanged}
         />