Commit ed2e5189 authored by tom's avatar tom

fix modal behaviour

parent bb7df432
...@@ -64,7 +64,7 @@ const RewardsLoginModal = () => { ...@@ -64,7 +64,7 @@ const RewardsLoginModal = () => {
<DialogRoot <DialogRoot
open={ isLoginModalOpen && !isWalletModalOpen && !authModal.open } open={ isLoginModalOpen && !isWalletModalOpen && !authModal.open }
onOpenChange={ handleOpenChange } onOpenChange={ handleOpenChange }
size={{ base: 'full', lg: isLoginStep ? 'sm' : 'md' }} size={{ lgDown: 'full', lg: isLoginStep ? 'sm' : 'md' }}
> >
<DialogContent> <DialogContent>
<DialogHeader> <DialogHeader>
......
...@@ -170,7 +170,7 @@ const AuthModal = ({ initialScreen, onClose, mixpanelConfig, closeOnError }: Pro ...@@ -170,7 +170,7 @@ const AuthModal = ({ initialScreen, onClose, mixpanelConfig, closeOnError }: Pro
<DialogRoot <DialogRoot
open open
onOpenChange={ onModalOpenChange } onOpenChange={ onModalOpenChange }
size={{ base: 'full', lg: 'sm' }} size={{ lgDown: 'full', lg: 'sm' }}
// we need to allow user interact with element outside of dialog otherwise they can't click on recaptcha // we need to allow user interact with element outside of dialog otherwise they can't click on recaptcha
modal={ false } modal={ false }
// FIXME if we allow to close on interact outside, the dialog will be closed when user click on recaptcha // FIXME if we allow to close on interact outside, the dialog will be closed when user click on recaptcha
......
...@@ -24,7 +24,7 @@ interface Props { ...@@ -24,7 +24,7 @@ interface Props {
isPending?: boolean; isPending?: boolean;
} }
const UserProfileButton = ({ profileQuery, size, variant, onClick, isPending }: Props, ref: React.ForwardedRef<HTMLButtonElement>) => { const UserProfileButton = ({ profileQuery, size, variant, onClick, isPending, ...rest }: Props, ref: React.ForwardedRef<HTMLButtonElement>) => {
const [ isFetched, setIsFetched ] = useState(false); const [ isFetched, setIsFetched ] = useState(false);
const isMobile = useIsMobile(); const isMobile = useIsMobile();
...@@ -87,6 +87,7 @@ const UserProfileButton = ({ profileQuery, size, variant, onClick, isPending }: ...@@ -87,6 +87,7 @@ const UserProfileButton = ({ profileQuery, size, variant, onClick, isPending }:
px={ dataExists ? 2.5 : 4 } px={ dataExists ? 2.5 : 4 }
fontWeight={ dataExists ? 700 : 600 } fontWeight={ dataExists ? 700 : 600 }
loading={ isButtonLoading } loading={ isButtonLoading }
{ ...rest }
> >
{ content } { content }
</Button> </Button>
...@@ -94,4 +95,4 @@ const UserProfileButton = ({ profileQuery, size, variant, onClick, isPending }: ...@@ -94,4 +95,4 @@ const UserProfileButton = ({ profileQuery, size, variant, onClick, isPending }:
); );
}; };
export default React.memo(React.forwardRef(UserProfileButton)); export default React.forwardRef(UserProfileButton);
...@@ -73,7 +73,7 @@ const UserProfileDesktop = ({ buttonSize, buttonVariant = 'header' }: Props) => ...@@ -73,7 +73,7 @@ const UserProfileDesktop = ({ buttonSize, buttonVariant = 'header' }: Props) =>
return ( return (
<> <>
<PopoverRoot positioning={{ placement: 'bottom-end' }} lazyMount open={ profileMenu.open } onOpenChange={ handleOpenChange }> <PopoverRoot positioning={{ placement: 'bottom-end' }} open={ profileMenu.open } onOpenChange={ handleOpenChange }>
<PopoverTrigger> <PopoverTrigger>
<UserProfileButton <UserProfileButton
profileQuery={ profileQuery } profileQuery={ profileQuery }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment