diff --git a/src/components/masa-interface/masa-interface.tsx b/src/components/masa-interface/masa-interface.tsx index ff824d79..735c68e0 100644 --- a/src/components/masa-interface/masa-interface.tsx +++ b/src/components/masa-interface/masa-interface.tsx @@ -60,7 +60,7 @@ export const MasaInterface = ({ ) return 'createSoulname'; - if (!identity?.identityId && scope?.includes('identity')) + if (isLoggedIn && !identity?.identityId && scope?.includes('identity')) return 'createIdentity'; if (identity && !creditScores?.length && scope?.includes('credit-score')) @@ -86,6 +86,7 @@ export const MasaInterface = ({ open={isModalOpen as boolean} close={(): void => closeModal?.()} setOpen={setModalOpen as (val: boolean) => void} + height={page === 'createIdentity' ? 340 : undefined} > {page === 'connector' ? pages[page]({ disableMetamask }) : pages[page]} diff --git a/src/components/masa-interface/pages/connector/connector.tsx b/src/components/masa-interface/pages/connector/connector.tsx index 1a02d064..ccce944f 100644 --- a/src/components/masa-interface/pages/connector/connector.tsx +++ b/src/components/masa-interface/pages/connector/connector.tsx @@ -15,7 +15,10 @@ export const InterfaceConnector = ({

Select a wallet

By connecting your wallet, you agree to our{' '} - Terms of Service and{' '} + + Terms of Service + {' '} + and{' '} { - const { handlePurchaseIdentity, handleLogout, isLoading } = useMasa(); + const { handlePurchaseIdentity, isLoading } = useMasa(); const createIdentity = useCallback(async () => { await handlePurchaseIdentity?.(); @@ -13,22 +13,14 @@ export const InterfaceCreateIdentity = (): JSX.Element => { return (

-
-

It looks like you don't have an identity

-

Create your identity to enable all its benefits

-
- -
- -
handleLogout?.()} - > -

I don't want to create an identity

-
-
+

Hurray! 🎉

+

+ Congratulations you already have a Celo Domain Name in your wallet. You + must now mint a Celo Prosperity Passport. +

+
); }; diff --git a/src/components/modal/modal.tsx b/src/components/modal/modal.tsx index c0bcfe46..f68242bc 100644 --- a/src/components/modal/modal.tsx +++ b/src/components/modal/modal.tsx @@ -8,17 +8,19 @@ export interface ModalProps { open: boolean; setOpen: (val: boolean) => void; close: () => void; + height?: number; } export const ModalComponent = ({ children, open, close, + height, }: ModalProps): JSX.Element => { return ( close()} diff --git a/src/components/modal/styles.scss b/src/components/modal/styles.scss index 85dbe112..ef303459 100644 --- a/src/components/modal/styles.scss +++ b/src/components/modal/styles.scss @@ -282,6 +282,32 @@ } } + .interface-create-identity { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + gap: 16px; + + h3 { + font-size: 30px; + margin-bottom: 0; + } + + p { + font-size: 18px; + text-align: center; + line-height: 24px; + color: rgba(0, 0, 0, 0.6); + } + + button { + width: fit-content; + padding-left: 2rem; + padding-right: 2rem; + } + } + .interface-authenticate, .interface-connected { .title { diff --git a/src/provider/masa-context-provider.tsx b/src/provider/masa-context-provider.tsx index c1861599..ada8bab2 100644 --- a/src/provider/masa-context-provider.tsx +++ b/src/provider/masa-context-provider.tsx @@ -80,8 +80,7 @@ export const MasaContextProvider = ({ // soul names const { soulnames, isSoulnamesLoading, reloadSoulnames } = useSoulnames( masaInstance, - walletAddress, - identity + walletAddress ); // credit scores diff --git a/src/provider/modules/soulnames/soulnames.ts b/src/provider/modules/soulnames/soulnames.ts index 38271f05..9e431700 100644 --- a/src/provider/modules/soulnames/soulnames.ts +++ b/src/provider/modules/soulnames/soulnames.ts @@ -1,16 +1,11 @@ import { useQuery } from 'react-query'; import { Masa, PaymentMethod, SoulNameDetails } from '@masa-finance/masa-sdk'; -import { BigNumber } from 'ethers'; import { useCallback, useMemo } from 'react'; import { queryClient } from '../../masa-query-client'; export const useSoulnames = ( masa?: Masa, - walletAddress?: string, - identity?: { - identityId?: BigNumber | undefined; - address?: string | undefined; - } + walletAddress?: string ): { soulnames: SoulNameDetails[] | undefined; status: string; @@ -38,7 +33,7 @@ export const useSoulnames = ( queryKey, () => masa?.soulName.list(), { - enabled: !!masa && !!walletAddress && !!identity?.identityId, + enabled: !!masa && !!walletAddress, retry: false, onSuccess: (soulNames?: SoulNameDetails[]) => { if (masa?.config.verbose) { diff --git a/stories/masa.stories.tsx b/stories/masa.stories.tsx index ae5c6465..1b011be9 100644 --- a/stories/masa.stories.tsx +++ b/stories/masa.stories.tsx @@ -30,7 +30,7 @@ const Component = (): JSX.Element => { const handleConnect = useCallback(() => { connect?.({ - scope: ['auth', 'soulname'], + scope: ['auth', 'soulname', 'identity'], callback: function () { alert('hello hello connected'); },