- {myBets.map((bet) => {
+ {myBets.map((bet) => {
console.log(`Bet ${bet}`);
const game = games.find((g) => g.id === bet.id);
+ let ownerPFP = bet.ownerProfile?.x_profile_url || `${API_BASE_URL}profile_pics/${bet.ownerProfile?.id}.jpg`;
if (!game) return null;
+ // Check if this image has already failed to load
+ if (failedImages.has(ownerPFP)) {
+ ownerPFP = defaultPFP;
+ }
+
return (
{
+ // @ts-ignore
+ e.target.src = defaultPFP;
+ setFailedImages(prev => new Set(prev).add(ownerPFP));
+ }}
/>
{bet.ownerProfile.username}
@@ -208,13 +222,26 @@ export default function YourGames({ bets }: GameModalProps) {
<>
Offered by:
-
+ {(() => {
+ let modalOwnerPFP = selectedBet.ownerProfile.x_profile_url || `${API_BASE_URL}profile_pics/${selectedBet.ownerProfile.id}.jpg`;
+ if (failedImages.has(modalOwnerPFP)) {
+ modalOwnerPFP = defaultPFP;
+ }
+ return (
+
{
+ // @ts-ignore
+ e.target.src = defaultPFP;
+ setFailedImages(prev => new Set(prev).add(modalOwnerPFP));
+ }}
+ />
+ );
+ })()}
{selectedBet.ownerProfile.username}
>
diff --git a/src/components/PrivyButton.tsx b/src/components/PrivyButton.tsx
index a69c317..393b67a 100644
--- a/src/components/PrivyButton.tsx
+++ b/src/components/PrivyButton.tsx
@@ -5,7 +5,7 @@ import { usePrivy, useSolanaWallets } from "@privy-io/react-auth";
import { Connection, PublicKey } from "@solana/web3.js";
import { toast } from "sonner";
import "react-toastify/dist/ReactToastify.css";
-import { CLUSTER_URL, API_URL } from "@/data/shared";
+import { CLUSTER_URL, API_URL, API_BASE_URL } from "@/data/shared";
import { useFundWallet } from "@privy-io/react-auth/solana";
import axios from "axios";
import { Game } from "@/types/Game";
@@ -40,6 +40,8 @@ export default function PrivyButton() {
const [opponentInfo, setOpponentInfo] = useState<{ [key: string]: Opponent }>({});
const [gameImages, setGameImages] = useState<{ [key: string]: string }>({});
const [loading, setLoading] = useState(false);
+ const [failedImages, setFailedImages] = useState
>(new Set());
+ const defaultPFP = '/duelfiassets/PFP (1).png';
const [username, setUsername] = useState("Tester");
const [bio, setBio] = useState("");
@@ -117,7 +119,7 @@ export default function PrivyButton() {
setBio(data.bio || "");
// Check if the user has a profile picture URL and update in database
- const customProfileUrl = `https://vps.playpoolstudios.com/duelfi/profile_pics/${user.id}.jpg`;
+ const customProfileUrl = `${API_URL}profile_pics/${user.id}.jpg`;
const profilePictureUrl = user?.twitter?.profilePictureUrl ?? customProfileUrl;
if (profilePictureUrl) {
const updatePicUrlApi = `${API_URL}update_x_pic_url.php?id=${user?.id}&url=${profilePictureUrl}`;
@@ -240,7 +242,7 @@ export default function PrivyButton() {
};
const twitterProfilePic: string = user?.twitter?.profilePictureUrl ?? "";
- const customProfileUrl = `https://vps.playpoolstudios.com/duelfi/profile_pics/${user?.id}.jpg`;
+ const customProfileUrl = `${API_BASE_URL}profile_pics/${user?.id}.jpg`;
useEffect(() => {
if (isModalOpen && user) {
@@ -536,7 +538,7 @@ export default function PrivyButton() {
const profileUrl =
opponent?.x_profile_url ||
(opponent?.username
- ? `https://vps.playpoolstudios.com/duelfi/profile_picture/${opponent.username}.jpg`
+ ? `${API_URL}profile_picture/${opponent.username}.jpg`
: "/duelfiassets/default-avatar.png");
const gameImageUrl = gameImages[game.game] || "/duelfiassets/default-game-thumbnail.png";
@@ -570,18 +572,28 @@ export default function PrivyButton() {