95 lines
2.4 KiB
TypeScript
95 lines
2.4 KiB
TypeScript
'use client';
|
|
|
|
import { useTransition } from 'react';
|
|
|
|
import { useRouter } from 'next/navigation';
|
|
|
|
import { useTranslations } from 'next-intl';
|
|
|
|
import {
|
|
AlertDialog,
|
|
AlertDialogAction,
|
|
AlertDialogCancel,
|
|
AlertDialogContent,
|
|
AlertDialogDescription,
|
|
AlertDialogFooter,
|
|
AlertDialogHeader,
|
|
AlertDialogTitle,
|
|
AlertDialogTrigger,
|
|
} from '@kit/ui/alert-dialog';
|
|
import { Button } from '@kit/ui/button';
|
|
import { toast } from '@kit/ui/sonner';
|
|
|
|
interface PublishToggleButtonProps {
|
|
pageId: string;
|
|
accountId: string;
|
|
isPublished: boolean;
|
|
}
|
|
|
|
export function PublishToggleButton({
|
|
pageId,
|
|
accountId,
|
|
isPublished,
|
|
}: PublishToggleButtonProps) {
|
|
const router = useRouter();
|
|
const t = useTranslations('siteBuilder');
|
|
const [isPending, startTransition] = useTransition();
|
|
|
|
const handleToggle = () => {
|
|
startTransition(async () => {
|
|
try {
|
|
const response = await fetch(
|
|
`/api/site-builder/pages/${pageId}/publish`,
|
|
{
|
|
method: 'PATCH',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ accountId, isPublished: !isPublished }),
|
|
},
|
|
);
|
|
|
|
if (!response.ok) {
|
|
toast.error(t('pages.toggleError'));
|
|
return;
|
|
}
|
|
|
|
router.refresh();
|
|
} catch (error) {
|
|
console.error('Failed to toggle publish state:', error);
|
|
toast.error(t('pages.toggleError'));
|
|
}
|
|
});
|
|
};
|
|
|
|
return (
|
|
<AlertDialog>
|
|
<AlertDialogTrigger
|
|
render={
|
|
<Button
|
|
size="sm"
|
|
variant={isPublished ? 'secondary' : 'default'}
|
|
disabled={isPending}
|
|
>
|
|
{isPublished ? t('pages.hide') : t('pages.publish')}
|
|
</Button>
|
|
}
|
|
/>
|
|
<AlertDialogContent>
|
|
<AlertDialogHeader>
|
|
<AlertDialogTitle>
|
|
{isPublished ? t('pages.hideTitle') : t('pages.publishTitle')}
|
|
</AlertDialogTitle>
|
|
<AlertDialogDescription>
|
|
{isPublished ? t('pages.hideDesc') : t('pages.publishDesc')}
|
|
</AlertDialogDescription>
|
|
</AlertDialogHeader>
|
|
<AlertDialogFooter>
|
|
<AlertDialogCancel>{t('pages.cancelAction')}</AlertDialogCancel>
|
|
<AlertDialogAction onClick={handleToggle} disabled={isPending}>
|
|
{isPublished ? t('pages.hide') : t('pages.publish')}
|
|
</AlertDialogAction>
|
|
</AlertDialogFooter>
|
|
</AlertDialogContent>
|
|
</AlertDialog>
|
|
);
|
|
}
|