profile cache fix on wallet load

permaweb · Dec 20, 2024 · db26195 · db26195
1 parent 97b7351
commit db26195
Show file tree

Hide file tree

Showing 5 changed files with 26 additions and 27 deletions.
diff --git a/src/components/organisms/AssetsTable/AssetsTable.tsx b/src/components/organisms/AssetsTable/AssetsTable.tsx
@@ -63,7 +63,7 @@ export default function AssetsTable(props: IProps) {
 
 	React.useEffect(() => {
 		if (appProvider.stamps.completed) {
-			if (props.ids && !props.ids.length) {
+			if (props.ids?.length <= 0) {
 				setAssets([]);
 				setAssetsLoading(false);
 			} else {

diff --git a/src/components/organisms/Banner/Banner.tsx b/src/components/organisms/Banner/Banner.tsx
@@ -156,6 +156,7 @@ export default function Banner() {
 
 	React.useEffect(() => {
 		(async function () {
+			setShowVouch(false);
 			if (arProvider.vouch) {
 				if (!arProvider.vouch.isVouched) {
 					setShowVouch(true);
@@ -239,10 +240,13 @@ export default function Banner() {
 
 	return (
 		<>
-			{!updateApplied && (
+			{(showVouch || !updateApplied) && (
 				<S.Wrapper>
-					{/* <button onClick={() => setShowInfo(true)}>Welcome to AO Bazar!</button> */}
+					{showVouch && (
+						<button onClick={() => window.open('https://vouch-portal.arweave.net/#/', '_blank')}>Get vouched</button>
+					)}
 					{!updateApplied && <button onClick={() => setShowUpdate(true)}>Update your profile</button>}
+					{/* <button onClick={() => setShowInfo(true)}>Welcome to AO Bazar!</button> */}
 				</S.Wrapper>
 			)}
 			{!updateApplied && showUpdate && (
@@ -274,11 +278,6 @@ export default function Banner() {
 					</S.MWrapper>
 				</Modal>
 			)}
-			{showVouch && (
-				<S.Wrapper>
-					<button onClick={() => window.open('https://vouch-portal.arweave.net/#/', '_blank')}>Get vouched</button>
-				</S.Wrapper>
-			)}
 			{showVouch && showVouchAlert && (
 				<Modal header={'You are not vouched!'} handleClose={() => setShowVouchAlert(false)}>
 					<S.MWrapper className={'modal-wrapper'}>

diff --git a/src/providers/ArweaveProvider.tsx b/src/providers/ArweaveProvider.tsx
@@ -114,12 +114,17 @@ export function ArweaveProvider(props: ArweaveProviderProps) {
 	React.useEffect(() => {
 		handleWallet();
 
+		function handleWalletSwitch() {
+			setProfile(null);
+			handleWallet();
+		}
+
 		window.addEventListener('arweaveWalletLoaded', handleWallet);
-		window.addEventListener('walletSwitch', handleWallet);
+		window.addEventListener('walletSwitch', handleWalletSwitch);
 
 		return () => {
 			window.removeEventListener('arweaveWalletLoaded', handleWallet);
-			window.removeEventListener('walletSwitch', handleWallet);
+			window.removeEventListener('walletSwitch', handleWalletSwitch);
 		};
 	}, []);
 
@@ -139,8 +144,11 @@ export function ArweaveProvider(props: ArweaveProviderProps) {
 		(async function () {
 			if (wallet && walletAddress) {
 				try {
-					if (profilesReducer?.userProfiles?.[walletAddress]) setProfile(profilesReducer.userProfiles[walletAddress]);
-					else setProfile(await getProfileByWalletAddress({ address: walletAddress }));
+					if (profilesReducer?.userProfiles?.[walletAddress]) {
+						setProfile(profilesReducer.userProfiles[walletAddress]);
+					} else {
+						setProfile(await getProfileByWalletAddress({ address: walletAddress }));
+					}
 				} catch (e: any) {
 					console.error(e);
 				}
@@ -265,7 +273,6 @@ export function ArweaveProvider(props: ArweaveProviderProps) {
 	async function handleWallet() {
 		if (localStorage.getItem('walletType')) {
 			try {
-				setProfile(null);
 				await handleConnect(localStorage.getItem('walletType') as any);
 			} catch (e: any) {
 				console.error(e);

diff --git a/src/views/Profile/ProfileAssets/ProfileAssets.tsx b/src/views/Profile/ProfileAssets/ProfileAssets.tsx
@@ -17,7 +17,7 @@ const ProfileAssets = React.memo((props: IProps) => {
 		})();
 	}, [props.profile]);
 
-	return props.address ? (
+	return props.profile ? (
 		<S.Wrapper>
 			<AssetsTable
 				ids={assetIds}

diff --git a/src/views/Profile/index.tsx b/src/views/Profile/index.tsx
@@ -8,7 +8,6 @@ import { URLTabs } from 'components/molecules/URLTabs';
 import { ASSETS, URLS } from 'helpers/config';
 import { ProfileType } from 'helpers/types';
 import { checkValidAddress } from 'helpers/utils';
-import { useArweaveProvider } from 'providers/ArweaveProvider';
 import { useLanguageProvider } from 'providers/LanguageProvider';
 
 import { ProfileActivity } from './ProfileActivity';
@@ -22,8 +21,6 @@ export default function Profile() {
 
 	const { address, active } = useParams();
 
-	const arProvider = useArweaveProvider();
-
 	const languageProvider = useLanguageProvider();
 	const language = languageProvider.object[languageProvider.current];
 
@@ -43,21 +40,17 @@ export default function Profile() {
 	React.useEffect(() => {
 		(async function () {
 			if (address && checkValidAddress(address)) {
-				if (arProvider.profile && arProvider.profile.id && arProvider.profile.id === address) {
-					setProfile(arProvider.profile);
-				} else {
-					try {
-						const fetchedProfile = await getProfileById({ profileId: address });
-						setProfile(fetchedProfile);
-					} catch (e: any) {
-						console.error(e);
-					}
+				try {
+					const fetchedProfile = await getProfileById({ profileId: address });
+					setProfile(fetchedProfile);
+				} catch (e: any) {
+					console.error(e);
 				}
 			} else {
 				navigate(URLS.notFound);
 			}
 		})();
-	}, [address, arProvider.profile, location]);
+	}, [address, location]);
 
 	const TABS = React.useMemo(
 		() => [