From e64f0629917ba3bfbf3489c2f663a15351a856f5 Mon Sep 17 00:00:00 2001
From: Deepti Luthra <109640446+deepti-imx@users.noreply.github.com>
Date: Wed, 17 Jan 2024 10:44:49 +0530
Subject: [PATCH] [wt-1557] add back btn to bridge widget (#1356)

---
 .../widgets-lib/src/widgets/bridge/BridgeWidget.tsx   |  5 ++++-
 .../bridge/views/WalletNetworkSelectionView.tsx       | 11 ++++++++---
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/packages/checkout/widgets-lib/src/widgets/bridge/BridgeWidget.tsx b/packages/checkout/widgets-lib/src/widgets/bridge/BridgeWidget.tsx
index 8d3562a77c..edcee34d5d 100644
--- a/packages/checkout/widgets-lib/src/widgets/bridge/BridgeWidget.tsx
+++ b/packages/checkout/widgets-lib/src/widgets/bridge/BridgeWidget.tsx
@@ -80,7 +80,10 @@ export function BridgeWidget({
     {
       ...initialViewState,
       view: { type: BridgeWidgetViews.WALLET_NETWORK_SELECTION },
-      history: [{ type: BridgeWidgetViews.WALLET_NETWORK_SELECTION }],
+      history: initialViewState.history.length > 0
+      && initialViewState.history[initialViewState.history.length - 1].type === SharedViews.TOP_UP_VIEW
+        ? [{ type: SharedViews.TOP_UP_VIEW }, { type: BridgeWidgetViews.WALLET_NETWORK_SELECTION }]
+        : [{ type: BridgeWidgetViews.WALLET_NETWORK_SELECTION }],
     },
   );
 
diff --git a/packages/checkout/widgets-lib/src/widgets/bridge/views/WalletNetworkSelectionView.tsx b/packages/checkout/widgets-lib/src/widgets/bridge/views/WalletNetworkSelectionView.tsx
index 34649bf129..9c75fde586 100644
--- a/packages/checkout/widgets-lib/src/widgets/bridge/views/WalletNetworkSelectionView.tsx
+++ b/packages/checkout/widgets-lib/src/widgets/bridge/views/WalletNetworkSelectionView.tsx
@@ -1,12 +1,12 @@
 import { HeaderNavigation } from 'components/Header/HeaderNavigation';
 import { SimpleLayout } from 'components/SimpleLayout/SimpleLayout';
 import { FooterLogo } from 'components/Footer/FooterLogo';
-import { useContext, useEffect } from 'react';
+import { useContext, useEffect, useMemo } from 'react';
 import { EventTargetContext } from 'context/event-target-context/EventTargetContext';
 import { BridgeWidgetViews } from 'context/view-context/BridgeViewContextTypes';
 import { ButtonNavigationStyles } from 'components/Header/HeaderStyles';
 import { ButtCon } from '@biom3/react';
-import { ViewActions, ViewContext } from 'context/view-context/ViewContext';
+import { SharedViews, ViewActions, ViewContext } from 'context/view-context/ViewContext';
 import { UserJourney, useAnalytics } from 'context/analytics-provider/SegmentAnalyticsProvider';
 import { useTranslation } from 'react-i18next';
 import { sendBridgeWidgetCloseEvent } from '../BridgeWidgetEvents';
@@ -14,10 +14,14 @@ import { WalletAndNetworkSelector } from '../components/WalletAndNetworkSelector
 
 export function WalletNetworkSelectionView() {
   const { t } = useTranslation();
-  const { viewDispatch } = useContext(ViewContext);
+  const { viewState, viewDispatch } = useContext(ViewContext);
 
   const { eventTargetState: { eventTarget } } = useContext(EventTargetContext);
 
+  const showBackButton = useMemo(() => viewState.history.length >= 2
+      && viewState.history[viewState.history.length - 2].type
+        === SharedViews.TOP_UP_VIEW, [viewState.history]);
+
   const { page } = useAnalytics();
 
   useEffect(() => {
@@ -32,6 +36,7 @@ export function WalletNetworkSelectionView() {
       testId="bridge-view"
       header={(
         <HeaderNavigation
+          showBack={showBackButton}
           title={t('views.WALLET_NETWORK_SELECTION.layoutHeading')}
           onCloseButtonClick={() => sendBridgeWidgetCloseEvent(eventTarget)}
           rightActions={(