56 lines
1.5 KiB
TypeScript
56 lines
1.5 KiB
TypeScript
'use client'
|
|
|
|
import { useState, useTransition } from 'react'
|
|
import { Button } from '@/components/ui/button'
|
|
import { archiveProductAction } from '@/actions/products'
|
|
import { debugProps } from '@/lib/debug'
|
|
|
|
interface ArchiveProductButtonProps {
|
|
productId: string
|
|
}
|
|
|
|
export function ArchiveProductButton({ productId }: ArchiveProductButtonProps) {
|
|
const [confirming, setConfirming] = useState(false)
|
|
const [isPending, startTransition] = useTransition()
|
|
|
|
function handleArchive() {
|
|
startTransition(async () => {
|
|
await archiveProductAction(productId)
|
|
})
|
|
}
|
|
|
|
if (confirming) {
|
|
return (
|
|
<div className="flex gap-2 shrink-0" {...debugProps('archive-product-button', 'ArchiveProductButton', 'components/products/archive-product-button.tsx')}>
|
|
<Button
|
|
variant="destructive"
|
|
size="sm"
|
|
disabled={isPending}
|
|
onClick={handleArchive}
|
|
>
|
|
{isPending ? 'Bezig…' : 'Ja, archiveer'}
|
|
</Button>
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
onClick={() => setConfirming(false)}
|
|
disabled={isPending}
|
|
>
|
|
Annuleren
|
|
</Button>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<Button
|
|
variant="outline"
|
|
size="sm"
|
|
className="shrink-0 border-error/40 text-error hover:bg-error/10"
|
|
onClick={() => setConfirming(true)}
|
|
{...debugProps('archive-product-button', 'ArchiveProductButton', 'components/products/archive-product-button.tsx')}
|
|
>
|
|
Archiveren
|
|
</Button>
|
|
)
|
|
}
|