From ed39244bdb807abefa7061c7e7ff2be68b899789 Mon Sep 17 00:00:00 2001
From: Anastasios <anastas3993@gmail.com>
Date: Wed, 18 Dec 2024 17:09:00 +0400
Subject: [PATCH] fix: close ledger sheet in request keys flow

---
 .../_components/connect-ledger-asset-button.tsx | 17 ++++++-----------
 .../request-keys/request-keys-flow.tsx          | 11 +++++------
 2 files changed, 11 insertions(+), 17 deletions(-)

diff --git a/src/app/features/asset-list/_components/connect-ledger-asset-button.tsx b/src/app/features/asset-list/_components/connect-ledger-asset-button.tsx
index 743693683d0..53c270d4dd9 100644
--- a/src/app/features/asset-list/_components/connect-ledger-asset-button.tsx
+++ b/src/app/features/asset-list/_components/connect-ledger-asset-button.tsx
@@ -1,6 +1,6 @@
 import { useNavigate } from 'react-router-dom';
 
-import { styled } from 'leather-styles/jsx';
+import { HStack, styled } from 'leather-styles/jsx';
 
 import type { Blockchain } from '@leather.io/models';
 import { Button, LedgerIcon } from '@leather.io/ui';
@@ -27,16 +27,11 @@ export function ConnectLedgerButton({ chain }: ConnectLedgerButtonProps) {
   };
 
   return (
-    <Button
-      display="flex"
-      alignItems="center"
-      variant="outline"
-      size="sm"
-      gap="space.02"
-      onClick={onClick}
-    >
-      <LedgerIcon />
-      <styled.span textStyle="label.02">Connect&nbsp;{capitalize(chain)}</styled.span>
+    <Button variant="outline" size="sm" onClick={onClick}>
+      <HStack gap="space.02">
+        <LedgerIcon />
+        <styled.span textStyle="label.02">Connect&nbsp;{capitalize(chain)}</styled.span>
+      </HStack>
     </Button>
   );
 }
diff --git a/src/app/features/ledger/generic-flows/request-keys/request-keys-flow.tsx b/src/app/features/ledger/generic-flows/request-keys/request-keys-flow.tsx
index 53ee9b55f37..4c8918c78a8 100644
--- a/src/app/features/ledger/generic-flows/request-keys/request-keys-flow.tsx
+++ b/src/app/features/ledger/generic-flows/request-keys/request-keys-flow.tsx
@@ -1,10 +1,11 @@
-import { Outlet } from 'react-router-dom';
+import { Outlet, useNavigate } from 'react-router-dom';
 
 import { Sheet, SheetHeader } from '@leather.io/ui';
 
+import { RouteUrls } from '@shared/route-urls';
+
 import { useScrollLock } from '@app/common/hooks/use-scroll-lock';
 
-import { useLedgerNavigate } from '../../hooks/use-ledger-navigate';
 import { LedgerRequestKeysContext, LedgerRequestKeysProvider } from './ledger-request-keys.context';
 
 interface RequestKeysFlowProps {
@@ -12,17 +13,15 @@ interface RequestKeysFlowProps {
   isActionCancellableByUser: boolean;
 }
 export function RequestKeysFlow({ context, isActionCancellableByUser }: RequestKeysFlowProps) {
-  const ledgerNavigate = useLedgerNavigate();
   useScrollLock(true);
-
-  const onCancelConnectLedger = ledgerNavigate.cancelLedgerAction;
+  const navigate = useNavigate();
 
   return (
     <LedgerRequestKeysProvider value={context}>
       <Sheet
         isShowing
         header={<SheetHeader />}
-        onClose={isActionCancellableByUser ? onCancelConnectLedger : undefined}
+        onClose={isActionCancellableByUser ? () => navigate(RouteUrls.Home) : undefined}
       >
         <Outlet />
       </Sheet>