+
{notificationData.map((data, index) => (
-
{
- setSelectedNotifycationId(data.id); setSelectedNotifycationType(data.type); setSelectedNotifycationSenderName((data.data as any)?.sender_name ?? null);setSelectedNotifycationSenderId((data.data as any)?.sender_id ?? null)}}
+ onClick={() => {
+ setSelectedNotifycationId(data.id)
+ setSelectedNotifycationType(data.type)
+ if (data.type === 'invite') {
+ // 엔빵 초대 알림일 경우
+ setSelectedNotifycationSenderName(
+ (data.data as any)?.nbreadTitle ?? null,
+ )
+ setSelectedNotifycationSenderId(
+ (data.data as any)?.nbreadId ?? null,
+ )
+ } else if (data.type === 'friend_request') {
+ // 친구 요청 알림일 경우
+ setSelectedNotifycationSenderName(
+ (data.data as any)?.sender_name ?? null,
+ )
+ setSelectedNotifycationSenderId(
+ (data.data as any)?.sender_id ?? null,
+ )
+ }
+ }}
>
{data.title}
@@ -115,13 +141,27 @@ const Page = () => {
))}
{setIsAcceptModalOpen(false); setSelectedNotifycationType(null)}}
- senderUserName={selectedNotifycationSenderName}
- receiverId={userData?.id as string}
- />
+ senderUserId={selectedNotifycationSenderId}
+ id={selectedNotifycationId}
+ isOpen={isAcceptModalOpen}
+ onClose={() => {
+ setIsAcceptModalOpen(false)
+ setSelectedNotifycationType(null)
+ }}
+ senderUserName={selectedNotifycationSenderName}
+ receiverId={userData?.id as string}
+ />
+ {
+ setIsInviteAcceptModalOpen(false)
+ setSelectedNotifycationType(null)
+ }}
+ senderNbreadId={selectedNotifycationSenderId}
+ senderNbreadTitle={selectedNotifycationSenderName}
+ receiverId={userData?.id as string}
+ />
)
}
diff --git a/src/components/invite/InviteAcceptModal.tsx b/src/components/invite/InviteAcceptModal.tsx
new file mode 100644
index 0000000..5adb893
--- /dev/null
+++ b/src/components/invite/InviteAcceptModal.tsx
@@ -0,0 +1,47 @@
+import Modal from '../common/modal/Modal'
+import { updateAcceptInvite } from '@/lib/invite/updateInvite'
+import { updateRejectedInvite } from '@/lib/invite/updateInvite'
+interface InviteAcceptModalProps {
+ id: number | null
+ isOpen: boolean
+ onClose: () => void
+ senderNbreadTitle: string | null
+ senderNbreadId: string | null
+ receiverId: string
+}
+const InviteAcceptModal = ({isOpen,onClose,senderNbreadTitle,senderNbreadId,receiverId} : InviteAcceptModalProps) => {
+ const fetchInviteAccept = async () => {
+ const acceptInviteData = await updateAcceptInvite(receiverId,senderNbreadId)
+ onClose()
+ }
+ const fetchInviteReject = async () => {
+ const rejectInviteData = await updateRejectedInvite(receiverId,senderNbreadId)
+ onClose()
+ }
+ return (
+
+
+
+
엔빵 초대를 수락하시겠어요?
+
+ {senderNbreadTitle}의 초대를 수락하시겠어요?
+
+
+
+
+
+
+
+ )
+}
+export default InviteAcceptModal
diff --git a/src/components/invite/InviteBottomSheet.tsx b/src/components/invite/InviteBottomSheet.tsx
index 798634d..0ab057d 100644
--- a/src/components/invite/InviteBottomSheet.tsx
+++ b/src/components/invite/InviteBottomSheet.tsx
@@ -5,102 +5,45 @@ import InviteUserListItem from './InviteUserListItem'
import DefaultAvatar from '@/assets/avatar.svg'
import { getInviteUser } from '@/lib/invite/getInviteUser'
import { useParams } from 'next/navigation'
+import { getFriendList } from '@/lib/friend/getSearchFriend'
+import { getInviteFriendList } from '@/lib/friend/getSearchFriend'
interface InviteBottomSheetProps {
isOpen: boolean
onClose: () => void
+ user: string | null
}
interface User {
avatar: any
name: string
status: string
+ userId: string
}
-const InviteBottomSheet = ({ isOpen, onClose }: InviteBottomSheetProps) => {
+interface Friend {
+ name: string
+ profileImage: string
+ inviteState?:string
+ tag: string
+ id:string
+
+}
+const InviteBottomSheet = ({ isOpen, onClose,user }: InviteBottomSheetProps) => {
const [searchData, setSearchData] = useState('') // 검색칸 입력 데이터
const [fetchSearchData, setFetchSearchData] = useState
([]) // Api 반환 데이터
const searchCache = useRef>({})
+ const [friendListData, setFriendData] = useState([])
const params = useParams()
const [nbreadId, setNbreadId] = useState('')
-
- const userFollowingData = [
- { id: 0, avatar: DefaultAvatar, name: '유성현', status: '초대 하기' },
- { id: 1, avatar: DefaultAvatar, name: '신혜민', status: '초대 하기' },
- { id: 2, avatar: DefaultAvatar, name: '강보석', status: '초대 하기' },
- {
- id: 3,
- avatar: DefaultAvatar,
- name: '송수빈',
- status: '초대 하기',
- },
- {
- id: 4,
- avatar: DefaultAvatar,
- name: '빌게이츠',
- status: '초대 완료',
- },
- {
- id: 5,
- avatar: DefaultAvatar,
- name: '이재용',
- status: '참여 중',
- },
- {
- id: 6,
- avatar: DefaultAvatar,
- name: '머스크',
- status: '초대 하기',
- },
- {
- id: 7,
- avatar: DefaultAvatar,
- name: '머스크',
- status: '초대 하기',
- },
- {
- id: 8,
- avatar: DefaultAvatar,
- name: '머스크',
- status: '초대 하기',
- },
- {
- id: 9,
- avatar: DefaultAvatar,
- name: '머스크',
- status: '초대 하기',
- },
- {
- id: 10,
- avatar: DefaultAvatar,
- name: '머스크',
- status: '초대 하기',
- },
- {
- id: 11,
- avatar: DefaultAvatar,
- name: '머스크',
- status: '초대 하기',
- },
- {
- id: 12,
- avatar: DefaultAvatar,
- name: '머스크',
- status: '초대 하기',
- },
- {
- id: 13,
- avatar: DefaultAvatar,
- name: '머스크',
- status: '초대 하기',
- },
- {
- id: 14,
- avatar: DefaultAvatar,
- name: '머스크',
- status: '초대 하기',
- },
- ]
+ const [invitedUserId,setInvitedUserId] = useState('')
+ const fetchFriendList = async () => {
+ const fetchFriendListData = await getFriendList(user, params.nbreadId as string)
+ setFriendData(fetchFriendListData)
+ console.log('친구ㅡ 목 : ',friendListData)
+ }
+
useEffect(() => {
if (isOpen) {
setSearchData('')
+ fetchFriendList()
}
}, [isOpen])
@@ -118,12 +61,15 @@ const InviteBottomSheet = ({ isOpen, onClose }: InviteBottomSheetProps) => {
}
const apiDataRaw =
(await getInviteUser(searchData, params.nbreadId as string)) || []
+ console.log('검색 유저! : ',apiDataRaw)
const apiData: User[] = apiDataRaw.map((u) => ({
avatar: u.profile_image, // profile_image → avatar로 매핑
name: u.name,
status: u.status,
- }))
+ userId:u.id,
+ }))
+console.log('제발 상태야~~ :',apiData)
// 캐시에 저장
console.log(apiData)
searchCache.current[searchData] = apiData
@@ -133,7 +79,23 @@ const InviteBottomSheet = ({ isOpen, onClose }: InviteBottomSheetProps) => {
return () => clearTimeout(typingSearchData)
}
}, [searchData])
+const refreshLists = async () => {
+ // ✅ 1. 팔로잉 갱신
+ await fetchFriendList()
+ // ✅ 2. 검색 결과 갱신 (검색어가 있을 때만)
+ if (searchData.length === 4) {
+ const apiDataRaw = await getInviteUser(searchData, params.nbreadId as string) || []
+ const apiData: User[] = apiDataRaw.map((u) => ({
+ avatar: u.profile_image,
+ name: u.name,
+ status: u.status,
+ userId: u.id,
+ }))
+
+ setFetchSearchData(apiData)
+ }
+}
return (
<>
@@ -165,9 +127,12 @@ const InviteBottomSheet = ({ isOpen, onClose }: InviteBottomSheetProps) => {
{fetchSearchData.map((user, index) => (
))}
@@ -177,12 +142,15 @@ const InviteBottomSheet = ({ isOpen, onClose }: InviteBottomSheetProps) => {
팔로잉
- {userFollowingData.map((user) => (
+ {friendListData?.map((user) => (
))}
diff --git a/src/components/invite/InviteUserListItem.tsx b/src/components/invite/InviteUserListItem.tsx
index 37714d9..082d650 100644
--- a/src/components/invite/InviteUserListItem.tsx
+++ b/src/components/invite/InviteUserListItem.tsx
@@ -1,28 +1,67 @@
import DefaultAvatar from '@/assets/avatar.svg'
import Avatar from '../common/avatar/avatar'
+import { sendInviteRequest } from '@/lib/invite/sendInviteRequest'
+import { useEffect } from 'react'
+import { useState } from 'react'
interface InviteUserData {
avatar: string | null
name: string
status: string
+ nbreadId: string
+ invitedUserId: string
+ onRefresh?: () => void
}
-const InviteUserListItem = ({ avatar, name, status }: InviteUserData) => {
- const getInviteUserStatus = (status: string) => {
- switch (status) {
- case '초대 하기':
- return { color: 'text-system-blue01', cursor: 'cursor-pointer' }
- case '참여 중':
- return { color: 'text-gray-400', cursor: null }
- case '초대 완료':
- return { color: 'text-gray-400', cursor: null }
- default:
- return { color: 'text-black', cursor: 'cursor-pointer' }
+const InviteUserListItem = ({ avatar, name, status,nbreadId,invitedUserId,onRefresh }: InviteUserData) => {
+ const [sendStatus, setSendStatus] = useState(status)
+ const [color, setColor] = useState('')
+ const [cursor, setCursor] = useState('')
+ // const getInviteUserStatus = (status: string) => {
+ // switch (status) {
+ // case '초대 하기':
+ // return { color: 'text-system-blue01', cursor: 'cursor-pointer' }
+ // case '참여 중':
+ // return { color: 'text-gray-400', cursor: null }
+ // case '초대 완료':
+ // return { color: 'text-gray-400', cursor: null }
+ // default:
+ // return { color: 'text-black', cursor: 'cursor-pointer' }
+ // }
+ // }
+ useEffect(() => {
+ if (status == '초대 완료') {
+ setSendStatus('초대 완료')
+ setColor('text-gray-400')
+ setCursor('cursor-default')
}
- }
- const { color, cursor } = getInviteUserStatus(status)
+ else if(status =='초대 하기'){
+ setSendStatus('초대 하기')
+ setColor('text-system-blue01')
+ setCursor('cursor-pointer')
+ }
+ else if(status =='rejected') {
+ setSendStatus('초대 하기')
+ setColor('text-system-blue01')
+ setCursor('cursor-pointer')
+ }
+ else {
+ setSendStatus('')
+ setColor('')
+ setCursor('')
+ }
+ }, [status])
+ // const { color, cursor } = getInviteUserStatus(status)
- const handleClick = (status: string) => {
- if (status == '초대 하기') {
+ const handleClick = async(status: string) => {
+ if (status == '초대 하기' || status == 'rejected') {
+ console.log('glgl',status)
+ console.log('현재 엔빵 아디: ',nbreadId)
+ console.log('초대보낼 유저 아이디 : ', invitedUserId)
+ const fetchInvite = await sendInviteRequest(nbreadId,invitedUserId,'pending')
console.log('초대 보냄')
+ setSendStatus('요청 완료')
+ setColor('text-gray-400')
+ setCursor('cursor-default')
+ if (onRefresh) onRefresh()
}
}
return (
@@ -45,7 +84,7 @@ const InviteUserListItem = ({ avatar, name, status }: InviteUserData) => {
className={`${color} text-body01 ${cursor}`}
onClick={() => handleClick(status)}
>
- {status}
+ {sendStatus}