diff --git a/src/main/home/receive/ReceiveScreen.tsx b/src/main/home/receive/ReceiveScreen.tsx index 7b0a75ab..e6795508 100644 --- a/src/main/home/receive/ReceiveScreen.tsx +++ b/src/main/home/receive/ReceiveScreen.tsx @@ -25,6 +25,7 @@ import { Theme } from 'src/shared/types'; import { useThemedStyle } from 'src/shared/hooks/useThemedStyle'; import { abbreviateAddress } from 'src/shared/services/quais'; import { useSnackBar } from 'src/shared/context/snackBarContext'; +import { useWalletContext } from 'src/shared/context/walletContext'; import ShareControl from './ShareControl'; @@ -34,7 +35,8 @@ export const ReceiveScreen = () => { const { showSnackBar } = useSnackBar(); const isDarkMode = useColorScheme() === 'dark'; const navigation = useNavigation>(); - const profilePicture = useProfilePicture(); + const { profilePicture } = useWalletContext(); // get bare profile picture state + useProfilePicture(); // fetch profilePicture const username = useUsername(); const wallet = useWallet(); diff --git a/src/onboarding/screens/SetupNameAndPFPScreen.tsx b/src/onboarding/screens/SetupNameAndPFPScreen.tsx index 56a10138..fb8373fd 100644 --- a/src/onboarding/screens/SetupNameAndPFPScreen.tsx +++ b/src/onboarding/screens/SetupNameAndPFPScreen.tsx @@ -66,7 +66,7 @@ export const SetupNameAndPFPScreen: React.FC< if (!profilePicture) { await storeItem({ key: keychainKeys.profilePicture, - value: walletBlockie, + value: indexedZones[currentWalletIndex], }); } navigation.navigate('SetupLocation'); diff --git a/src/shared/components/QuaiPayCamera/QuaiPayCamera.hooks.ts b/src/shared/components/QuaiPayCamera/QuaiPayCamera.hooks.ts index a41588b3..36377253 100644 --- a/src/shared/components/QuaiPayCamera/QuaiPayCamera.hooks.ts +++ b/src/shared/components/QuaiPayCamera/QuaiPayCamera.hooks.ts @@ -16,6 +16,8 @@ import { } from 'src/shared/utils/seedPhrase'; import { ScannerType } from './QuaiPayCamera.types'; +import { Zone } from 'src/shared/types'; +import makeBlockie from 'ethereum-blockies-base64'; interface HookOutput { frameProcessor: (frame: Frame) => void; @@ -50,7 +52,10 @@ const useSendAmountScannerCamera = () => { params: { amount: amount || 0, receiverAddress: address, - receiverPFP: profilePicture, + // TODO: replace address to generate blockie with walletObject[zone] when setup + receiverPFP: Zone?.[profilePicture as keyof typeof Zone] + ? makeBlockie(address) + : profilePicture, receiverUsername: username, sender: sender!, }, diff --git a/src/shared/hooks/useProfilePicture.ts b/src/shared/hooks/useProfilePicture.ts index 24d5129a..cb2d9776 100644 --- a/src/shared/hooks/useProfilePicture.ts +++ b/src/shared/hooks/useProfilePicture.ts @@ -1,5 +1,8 @@ -import { useWalletContext } from 'src/shared/context/walletContext'; import { useEffect } from 'react'; +import makeBlockie from 'ethereum-blockies-base64'; + +import { useWalletContext } from 'src/shared/context/walletContext'; +import { Zone } from '../types'; export const useProfilePicture = (): string | undefined => { const { profilePicture, getProfilePicture } = useWalletContext(); @@ -8,5 +11,11 @@ export const useProfilePicture = (): string | undefined => { getProfilePicture(); } }, [profilePicture]); - return profilePicture; + return profilePicture && checkProfilePictureStringIsZone(profilePicture) + ? makeBlockie(profilePicture) + : profilePicture; }; + +// Check by indexing Zone enum. If valid, it will be true +const checkProfilePictureStringIsZone = (s: string) => + !!Zone?.[s as keyof typeof Zone];