101 lines
3.4 KiB
TypeScript
101 lines
3.4 KiB
TypeScript
import {
|
|
AlertDialog,
|
|
AlertDialogAction,
|
|
AlertDialogCancel,
|
|
AlertDialogContent,
|
|
AlertDialogDescription,
|
|
AlertDialogFooter,
|
|
AlertDialogHeader,
|
|
AlertDialogTitle,
|
|
} from '@/components/ui/alert-dialog'
|
|
import { IconButton } from '@/components/ui/button'
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuTrigger,
|
|
} from '@/components/ui/dropdown-menu'
|
|
import { useDeleteCharacter } from '@/hooks/aiUser'
|
|
import { useState } from 'react'
|
|
import { useAIUser } from '../context/aiUser'
|
|
import { useParams, useRouter } from 'next/navigation'
|
|
import { useNimChat, useNimConversation, useNimMsgContext } from '@/context/NimChat/useNimChat'
|
|
|
|
const UserActionDropdown = () => {
|
|
const router = useRouter()
|
|
const [isDeleteCharacterDialogOpen, setIsDeleteCharacterDialogOpen] = useState(false)
|
|
const { userId, isOwner } = useAIUser()
|
|
const { removeConversationById } = useNimConversation()
|
|
const { clearHistoryMessage } = useNimMsgContext()
|
|
const { nim } = useNimChat()
|
|
|
|
const { mutate: deleteCharacter, isPending: isDeleteCharacterLoading } = useDeleteCharacter({
|
|
aiId: Number(userId),
|
|
})
|
|
|
|
const handleDeleteCharacter = () => {
|
|
setIsDeleteCharacterDialogOpen(true)
|
|
}
|
|
|
|
const handleDeleteCharacterConfirm = async () => {
|
|
const conversationId = await nim.V2NIMConversationIdUtil.p2pConversationId(
|
|
`${userId}@r@t` as string
|
|
)
|
|
await removeConversationById(conversationId)
|
|
await clearHistoryMessage(conversationId)
|
|
await deleteCharacter({ aiId: Number(userId) })
|
|
router.replace('/profile')
|
|
}
|
|
|
|
if (!isOwner) return null
|
|
|
|
return (
|
|
<>
|
|
<div className="absolute top-0 right-0 left-0">
|
|
<div className="mx-auto max-w-[1120px] px-6">
|
|
<div className="relative w-full">
|
|
<div className="absolute top-0 right-0">
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<IconButton iconfont="icon-More" size="large" variant="tertiaryDark" />
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent align="end">
|
|
<DropdownMenuItem onClick={handleDeleteCharacter}>
|
|
<i className="iconfont icon-trashcan !text-[16px] leading-none" />
|
|
<span>Delete Character</span>
|
|
</DropdownMenuItem>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<AlertDialog open={isDeleteCharacterDialogOpen} onOpenChange={setIsDeleteCharacterDialogOpen}>
|
|
<AlertDialogContent>
|
|
<AlertDialogHeader>
|
|
<AlertDialogTitle>Delete Character</AlertDialogTitle>
|
|
</AlertDialogHeader>
|
|
<AlertDialogDescription>
|
|
Once deleted, the character cannot be restored. To ensure a good user experience, users
|
|
who have previously chatted with or made purchases for this character will still be able
|
|
to interact with them.
|
|
</AlertDialogDescription>
|
|
<AlertDialogFooter>
|
|
<AlertDialogCancel>Cancel</AlertDialogCancel>
|
|
<AlertDialogAction
|
|
variant="destructive"
|
|
loading={isDeleteCharacterLoading}
|
|
onClick={handleDeleteCharacterConfirm}
|
|
>
|
|
Delete
|
|
</AlertDialogAction>
|
|
</AlertDialogFooter>
|
|
</AlertDialogContent>
|
|
</AlertDialog>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default UserActionDropdown
|