-
- {PROFILE_MSG.FAVORITE_CATEGORY}
+ )}
+
+
+ {user?.nickname}
-
-
+
+ {user?.newsEmail}
+
+
+
+
+
+
+
+
+ {PROFILE_MSG.FAVORITE_CATEGORY}
-
- {PROFILE_MSG.DESCRIPTION}
-
-
- {user?.aboutMe}
-
+
+
+
+
+
+ {PROFILE_MSG.DESCRIPTION}
+
{user?.aboutMe}
- )}
+
>
)
}
diff --git a/src/components/ProfileEditButton/ProfileEditButton.tsx b/src/components/ProfileEditButton/ProfileEditButton.tsx
index 01c9e281..9f54dd5a 100644
--- a/src/components/ProfileEditButton/ProfileEditButton.tsx
+++ b/src/components/ProfileEditButton/ProfileEditButton.tsx
@@ -6,8 +6,6 @@ import { UserProfileResBody } from '@/types'
import { cls, getProfileButtonColor, getProfileButtonText } from '@/utils'
import { useRouter } from 'next/navigation'
import Button from '../common/Button/Button'
-import DeferredComponent from '../common/DeferedComponent/DeferedComponent'
-import Spinner from '../common/Spinner/Spinner'
const ProfileEditButton = ({ user }: { user: UserProfileResBody }) => {
const router = useRouter()
@@ -21,32 +19,37 @@ const ProfileEditButton = ({ user }: { user: UserProfileResBody }) => {
handleOpenCurrentModal,
})
+ const buttonColor = getProfileButtonColor({
+ isFollowing: user?.isFollowing,
+ memberId: user?.memberId,
+ myId,
+ })
+
+ const buttonText = getProfileButtonText({
+ isFollowing: user?.isFollowing,
+ memberId: user?.memberId,
+ myId,
+ })
+
return (
-
+ <>
+ {user?.memberId && myId && (
+
+ )}
+ >
)
}
diff --git a/src/components/common/FollowList/FollowList.tsx b/src/components/common/FollowList/FollowList.tsx
index 9739f381..b8108500 100644
--- a/src/components/common/FollowList/FollowList.tsx
+++ b/src/components/common/FollowList/FollowList.tsx
@@ -36,35 +36,34 @@ const FollowList = ({
type,
})
const { target } = useInfiniteScroll({ hasNextPage, fetchNextPage })
- useEffect(() => {
- console.log(isFollowLoading)
- }, [isFollowLoading])
- return isFollowLoading ? (
-
- ) : (
-
- {followList &&
- followList.pages.map((group, i) => (
-
- {group.responses?.map((user: FollowUserProps) => (
- -
-
-
- ))}
-
- ))}
-
-
+
+ return (
+ <>
+ {isFollowLoading &&
}
+
+ {followList &&
+ followList.pages.map((group, i) => (
+
+ {group.responses?.map((user: FollowUserProps) => (
+ -
+
+
+ ))}
+
+ ))}
+
+
+ >
)
}
diff --git a/src/hooks/useFollowUser.ts b/src/hooks/useFollowUser.ts
index 039c0983..6da30ab3 100644
--- a/src/hooks/useFollowUser.ts
+++ b/src/hooks/useFollowUser.ts
@@ -1,6 +1,5 @@
-import { useCallback, useMemo } from 'react'
+import { useCallback } from 'react'
import { useDeleteFollow, usePostFollow } from '@/services/users/useUsers'
-import { debounce } from 'lodash'
import { useCurrentUser } from './useCurrentUser'
export interface UseFollowUserProps {
@@ -25,23 +24,19 @@ const useFollowUser = ({
: profileId
: memberId
- const debounceUnFollowUser = useMemo(
+ const handleRemoveFollow = useCallback(
() =>
- debounce(async () => {
- await deleteFollow({
- memberId: targetMemberId,
- })
- }, 300),
+ deleteFollow({
+ memberId: targetMemberId,
+ }),
[targetMemberId, deleteFollow],
)
- const debounceFollowUser = useMemo(
+ const handleAddFollow = useCallback(
() =>
- debounce(async () => {
- await postFollow({
- memberId: targetMemberId,
- })
- }, 300),
+ postFollow({
+ memberId: targetMemberId,
+ }),
[targetMemberId, postFollow],
)
@@ -49,31 +44,26 @@ const useFollowUser = ({
(isFollowing: boolean) => {
if (isLoggedIn) {
if (isFollowing) {
- debounceUnFollowUser()
+ handleRemoveFollow()
} else {
- debounceFollowUser()
+ handleAddFollow()
}
} else {
handleOpenCurrentModal?.('login')
}
},
- [
- debounceUnFollowUser,
- debounceFollowUser,
- isLoggedIn,
- handleOpenCurrentModal,
- ],
+ [handleRemoveFollow, handleAddFollow, isLoggedIn, handleOpenCurrentModal],
)
const handleClickListInFollow = useCallback(
(isFollowing: boolean) => {
if (isFollowing) {
- debounceUnFollowUser()
+ handleRemoveFollow()
} else {
- debounceFollowUser()
+ handleAddFollow()
}
},
- [debounceUnFollowUser, debounceFollowUser],
+ [handleRemoveFollow, handleAddFollow],
)
return {