From 92de8a5fdae4912a09836cc9a673e2954114aa98 Mon Sep 17 00:00:00 2001 From: Pete Watters <2938440+pete-watters@users.noreply.github.com> Date: Mon, 8 Jul 2024 14:46:37 +0100 Subject: [PATCH] chore: wip --- .../container/containers/home/home.layout.tsx | 3 +- .../containers/page/page.context.tsx | 2 +- .../container/containers/page/page.header.tsx | 26 +++++++---------- .../container/containers/page/page.layout.tsx | 29 +++++++++++++++++-- .../stacks/stacks-send-form-confirmation.tsx | 2 +- src/app/routes/components/route-wrapper.tsx | 2 +- 6 files changed, 42 insertions(+), 22 deletions(-) diff --git a/src/app/features/container/containers/home/home.layout.tsx b/src/app/features/container/containers/home/home.layout.tsx index ec0794fb595..ff19b248d6e 100644 --- a/src/app/features/container/containers/home/home.layout.tsx +++ b/src/app/features/container/containers/home/home.layout.tsx @@ -10,8 +10,7 @@ import { Settings } from '../../../settings/settings'; import { ContainerLayout } from '../container.layout'; import { HomeHeader } from './home-header'; -// props need to be optional because of the way the container is structured -// they aren't provided in app-routes and are instead fed via the outlet context +// props are optional as populated by the outlet context interface HomeLayoutProps { children?: React.JSX.Element | React.JSX.Element[]; isShowingSwitchAccount?: boolean; diff --git a/src/app/features/container/containers/page/page.context.tsx b/src/app/features/container/containers/page/page.context.tsx index 32c92aaec65..a884d3df294 100644 --- a/src/app/features/container/containers/page/page.context.tsx +++ b/src/app/features/container/containers/page/page.context.tsx @@ -1,4 +1,4 @@ -import { ReactNode, createContext, useContext, useEffect, useReducer, useRef } from 'react'; +import { ReactNode, createContext, useContext, useEffect, useReducer } from 'react'; import { RouteUrls } from '@shared/route-urls'; diff --git a/src/app/features/container/containers/page/page.header.tsx b/src/app/features/container/containers/page/page.header.tsx index 54212afaf5b..9ab0e6c6ee5 100644 --- a/src/app/features/container/containers/page/page.header.tsx +++ b/src/app/features/container/containers/page/page.header.tsx @@ -1,19 +1,16 @@ -import { useState } from 'react'; import { useNavigate } from 'react-router-dom'; import { ChainID } from '@stacks/transactions'; import { OnboardingSelectors } from '@tests/selectors/onboarding.selectors'; -import { SettingsSelectors } from '@tests/selectors/settings.selectors'; import { SharedComponentsSelectors } from '@tests/selectors/shared-component.selectors'; import { Box, Flex, Grid, GridItem, HStack, styled } from 'leather-styles/jsx'; -import { ArrowLeftIcon, CloseIcon, HamburgerIcon, Logo, NetworkModeBadge } from '@leather.io/ui'; +import { ArrowLeftIcon, CloseIcon, Logo, NetworkModeBadge } from '@leather.io/ui'; import { RouteUrls } from '@shared/route-urls'; import { useCurrentNetworkState } from '@app/store/networks/networks.hooks'; -import { Settings } from '../../../settings/settings'; import { HeaderActionButton } from '../headers/components/header-action-button'; import { usePageContext } from './page.context'; @@ -39,11 +36,16 @@ function LogoBox({ isSessionLocked }: { isSessionLocked: boolean | undefined }) ); } -export function PageHeader() { +interface PageHeaderProps { + // isShowingSwitchAccount?: boolean; + // setIsShowingSwitchAccount?(isShowingSwitchAccount: boolean): void; + settingsMenu: React.ReactNode; +} + +export function PageHeader({ settingsMenu }: PageHeaderProps) { const navigate = useNavigate(); const { chain, name: chainName } = useCurrentNetworkState(); - const [isShowingSwitchAccount, setIsShowingSwitchAccount] = useState(false); const { state: { title, isSummaryPage, isSessionLocked, isSettingsVisibleOnSm, onBackLocation }, } = usePageContext(); @@ -89,15 +91,9 @@ export function PageHeader() { /> {!isSummaryPage && ( - - } - toggleSwitchAccount={() => setIsShowingSwitchAccount(!isShowingSwitchAccount)} - /> + + {settingsMenu} + )} {isSummaryPage && ( - } content={children} /> + } + toggleSwitchAccount={() => setIsShowingSwitchAccount(!isShowingSwitchAccount)} + /> + ) + } + /> + } + content={children} + /> ); } diff --git a/src/app/pages/send/send-crypto-asset-form/form/stacks/stacks-send-form-confirmation.tsx b/src/app/pages/send/send-crypto-asset-form/form/stacks/stacks-send-form-confirmation.tsx index 623a40bd5a9..8fe309bb09e 100644 --- a/src/app/pages/send/send-crypto-asset-form/form/stacks/stacks-send-form-confirmation.tsx +++ b/src/app/pages/send/send-crypto-asset-form/form/stacks/stacks-send-form-confirmation.tsx @@ -7,7 +7,7 @@ import type { CryptoCurrencies } from '@leather.io/models'; import { InfoCircleIcon } from '@leather.io/ui'; import { useLocationStateWithCache } from '@app/common/hooks/use-location-state'; -import { useUpdatePageHeaderContext } from '@app/features/container/containers/page/page.context'; +// import { useUpdatePageHeaderContext } from '@app/features/container/containers/page/page.context'; import { useStacksBroadcastTransaction } from '@app/features/stacks-transaction-request/hooks/use-stacks-broadcast-transaction'; import { useStacksTransactionSummary } from '@app/features/stacks-transaction-request/hooks/use-stacks-transaction-summary'; import { BasicTooltip } from '@app/ui/components/tooltip/basic-tooltip'; diff --git a/src/app/routes/components/route-wrapper.tsx b/src/app/routes/components/route-wrapper.tsx index 0ab83c3aae1..56762f2404f 100644 --- a/src/app/routes/components/route-wrapper.tsx +++ b/src/app/routes/components/route-wrapper.tsx @@ -1,4 +1,4 @@ -import { Navigate, Route, Routes, useLocation } from 'react-router-dom'; +import { Navigate, Route, Routes } from 'react-router-dom'; import { RouteUrls } from '@shared/route-urls';