Madhura68
5e0308d42e
Convert all !isDemo && <Button> patterns to <DemoTooltip show={isDemo}>
<Button disabled={isDemo}> so demo visitors see app capabilities.
Affects: pbi-list, story-panel, story-dialog, task-list, sprint-backlog,
token-manager, product-list, activate-product-button, leave-product-button,
settings page.
49 lines
1.3 KiB
TypeScript
49 lines
1.3 KiB
TypeScript
'use client'
|
|
|
|
import { useState, useTransition } from 'react'
|
|
import { Button } from '@/components/ui/button'
|
|
import { DemoTooltip } from '@/components/shared/demo-tooltip'
|
|
import { leaveProductAction } from '@/actions/products'
|
|
|
|
interface LeaveProductButtonProps {
|
|
productId: string
|
|
isDemo?: boolean
|
|
}
|
|
|
|
export function LeaveProductButton({ productId, isDemo = false }: LeaveProductButtonProps) {
|
|
const [confirming, setConfirming] = useState(false)
|
|
const [isPending, startTransition] = useTransition()
|
|
|
|
function handleLeave() {
|
|
startTransition(async () => {
|
|
await leaveProductAction(productId)
|
|
})
|
|
}
|
|
|
|
if (confirming) {
|
|
return (
|
|
<div className="flex gap-2 shrink-0">
|
|
<Button variant="destructive" size="sm" disabled={isPending} onClick={handleLeave}>
|
|
{isPending ? 'Bezig…' : 'Ja, verlaten'}
|
|
</Button>
|
|
<Button variant="ghost" size="sm" onClick={() => setConfirming(false)} disabled={isPending}>
|
|
Annuleren
|
|
</Button>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<DemoTooltip show={isDemo}>
|
|
<Button
|
|
variant="outline"
|
|
size="sm"
|
|
className="shrink-0 border-error/40 text-error hover:bg-error/10"
|
|
disabled={isDemo}
|
|
onClick={() => !isDemo && setConfirming(true)}
|
|
>
|
|
Verlaten
|
|
</Button>
|
|
</DemoTooltip>
|
|
)
|
|
}
|