diff --git a/src/components/Home/RunSection/RunRow.tsx b/src/components/Home/RunSection/RunRow.tsx index ad0548a0b..6cb37e483 100644 --- a/src/components/Home/RunSection/RunRow.tsx +++ b/src/components/Home/RunSection/RunRow.tsx @@ -16,7 +16,7 @@ import { TooltipContent, TooltipTrigger, } from "@/components/ui/tooltip"; -import useToastNotification from "@/hooks/useToastNotification"; +import { Text } from "@/components/ui/typography"; import { useBackend } from "@/providers/BackendProvider"; import { APP_ROUTES } from "@/routes/router"; import { fetchRunAnnotations } from "@/services/pipelineRunService"; @@ -29,9 +29,13 @@ import { TWENTY_FOUR_HOURS_IN_MS } from "@/utils/constants"; import { formatDate } from "@/utils/date"; import { getOverallExecutionStatusFromStats } from "@/utils/executionStatus"; -const RunRow = ({ run }: { run: PipelineRunResponse }) => { +interface RunRowProps { + run: PipelineRunResponse; + onFilterByUser?: (createdBy: string) => void; +} + +const RunRow = ({ run, onFilterByUser }: RunRowProps) => { const navigate = useNavigate(); - const notify = useToastNotification(); const { backendUrl } = useBackend(); const runId = `${run.id}`; @@ -52,10 +56,9 @@ const RunRow = ({ run }: { run: PipelineRunResponse }) => { const truncatedCreatedBy = truncateMiddle(createdBy); const isTruncated = createdBy !== truncatedCreatedBy; - const handleCopy = (e: MouseEvent) => { + const handleFilterByUser = (e: MouseEvent) => { e.stopPropagation(); - navigator.clipboard.writeText(createdBy); - notify(`"${createdBy}" copied to clipboard`, "success"); + onFilterByUser?.(createdBy); }; const overallStatus = getOverallExecutionStatusFromStats( @@ -77,20 +80,26 @@ const RunRow = ({ run }: { run: PipelineRunResponse }) => { navigate({ to: clickThroughUrl }); }; - const createdByButton = ( + const createdByContent = onFilterByUser ? ( + ) : ( + + {truncatedCreatedBy} + ); - const createdByButtonWithTooltip = ( + const createdByContentWithTooltip = ( - {createdByButton} + {createdByContent} {createdBy} @@ -131,7 +140,7 @@ const RunRow = ({ run }: { run: PipelineRunResponse }) => { {run.created_at ? formatDate(run.created_at) : "Data not found..."} - {isTruncated ? createdByButtonWithTooltip : createdByButton} + {isTruncated ? createdByContentWithTooltip : createdByContent} {tags && tags.length > 0 && } diff --git a/src/components/Home/RunSection/RunSection.tsx b/src/components/Home/RunSection/RunSection.tsx index 4ffa2ed16..472b31154 100644 --- a/src/components/Home/RunSection/RunSection.tsx +++ b/src/components/Home/RunSection/RunSection.tsx @@ -20,6 +20,7 @@ import { TableRow, } from "@/components/ui/table"; import { Text } from "@/components/ui/typography"; +import { useRunSearchParams } from "@/hooks/useRunSearchParams"; import { useBackend } from "@/providers/BackendProvider"; import { getBackendStatusString } from "@/utils/backend"; import { fetchWithErrorHandling } from "@/utils/fetchWithErrorHandling"; @@ -41,11 +42,8 @@ type RunSectionSearch = { page_token?: string; filter?: string }; interface RunSectionProps { onEmptyList?: () => void; - /** When true, hides the built-in filter UI (used when new filter bar is enabled) */ hideFilters?: boolean; - /** When provided, overrides the URL filter param (e.g. "created_by:me") */ forcedFilter?: string; - /** When provided, limits the number of rows shown (pagination still works per backend page) */ maxItems?: number; } @@ -60,8 +58,13 @@ export const RunSection = ({ const { pathname } = useLocation(); const search = useSearch({ strict: false }) as RunSectionSearch; const isCreatedByMeDefault = useFlagValue("created-by-me-default"); + const { setFilter } = useRunSearchParams(); const dataVersion = useRef(0); + const onFilterByUser = forcedFilter + ? undefined + : (createdBy: string) => setFilter("created_by", createdBy); + // Supports both JSON (new) and key:value (legacy) URL formats const filters = parseFilterParam(forcedFilter ?? search.filter); const createdByValue = filters.created_by; @@ -294,7 +297,7 @@ export const RunSection = ({ ? data.pipeline_runs?.slice(0, maxItems) : data.pipeline_runs )?.map((run) => ( - + ))}