diff --git a/components/brave_wallet_ui/components/desktop/card-headers/panel-action-header.tsx b/components/brave_wallet_ui/components/desktop/card-headers/panel-action-header.tsx new file mode 100644 index 000000000000..13c530b3dcc5 --- /dev/null +++ b/components/brave_wallet_ui/components/desktop/card-headers/panel-action-header.tsx @@ -0,0 +1,68 @@ +// Copyright (c) 2024 The Brave Authors. All rights reserved. +// This Source Code Form is subject to the terms of the Mozilla Public +// License, v. 2.0. If a copy of the MPL was not distributed with this file, +// You can obtain one at https://mozilla.org/MPL/2.0/. + +import * as React from 'react' +import { useHistory } from 'react-router-dom' + +// Types +import { WalletRoutes } from '../../../constants/types' + +// Utils +import { openWalletRouteTab } from '../../../utils/routes-utils' + +// Styled Components +import { + Button, + ButtonIcon, + LeftRightContainer +} from './shared-panel-headers.style' +import { Row } from '../../shared/style' +import { HeaderTitle } from './shared-card-headers.style' + +interface Props { + title: string + expandRoute: WalletRoutes +} + +export const PanelActionHeader = (props: Props) => { + const { title, expandRoute } = props + + // Routing + const history = useHistory() + + // Methods + const onClose = () => { + if (history.length > 1) { + history.goBack() + return + } + history.push(WalletRoutes.PortfolioAssets) + } + + return ( + + + + + {title} + + + + + ) +} diff --git a/components/brave_wallet_ui/page/screens/send/send_screen/send_screen.tsx b/components/brave_wallet_ui/page/screens/send/send_screen/send_screen.tsx index 1f39db060c1f..ddc3f29978c2 100644 --- a/components/brave_wallet_ui/page/screens/send/send_screen/send_screen.tsx +++ b/components/brave_wallet_ui/page/screens/send/send_screen/send_screen.tsx @@ -79,8 +79,8 @@ import { import { ComposerControls } from '../../composer_ui/composer_controls/composer_controls' import { FromAsset } from '../../composer_ui/from_asset/from_asset' import { - DefaultPanelHeader // -} from '../../../../components/desktop/card-headers/default-panel-header' + PanelActionHeader // +} from '../../../../components/desktop/card-headers/panel-action-header' import { OrdinalsWarningMessage // } from '../components/ordinals-warning-message/ordinals-warning-message' @@ -468,13 +468,13 @@ export const SendScreen = React.memo((props: Props) => { diff --git a/components/brave_wallet_ui/page/screens/swap/swap.tsx b/components/brave_wallet_ui/page/screens/swap/swap.tsx index 3b14de13f5f6..964e758b5d75 100644 --- a/components/brave_wallet_ui/page/screens/swap/swap.tsx +++ b/components/brave_wallet_ui/page/screens/swap/swap.tsx @@ -30,7 +30,7 @@ import { import { PrivacyModal } from './components/swap/privacy-modal/privacy-modal' import { ComposerControls } from '../composer_ui/composer_controls/composer_controls' import WalletPageWrapper from '../../../components/desktop/wallet-page-wrapper/wallet-page-wrapper' -import { DefaultPanelHeader } from '../../../components/desktop/card-headers/default-panel-header' +import { PanelActionHeader } from '../../../components/desktop/card-headers/panel-action-header' // Styled Components import { LeoSquaredButton } from '../../../components/shared/style' @@ -116,9 +116,10 @@ export const Swap = () => { noCardPadding={true} noMinCardHeight={true} hideDivider={true} + hideNav={isPanel} cardHeader={ isPanel ? ( -