José Almeida
49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
import type { RefObject } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import type { TaskWalkthrough } from "@/lib/types/http";
|
|
import { useResponsiveBreakpoint } from "@/hooks/use-responsive-breakpoint";
|
|
import { ActionConfirmPopover } from "@/components/confirmation/action-confirm-popover";
|
|
import { MobileActionConfirmation } from "@/components/confirmation/mobile-action-confirmation";
|
|
|
|
export function WalkthroughDiscardConfirmation({
|
|
taskId,
|
|
walkthrough,
|
|
open,
|
|
disabled,
|
|
anchorRef,
|
|
onOpenChange,
|
|
onConfirm,
|
|
}: {
|
|
taskId: string;
|
|
walkthrough: TaskWalkthrough;
|
|
open: boolean;
|
|
disabled: boolean;
|
|
anchorRef: RefObject<HTMLButtonElement | null>;
|
|
onOpenChange: (open: boolean) => void;
|
|
onConfirm: () => Promise<void>;
|
|
}) {
|
|
const { t } = useTranslation();
|
|
const { isFinePointer } = useResponsiveBreakpoint();
|
|
const actions = {
|
|
open,
|
|
onOpenChange,
|
|
onConfirm,
|
|
title: t("review:discardWalkthroughTitle"),
|
|
description: t("review:discardWalkthroughDescription"),
|
|
cancelLabel: t("common:cancel"),
|
|
confirmLabel: t("review:discardWalkthrough"),
|
|
confirmTestId: "walkthrough-discard-confirm",
|
|
testId: "walkthrough-discard-confirmation",
|
|
};
|
|
return (
|
|
<MobileActionConfirmation
|
|
{...actions}
|
|
targetKey={`${taskId}:${walkthrough.id}:${walkthrough.updated_at}`}
|
|
subject={walkthrough.title}
|
|
focusReturnRef={anchorRef}
|
|
disabled={disabled}
|
|
fallback={isFinePointer ? <ActionConfirmPopover {...actions} anchorRef={anchorRef} /> : null}
|
|
/>
|
|
);
|
|
}
|