diff --git a/ui-v2/src/components/concurrency/task-run-concurrency-limit-empty-state.test.tsx b/ui-v2/src/components/concurrency/task-run-concurrency-limit-empty-state.test.tsx new file mode 100644 index 000000000000..34b64a9531b6 --- /dev/null +++ b/ui-v2/src/components/concurrency/task-run-concurrency-limit-empty-state.test.tsx @@ -0,0 +1,18 @@ +import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { describe, expect, it, vi } from "vitest"; +import { TaskRunConcurrencyLimitEmptyState } from "./task-run-concurrency-limit-empty-state"; + +describe("TaskRunConcurrencyLimitEmptyState", () => { + it("when adding task run concurrency limit, callback gets fired", async () => { + const user = userEvent.setup(); + + const mockFn = vi.fn(); + + render(); + await user.click( + screen.getByRole("button", { name: /Add Concurrency Limit/i }), + ); + expect(mockFn).toHaveBeenCalledOnce(); + }); +}); diff --git a/ui-v2/src/components/concurrency/task-run-concurrency-limit-empty-state.tsx b/ui-v2/src/components/concurrency/task-run-concurrency-limit-empty-state.tsx new file mode 100644 index 000000000000..7256ff8b81a4 --- /dev/null +++ b/ui-v2/src/components/concurrency/task-run-concurrency-limit-empty-state.tsx @@ -0,0 +1,32 @@ +import { Button } from "@/components/ui/button"; +import { DocsLink } from "@/components/ui/docs-link"; +import { + EmptyState, + EmptyStateActions, + EmptyStateDescription, + EmptyStateIcon, + EmptyStateTitle, +} from "@/components/ui/empty-state"; +import { PlusIcon } from "lucide-react"; + +type Props = { + onClick: () => void; +}; +export const TaskRunConcurrencyLimitEmptyState = ({ onClick }: Props) => ( + + + + Add a concurrency limit for your task runs + + + Creating a limit allows you to limit the number of tasks running + simultaneously with a given tag. + + + + + + +); diff --git a/ui-v2/src/components/ui/docs-link.tsx b/ui-v2/src/components/ui/docs-link.tsx index 2669d8bdc5bf..c2dc4ee6ad7a 100644 --- a/ui-v2/src/components/ui/docs-link.tsx +++ b/ui-v2/src/components/ui/docs-link.tsx @@ -5,6 +5,8 @@ import { Button } from "./button"; const DOCS_LINKS = { "global-concurrency-guide": "https://docs.prefect.io/v3/develop/global-concurrency-limits", + "task-concurrency-guide": + "https://docs.prefect.io/v3/develop/task-run-limits", "variables-guide": "https://docs.prefect.io/latest/guides/variables/", } as const;