fixes

lib/hooks/useFetchProfileInfo.tsx

+import { useQuery } from '@tanstack/react-query';
+
+import type { UserInfo } from 'types/api/account';
+
+import fetch from 'lib/client/fetch';
+
+export default function useFetchProfileInfo() {
+  return useQuery<unknown, unknown, UserInfo>([ 'profile' ], async() => {
+    return fetch('/api/account/profile');
+  }, { refetchOnMount: false });
+}

ui/blocks/profileMenu/ProfileMenuDesktop.tsx

 import { Popover, PopoverContent, PopoverBody, PopoverTrigger, Button } from '@chakra-ui/react';
-import { useQuery } from '@tanstack/react-query';
 import React from 'react';
 
-import type { UserInfo } from 'types/api/account';
-
+import useFetchProfileInfo from 'lib/hooks/useFetchProfileInfo';
 import ProfileMenuContent from 'ui/blocks/profileMenu/ProfileMenuContent';
 import UserAvatar from 'ui/shared/UserAvatar';
 
 const ProfileMenuDesktop = () => {
-  const { data } = useQuery<unknown, unknown, UserInfo>([ 'profile' ], async() => {
-    const response = await fetch('/api/account/profile');
-    if (!response.ok) {
-      throw new Error('Network response was not ok');
-    }
-    return response.json();
-  });
+  const { data } = useFetchProfileInfo();
 
   return (
     <Popover openDelay={ 300 } placement="bottom-end" gutter={ 10 } isLazy>

ui/blocks/profileMenu/ProfileMenuMobile.tsx

 import { Flex, Box, Drawer, DrawerOverlay, DrawerContent, DrawerBody, useDisclosure } from '@chakra-ui/react';
-import { useQuery } from '@tanstack/react-query';
 import React from 'react';
 
-import type { UserInfo } from 'types/api/account';
-
+import useFetchProfileInfo from 'lib/hooks/useFetchProfileInfo';
 import ColorModeToggler from 'ui/blocks/header/ColorModeToggler';
 import ProfileMenuContent from 'ui/blocks/profileMenu/ProfileMenuContent';
 import UserAvatar from 'ui/shared/UserAvatar';
@@ -11,13 +9,7 @@ import UserAvatar from 'ui/shared/UserAvatar';
 const ProfileMenuMobile = () => {
   const { isOpen, onOpen, onClose } = useDisclosure();
 
-  const { data } = useQuery<unknown, unknown, UserInfo>([ 'profile' ], async() => {
-    const response = await fetch('/api/account/profile');
-    if (!response.ok) {
-      throw new Error('Network response was not ok');
-    }
-    return response.json();
-  });
+  const { data } = useFetchProfileInfo();
 
   return (
     <>

ui/pages/MyProfile.tsx

@@ -6,6 +6,7 @@ import type { UserInfo } from 'types/api/account';
 
 import AccountPageHeader from 'ui/shared/AccountPageHeader';
 import ContentLoader from 'ui/shared/ContentLoader';
+import DataFetchAlert from 'ui/shared/DataFetchAlert';
 import Page from 'ui/shared/Page/Page';
 import UserAvatar from 'ui/shared/UserAvatar';
 
@@ -19,10 +20,14 @@ const MyProfile = () => {
   });
 
   const content = (() => {
-    if (isLoading || isError) {
+    if (isLoading) {
       return <ContentLoader/>;
     }
 
+    if (isError) {
+      return <DataFetchAlert/>;
+    }
+
     return (
       <VStack maxW="412px" mt={ 12 } gap={ 5 } alignItems="stretch">
         <UserAvatar size={ 64 } data={ data }/>