Ошибка заголовка профиля: не отображается (пользователь не найден) ⇐ CSS

[Anonymous]

Итак, я создал клон Instagram, в котором я захожу в раздел профиля, где говорится, что пользователь не найден, но в моем коде, когда я удаляю блок «наконец», он показывает только скелет, но он должен показать профиль через 1 секунду, пожалуйста, помогите я решаю это, введите описание изображения здесь, это изображение, когда записан блок «finally», введите описание изображения здесь, и это изображение, когда блок «finally» удален, произошла какая-то логическая ошибка, пожалуйста, помогите мне решить ее, и это код для

Код: Выделить всё

useGetUserProfileByUsername.js

import { useEffect, useState } from "react";
import useShowToast from "./useShowToast";
import { collection, getDocs, query, where } from "firebase/firestore";
import { firestore } from "../firebase/firebase";
import useUserProfileStore from "../store/userProfileStore";

const useGetUserProfileByUsername = (username) => {
const [isLoading, setIsLoading] = useState(true);
const showToast = useShowToast();
const {userProfile, setUserProfile} = useUserProfileStore();

useEffect(() => {
const getUserProfile = async () => {
setIsLoading(true);
try {
const q = query(
collection(firestore, "users"),
where("username", "==", username)
);
const querySnapshot = await getDocs(q);

if (querySnapshot.empty) return setUserProfile(null);
let userDoc;
querySnapshot.forEach((doc) => {
userDoc = doc.data();
});
setUserProfile(userDoc);
console.log(userDoc);
} catch (error) {
showToast("Error", error.message, "error");
}
};

getUserProfile();
}, [setUserProfile,username,showToast]);
return {isLoading, userProfile};
};

export default useGetUserProfileByUsername;

и это код для

Код: Выделить всё

UserProfileStore.js

Код: Выделить всё

import { create } from "zustand";

const useUserProfileStore = create((set) => ({
userProfile : null,
setUserProfile : (userProfile) => set({userProfile})
}))

export default useUserProfileStore

и это код для

Код: Выделить всё

ProfilePage.jsx

Код: Выделить всё

import { Container,Flex, Skeleton, SkeletonCircle, Text, VStack } from "@chakra-ui/react"
import ProfileHeader from "../../components/Profile/ProfileHeader"
import ProfilePosts from "../../components/Profile/ProfilePosts"
import ProfileTabs from "../../components/Profile/ProfileTabs"
import useGetUserProfileByUsername from "../../hooks/useGetUserProfileByUsername"
import { Link, useParams } from "react-router-dom"
import {Link as RouterLink} from  "react-router-dom"

const ProfilePage = () => {
const {username} = useParams()
const {isLoading,userProfile} = useGetUserProfileByUsername(username)

const userNotFound = !isLoading && !userProfile
if (userNotFound) return 

return (


{!isLoading && userProfile && 
}
{isLoading && }








)
}

export default ProfilePage

const ProfileHeaderSkeleton = () => {
return (








);
};

const UserNotFound = () => {
return (


User Not Found


Go Home


)
}

Я попробовал чатгпт, но он говорит: Советы по отладке
Проверьте конфигурацию Firebase:
Убедитесь, что ваш проект Firebase правильно настроен и Firestore правила разрешают доступ для чтения.
Добавить журналирование:
Добавьте больше журналов внутри функции getUserProfile, чтобы проверять, что происходит на каждом этапе.
Тестовый запрос отдельно:
Запустите запрос Firestore отдельно с помощью простого сценария, чтобы убедиться, что он возвращает ожидаемые результаты.

Подробнее здесь: https://stackoverflow.com/questions/787 ... ound-error