From 0c9dc1e17c515cd894f331ff3388a7be65e3fdb4 Mon Sep 17 00:00:00 2001
From: gutsyphilip <philip.c.obosi@gmail.com>
Date: Wed, 11 May 2022 13:43:25 +0400
Subject: [PATCH] fix: update ledgerHDPath props

---
 .../components/accounts/ledger/SetupLedger.js | 19 ++++++++-----------
 .../accounts/ledger/SetupLedgerNewAccount.js  | 14 ++++++--------
 2 files changed, 14 insertions(+), 19 deletions(-)

diff --git a/packages/frontend/src/components/accounts/ledger/SetupLedger.js b/packages/frontend/src/components/accounts/ledger/SetupLedger.js
index 064943d100..d9a7e040a1 100644
--- a/packages/frontend/src/components/accounts/ledger/SetupLedger.js
+++ b/packages/frontend/src/components/accounts/ledger/SetupLedger.js
@@ -16,10 +16,9 @@ import {
 import { showCustomAlert } from '../../../redux/actions/status';
 import { selectAccountSlice } from '../../../redux/slices/account';
 import { createNewAccount } from '../../../redux/slices/account/createAccountThunks';
-import { actions as ledgerActions } from '../../../redux/slices/ledger';
+import { actions as ledgerActions, LEDGER_HD_PATH_PREFIX } from '../../../redux/slices/ledger';
 import { actions as linkdropActions } from '../../../redux/slices/linkdrop';
 import { selectStatusMainLoader } from '../../../redux/slices/status';
-import { getLedgerHDPath } from '../../../utils/ledger';
 import { setLedgerHdPath } from '../../../utils/localStorage';
 import parseFundingOptions from '../../../utils/parseFundingOptions';
 import { setKeyMeta, ENABLE_IDENTITY_VERIFIED_ACCOUNT } from '../../../utils/wallet';
@@ -45,9 +44,8 @@ const SetupLedger = (props) => {
     const [isNewAccount, setIsNewAccount] = useState(null);
     // TODO: Custom recaptcha hook
     const [recaptchaToken, setRecaptchaToken] = useState(null);
-    const [path, setPath] = useState(1);
-    const [confirmedPath, setConfirmedPath] = useState(null);
-    const customLedgerHdPath = getLedgerHDPath(confirmedPath);
+    const [confirmedPath, setConfirmedPath] = useState(1);
+    const ledgerHdPath = `${LEDGER_HD_PATH_PREFIX}${confirmedPath}'`;
 
     const recaptchaRef = useRef(null);
     const fundingOptions = parseFundingOptions(props.location.search);
@@ -83,13 +81,13 @@ const SetupLedger = (props) => {
 
                     try {
                         debugLog(DISABLE_CREATE_ACCOUNT, fundingOptions);
-                        publicKey = await dispatch(getLedgerPublicKey(customLedgerHdPath));
+                        publicKey = await dispatch(getLedgerPublicKey(ledgerHdPath));
                         await setKeyMeta(publicKey, { type: 'ledger' });
                         Mixpanel.track('SR-Ledger Set key meta');
 
                         // Set custom path to localstorage
-                        if (customLedgerHdPath) {
-                            setLedgerHdPath({ accountId, path: customLedgerHdPath });
+                        if (ledgerHdPath) {
+                            setLedgerHdPath({ accountId, path: ledgerHdPath });
                         }
 
                         // COIN-OP VERIFY ACCOUNT
@@ -188,9 +186,8 @@ const SetupLedger = (props) => {
                 &nbsp;<Translate id='setupLedger.two' /> <span className='link underline' onClick={openShowInstructions}><Translate id='setupLedger.twoLink' /></span>.
             </h2>
             <LedgerHdPaths
-                path={path}
-                onSetPath={(path) => setPath(path)}
-                onConfirmHdPath={() => {
+                confirmedPath={confirmedPath}
+                setConfirmedPath={(path) => {
                     setConfirmedPath(path);
                     Mixpanel.track('SR-Ledger Setup set custom HD path');
                 }}
diff --git a/packages/frontend/src/components/accounts/ledger/SetupLedgerNewAccount.js b/packages/frontend/src/components/accounts/ledger/SetupLedgerNewAccount.js
index 342bb9e6e1..2e6676a99d 100644
--- a/packages/frontend/src/components/accounts/ledger/SetupLedgerNewAccount.js
+++ b/packages/frontend/src/components/accounts/ledger/SetupLedgerNewAccount.js
@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 import { Translate } from 'react-localize-redux';
 
 import { Mixpanel } from '../../../mixpanel/index';
-import { getLedgerHDPath } from '../../../utils/ledger';
+import { LEDGER_HD_PATH_PREFIX } from '../../../redux/slices/ledger';
 import FormButton from '../../common/FormButton';
 import Container from '../../common/styled/Container.css';
 import LedgerIcon from '../../svg/LedgerIcon';
@@ -13,9 +13,8 @@ export default ({
     onClickConnectLedger
 }) => {
     const [showInstructions, setShowInstructions] = useState(false);
-    const [path, setPath] = useState(1);
-    const [confirmedPath, setConfirmedPath] = useState(null);
-    const customLedgerHdPath = getLedgerHDPath(confirmedPath);
+    const [confirmedPath, setConfirmedPath] = useState(1);
+    const ledgerHdPath = `${LEDGER_HD_PATH_PREFIX}${confirmedPath}'`;
     return (
         <Container className='small-centered border ledger-theme'>
             <h1><Translate id='setupLedger.header' /></h1>
@@ -34,15 +33,14 @@ export default ({
                 </span>.
             </h2>
             <LedgerHdPaths
-                path={path}
-                onSetPath={(path) => setPath(path)}
-                onConfirmHdPath={() => {
+                confirmedPath={confirmedPath}
+                setConfirmedPath={(path) => {
                     setConfirmedPath(path);
                     Mixpanel.track('SR-Ledger Setup set custom HD path');
                 }}
             />
             <FormButton onClick={()=>{
-                onClickConnectLedger(customLedgerHdPath);
+                onClickConnectLedger(ledgerHdPath);
             }}>
                 <Translate id='button.continue' />
             </FormButton>