Skip to content

Commit

Permalink
[UI v2] feat: Add AutomationsDeleteDialog (#16595)
Browse files Browse the repository at this point in the history
  • Loading branch information
devinvillarosa authored Jan 3, 2025
1 parent 85f6e26 commit 45fc50f
Show file tree
Hide file tree
Showing 5 changed files with 127 additions and 1 deletion.
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import { createFakeAutomation } from "@/mocks";
import { reactQueryDecorator } from "@/storybook/utils";
import type { Meta, StoryObj } from "@storybook/react";
import { fn } from "@storybook/test";
import { AutomationsDeleteDialog } from "./automations-delete-dialog";

const meta = {
title: "Components/Automations/AutomationsDeleteDialog",
component: AutomationsDeleteDialog,
decorators: [reactQueryDecorator],
args: {
automation: createFakeAutomation(),
onOpenChange: fn(),
onDelete: fn(),
},
} satisfies Meta<typeof AutomationsDeleteDialog>;

export default meta;

export const story: StoryObj = { name: "AutomationsDeleteDialog" };
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import { Toaster } from "@/components/ui/toaster";
import { createFakeAutomation } from "@/mocks";
import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { createWrapper } from "@tests/utils";
import { expect, test, vi } from "vitest";

import { AutomationsDeleteDialog } from "./automations-delete-dialog";

test("AutomationsDeleteDialog can successfully call delete", async () => {
const MOCK_DATA = createFakeAutomation();
const user = userEvent.setup();

// ------------ Setup
const mockOnDeleteFn = vi.fn();
render(
<>
<Toaster />
<AutomationsDeleteDialog
automation={MOCK_DATA}
onDelete={mockOnDeleteFn}
onOpenChange={vi.fn()}
/>
</>,
{ wrapper: createWrapper() },
);

// ------------ Act
expect(screen.getByRole("heading", { name: /delete automation/i }));
await user.click(
screen.getByRole("button", {
name: /delete/i,
}),
);

// ------------ Assert
expect(screen.getByText(/automation deleted/i)).toBeVisible();
expect(mockOnDeleteFn).toHaveBeenCalledOnce();
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
import { Automation, useDeleteAutomation } from "@/api/automations";
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import { useToast } from "@/hooks/use-toast";

type AutomationsDeleteDialogProps = {
automation: Automation;
onOpenChange: (open: boolean) => void;
onDelete: () => void;
};

export const AutomationsDeleteDialog = ({
automation,
onOpenChange,
onDelete,
}: AutomationsDeleteDialogProps) => {
const { toast } = useToast();
const { deleteAutomation, isPending } = useDeleteAutomation();

const handleOnClick = (id: string) => {
deleteAutomation(id, {
onSuccess: () => {
toast({ description: "Automation deleted" });
},
onError: (error) => {
const message =
error.message || "Unknown error while deleting automation.";
console.error(message);
},
onSettled: onDelete,
});
};

return (
<Dialog open onOpenChange={onOpenChange}>
<DialogContent>
<DialogHeader>
<DialogTitle>Delete Automation</DialogTitle>
</DialogHeader>
<DialogDescription>
Are you sure you want to delete {automation.name}
</DialogDescription>
<DialogFooter>
<DialogTrigger asChild>
<Button variant="outline">Close</Button>
</DialogTrigger>
<Button
variant="destructive"
onClick={() => handleOnClick(automation.id)}
loading={isPending}
>
Delete
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
);
};
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export { AutomationsDeleteDialog } from "./automations-delete-dialog";
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ export const GlobalConcurrencyLimitsDeleteDialog = ({
</DialogTrigger>
<Button
variant="destructive"
onClick={() => handleOnClick(limit?.id)}
onClick={() => handleOnClick(limit.id)}
loading={isPending}
>
Delete
Expand Down

0 comments on commit 45fc50f

Please sign in to comment.