PurgeQueue.tsx60 lines · main
1import { toast } from 'sonner'
2
3import { TextConfirmModal } from '@/components/ui/TextConfirmModalWrapper'
4import { useDatabaseQueuePurgeMutation } from '@/data/database-queues/database-queues-purge-mutation'
5import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject'
6
7interface PurgeQueueProps {
8 queueName: string
9 visible: boolean
10 onClose: () => void
11}
12
13export const PurgeQueue = ({ queueName, visible, onClose }: PurgeQueueProps) => {
14 const { data: project } = useSelectedProjectQuery()
15
16 const { mutate: purgeDatabaseQueue, isPending } = useDatabaseQueuePurgeMutation({
17 onSuccess: () => {
18 toast.success(`Successfully purged queue ${queueName}`)
19 onClose()
20 },
21 })
22
23 async function handlePurge() {
24 if (!project) return console.error('Project is required')
25
26 purgeDatabaseQueue({
27 queueName: queueName,
28 projectRef: project.ref,
29 connectionString: project.connectionString,
30 })
31 }
32
33 if (!queueName) {
34 return null
35 }
36
37 return (
38 <TextConfirmModal
39 variant="warning"
40 visible={visible}
41 onCancel={() => onClose()}
42 onConfirm={handlePurge}
43 title="Purge this queue"
44 loading={isPending}
45 confirmLabel={`Purge queue ${queueName}`}
46 confirmPlaceholder="Type in name of queue"
47 confirmString={queueName ?? 'Unknown'}
48 text={
49 <>
50 <span>This will purge the queue</span>{' '}
51 <span className="text-bold text-foreground">{queueName}</span>
52 </>
53 }
54 alert={{
55 title:
56 "This action will delete all messages from the queue. They can't be recovered afterwards.",
57 }}
58 />
59 )
60}