From f93d68bc36134abd9536564ba874e49711758659 Mon Sep 17 00:00:00 2001
From: Hristo Nedelkov <hristo.nedelkow@gmail.com>
Date: Wed, 7 Feb 2024 23:52:55 +0200
Subject: [PATCH] fix(validator onboarding): implement back button
 functionality

---
 .../ValidatorSetup/BackButton.tsx                  | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/pages/ValidatorOnboarding/ValidatorSetup/BackButton.tsx b/src/pages/ValidatorOnboarding/ValidatorSetup/BackButton.tsx
index 687326af..03ca6374 100644
--- a/src/pages/ValidatorOnboarding/ValidatorSetup/BackButton.tsx
+++ b/src/pages/ValidatorOnboarding/ValidatorSetup/BackButton.tsx
@@ -2,13 +2,15 @@ import { Text } from '@status-im/components'
 import { Stack, XStack } from 'tamagui'
 import { ArrowLeftIcon } from '@status-im/icons'
 import { useEffect, useState } from 'react'
-import { FORM_STEPS } from '../../../constants'
+import { FORM_STEPS, STEPPER_PATHS } from '../../../constants'
+import { useNavigate } from 'react-router-dom'
 
 type BackButtonProps = {
   prevPageIndex: number
 }
 
 const BackButton = ({ prevPageIndex }: BackButtonProps) => {
+  const navigate = useNavigate()
   const [buttonState, setButtonState] = useState<
     'disabled' | 'enabled' | 'pressed'
   >('disabled')
@@ -41,15 +43,17 @@ const BackButton = ({ prevPageIndex }: BackButtonProps) => {
     fill: buttonState === 'pressed' ? '2A4AF5' : '',
     textColor: buttonState === 'disabled' ? 'CED4DB' : '09101C',
   }
-
+  const handleNavigateBack = () => {
+    const prevPath =
+      STEPPER_PATHS[prevPageIndex - 2] || '/validator-onboarding/'
+    navigate(prevPath)
+  }
   return (
     <XStack
       alignItems="center"
       space="$3"
       cursor={buttonState !== 'disabled' ? 'pointer' : 'default'}
-      onClick={() =>
-        buttonState !== 'disabled' && console.log('Back button clicked')
-      }
+      onClick={() => buttonState !== 'disabled' && handleNavigateBack()}
       onMouseEnter={handleMouseEnter}
       onMouseLeave={handleMouseLeave}
     >