From 2ae64457d6cc24b8654bd499b5a5213ebffd9516 Mon Sep 17 00:00:00 2001 From: Pete Watters <2938440+pete-watters@users.noreply.github.com> Date: Mon, 22 Jan 2024 06:36:44 +0000 Subject: [PATCH] chore: rebase with new button changes --- src/app/components/request-password.tsx | 7 +++- .../switch-account-dialog.tsx | 6 +-- .../onboarding/welcome/welcome.layout.tsx | 2 - .../form/btc/btc-send-form.tsx | 6 +-- .../sign-out-confirm.layout.tsx | 1 - src/app/ui/components/button/button.tsx | 5 ++- .../containers/footers/footer.stories.tsx | 38 +++++++++--------- .../components/containers/headers/header.tsx | 11 ++--- .../containers/headers/home-header.tsx | 40 ++++++------------- src/app/ui/components/leather-logo.tsx | 14 ++++--- 10 files changed, 61 insertions(+), 69 deletions(-) diff --git a/src/app/components/request-password.tsx b/src/app/components/request-password.tsx index d0dd6905903..ca56b9b837a 100644 --- a/src/app/components/request-password.tsx +++ b/src/app/components/request-password.tsx @@ -69,7 +69,12 @@ export function RequestPassword({ > {/* // TODO #4370 add header */} - + {title} diff --git a/src/app/features/dialogs/switch-account-dialog/switch-account-dialog.tsx b/src/app/features/dialogs/switch-account-dialog/switch-account-dialog.tsx index 1dfda674f80..059c7d9d464 100644 --- a/src/app/features/dialogs/switch-account-dialog/switch-account-dialog.tsx +++ b/src/app/features/dialogs/switch-account-dialog/switch-account-dialog.tsx @@ -6,7 +6,7 @@ import { useCurrentAccountIndex } from '@app/store/accounts/account'; import { useFilteredBitcoinAccounts } from '@app/store/accounts/blockchain/bitcoin/bitcoin.ledger'; import { useStacksAccounts } from '@app/store/accounts/blockchain/stacks/stacks-account.hooks'; import { useShowSwitchAccountsState } from '@app/store/ui/ui.hooks'; -import { LeatherButton } from '@app/ui/components/button'; +import { Button } from '@app/ui/components/button/button'; import { Dialog } from '@app/ui/components/containers/dialog/dialog'; import { Footer } from '@app/ui/components/containers/footers/footer'; @@ -48,9 +48,9 @@ export const SwitchAccountDialog = memo(() => { footer={whenWallet({ software: ( ), ledger: <>, diff --git a/src/app/pages/onboarding/welcome/welcome.layout.tsx b/src/app/pages/onboarding/welcome/welcome.layout.tsx index d5a913c6f77..afd7a9ef58e 100644 --- a/src/app/pages/onboarding/welcome/welcome.layout.tsx +++ b/src/app/pages/onboarding/welcome/welcome.layout.tsx @@ -89,7 +89,6 @@ export function WelcomeLayout({
- props.handleSubmit()} type="submit" > Continue - +
diff --git a/src/app/pages/sign-out-confirm/sign-out-confirm.layout.tsx b/src/app/pages/sign-out-confirm/sign-out-confirm.layout.tsx index a83849fed1d..5e6f29d69b7 100644 --- a/src/app/pages/sign-out-confirm/sign-out-confirm.layout.tsx +++ b/src/app/pages/sign-out-confirm/sign-out-confirm.layout.tsx @@ -2,7 +2,6 @@ import { SettingsSelectors } from '@tests/selectors/settings.selectors'; import { useFormik } from 'formik'; import { Box, Flex, styled } from 'leather-styles/jsx'; -import { useThemeSwitcher } from '@app/common/theme-provider'; import { useWalletType } from '@app/common/use-wallet-type'; import { Flag } from '@app/components/layout/flag'; import { Button } from '@app/ui/components/button/button'; diff --git a/src/app/ui/components/button/button.tsx b/src/app/ui/components/button/button.tsx index e7bd05cb093..b0a4a31c2aa 100644 --- a/src/app/ui/components/button/button.tsx +++ b/src/app/ui/components/button/button.tsx @@ -3,7 +3,10 @@ import { type ButtonVariantProps, button as buttonRecipe } from 'leather-styles/ const StyledButton = styled('button'); -type ButtonProps = Omit, keyof ButtonVariantProps> & +export type ButtonProps = Omit< + React.ComponentProps, + keyof ButtonVariantProps +> & ButtonVariantProps; export function Button(props: ButtonProps) { diff --git a/src/app/ui/components/containers/footers/footer.stories.tsx b/src/app/ui/components/containers/footers/footer.stories.tsx index 16d15f3cbed..973a41595a0 100644 --- a/src/app/ui/components/containers/footers/footer.stories.tsx +++ b/src/app/ui/components/containers/footers/footer.stories.tsx @@ -1,7 +1,7 @@ import type { Meta } from '@storybook/react'; import { Flex, styled } from 'leather-styles/jsx'; -import { LeatherButton } from '@app/ui/components/button'; +import { Button } from '@app/ui/components/button/button'; import { AvailableBalance } from '@app/ui/components/containers/footers/available-balance'; import { Footer as Component } from './footer'; @@ -25,9 +25,9 @@ export default meta; export function Footer() { return ( - null}> + ); } @@ -36,10 +36,10 @@ export function SignOutConfirmFooter() { return ( - null}> + ); @@ -57,9 +57,9 @@ export function SignOutConfirmFooter() { export function ReceiveTokensFooter() { return ( - null}> + ); } @@ -70,7 +70,7 @@ export function ReceiveTokensFooter() { export function RequestPasswordFooter() { return ( - Continue - + ); } @@ -89,9 +89,9 @@ export function RequestPasswordFooter() { export function FooterWithText() { return ( - null}> + @@ -118,9 +118,9 @@ export function FooterWithText() { export function FooterWithLink() { return ( - null}> + {/* use new - null} type="submit"> + 0.00048208 BTC $ 1,100.00 - null} type="submit"> + ); } diff --git a/src/app/ui/components/containers/headers/header.tsx b/src/app/ui/components/containers/headers/header.tsx index b9e8c428928..42d17d6eeb1 100644 --- a/src/app/ui/components/containers/headers/header.tsx +++ b/src/app/ui/components/containers/headers/header.tsx @@ -3,7 +3,7 @@ import { SettingsSelectors } from '@tests/selectors/settings.selectors'; import { Flex, HStack, styled } from 'leather-styles/jsx'; import { useHover } from 'use-events'; -import { LeatherButton } from '@app/ui/components/button'; +import { Button } from '@app/ui/components/button/button'; import { ArrowLeftIcon } from '@app/ui/components/icons/arrow-left-icon'; import { CloseIcon } from '@app/ui/components/icons/close-icon'; import { HamburgerIcon } from '@app/ui/components/icons/hamburger-icon'; @@ -100,8 +100,9 @@ export function Header({ ) : undefined} navigate(RouteUrls.Home) : undefined} /> @@ -124,7 +125,7 @@ export function Header({ {/* // FIXME 4370 task #6 - network mode relies on accessing state so fails on Storybook */} null} /> {variant !== 'onboarding' && ( - setIsShowingSettings(!isShowingSettings)} @@ -132,7 +133,7 @@ export function Header({ variant="ghost" > - + )} {variant === 'page' && onClose && ( - {!hideSettings && ( - - )} + {/* TODO this should go with new header */} + {/* {!hideSettings && ( */} + + {/* )} */} ); diff --git a/src/app/ui/components/leather-logo.tsx b/src/app/ui/components/leather-logo.tsx index ea78d4a2214..097d67e976b 100644 --- a/src/app/ui/components/leather-logo.tsx +++ b/src/app/ui/components/leather-logo.tsx @@ -1,20 +1,22 @@ -import { ButtonProps, LeatherButton } from '@app/ui/components/button'; +import { styled } from 'leather-styles/jsx'; + import { LeatherIcon } from '@app/ui/components/icons/leather-icon'; -export function LeatherLogo(props: ButtonProps) { - const { onClick, ...rest } = props; +interface LeatherLogoProps { + onClick?(): void; +} +export function LeatherLogo({ onClick, ...rest }: LeatherLogoProps) { return ( - - + ); }