diff --git a/packages/dashboard/src/components/JobsFilter.tsx b/packages/dashboard/src/components/JobsFilter.tsx index 90c166e2..f79b99ec 100644 --- a/packages/dashboard/src/components/JobsFilter.tsx +++ b/packages/dashboard/src/components/JobsFilter.tsx @@ -5,11 +5,9 @@ import { SelectTrigger, SelectValue, } from "@/components/ui/select"; +import { filterJobs } from "@/lib/jobs-filter"; import type { JobDto } from "@/tsr"; import type { JobsFilterData } from "./types"; -import { Button } from "@/components/ui/button"; -import { X } from "lucide-react"; -import { filterJobs } from "@/lib/jobs-filter"; type JobsFilterProps = { jobs: JobDto[]; @@ -25,38 +23,65 @@ export function JobsFilter({ jobs, filter, onChange }: JobsFilterProps) { return acc; }, []); + const names = jobs.reduce((acc, job) => { + if (!acc.includes(job.name)) { + acc.push(job.name); + } + return acc; + }, []); + const filteredJobs = filterJobs(jobs, filter); + let tagValue = filter.tag; + if (tagValue === null) { + tagValue = "all"; + } + + const onTagChange = (value: string) => { + const tag = value === "all" ? null : value; + onChange({ tag }); + }; + + let nameValue = filter.name; + if (nameValue === null) { + nameValue = "all"; + } + + const onNameChange = (value: string) => { + const name = value === "all" ? null : value; + onChange({ name }); + }; + return (
{filteredJobs.length} jobs
-
- {filter.tag ? ( -
- {filter.tag} - -
- ) : ( - - )} +
+ +
); diff --git a/packages/dashboard/src/components/types.ts b/packages/dashboard/src/components/types.ts index 3c781156..08aa7249 100644 --- a/packages/dashboard/src/components/types.ts +++ b/packages/dashboard/src/components/types.ts @@ -1,3 +1,4 @@ export type JobsFilterData = { tag: string | null; + name: string | null; }; diff --git a/packages/dashboard/src/lib/jobs-filter.ts b/packages/dashboard/src/lib/jobs-filter.ts index 639bd091..36cd1c5f 100644 --- a/packages/dashboard/src/lib/jobs-filter.ts +++ b/packages/dashboard/src/lib/jobs-filter.ts @@ -6,5 +6,9 @@ export function filterJobs(jobs: JobDto[], filter: JobsFilterData) { jobs = jobs.filter((job) => job.tag === filter.tag); } + if (filter.name) { + jobs = jobs.filter((job) => job.name === filter.name); + } + return jobs; } diff --git a/packages/dashboard/src/pages/JobPage.tsx b/packages/dashboard/src/pages/JobPage.tsx index 7cc54b63..53a42a3b 100644 --- a/packages/dashboard/src/pages/JobPage.tsx +++ b/packages/dashboard/src/pages/JobPage.tsx @@ -15,7 +15,7 @@ export function JobPage() { const { job, rootTree } = data.body; return ( -
+