Skip to content
This repository has been archived by the owner on Jul 2, 2024. It is now read-only.

Commit

Permalink
DEVPROD-1976: Migrate execution tasks table
Browse files Browse the repository at this point in the history
  • Loading branch information
minnakt committed Mar 15, 2024
1 parent b4cbf1e commit 8324fe5
Show file tree
Hide file tree
Showing 8 changed files with 285 additions and 62 deletions.
9 changes: 6 additions & 3 deletions cypress/integration/task/execution_task_table.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,14 +7,17 @@ describe("Execution task table", () => {
});

it("Should have a default sort order applied", () => {
cy.location("search").should("contain", "sorts=STATUS%3AASC");
cy.location("search").should("contain", "sortBy=STATUS");
cy.location("search").should("contain", "sortDir=ASC");
});

it("Updates the url when column headers are clicked", () => {
cy.dataCy("tasks-table").find("th").contains("Name").click();
cy.location("search").should("contain", "NAME%3AASC");
cy.location("search").should("contain", "sortBy=NAME");
cy.location("search").should("contain", "sortDir=ASC");

cy.dataCy("tasks-table").find("th").contains("Name").click();
cy.location("search").should("contain", "NAME%3ADESC");
cy.location("search").should("contain", "sortBy=NAME");
cy.location("search").should("contain", "sortDir=DESC");
});
});
2 changes: 1 addition & 1 deletion cypress/integration/task/task_actions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,6 @@ const tasks = {
1: "/task/evergreen_ubuntu1604_test_model_patch_5e823e1f28baeaa22ae00823d83e03082cd148ab_5e4ff3abe3c3317e352062e4_20_02_21_15_13_48",
2: "/task/evergreen_lint_lint_service_patch_5e823e1f28baeaa22ae00823d83e03082cd148ab_5e4ff3abe3c3317e352062e4_20_02_21_15_13_48",
3: "/task/evergreen_ubuntu1604_dist_patch_33016573166a36bd5f46b4111151899d5c4e95b1_5ecedafb562343215a7ff297_20_05_27_21_39_46",
4: "/task/mci_ubuntu1604_display_asdf_patch_a1d2c8f70bf5c543de8b9641ac1ec08def1ddb26_5f74d99ab2373627c047c5e5_20_09_30_19_16_47/execution-tasks?execution=0&sorts=STATUS%3AASC",
4: "/task/mci_ubuntu1604_display_asdf_patch_a1d2c8f70bf5c543de8b9641ac1ec08def1ddb26_5f74d99ab2373627c047c5e5_20_09_30_19_16_47/execution-tasks?execution=0",
5: "/task/evergreen_test_model_patch_5e823e1f28baeaa22ae00823d83e03082cd148ab_5e4ff3abe3c3317e352062e4_20_02_21_15_13_48",
};
6 changes: 1 addition & 5 deletions src/analytics/task/useTaskAnalytics.ts
Original file line number Diff line number Diff line change
Expand Up @@ -22,11 +22,7 @@ type Action =
}
| {
name: "Sort Execution Tasks Table";
sortBy:
| TaskSortCategory.Name
| TaskSortCategory.Status
| TaskSortCategory.BaseStatus
| TaskSortCategory.Variant;
sortBy: TaskSortCategory | TaskSortCategory[];
}
| { name: "Restart" }
| { name: "Schedule" }
Expand Down
155 changes: 155 additions & 0 deletions src/components/TasksTable/Columns.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,155 @@
import { LGColumnDef } from "@leafygreen-ui/table";
import Tooltip from "@leafygreen-ui/tooltip";
import pluralize from "pluralize";
import { ConditionalWrapper } from "components/ConditionalWrapper";
import { StyledRouterLink } from "components/styles";
import TaskStatusBadge from "components/TaskStatusBadge";
import { TreeDataEntry } from "components/TreeSelect";
import { getVariantHistoryRoute } from "constants/routes";
import { mergeTaskVariant } from "constants/task";
import { zIndex } from "constants/tokens";
import { TaskSortCategory } from "gql/generated/types";
import { TaskStatus } from "types/task";
import { TaskLink } from "./TaskLink";
import { TaskTableInfo } from "./types";

export const getColumnsTemplate = ({
baseStatusOptions = [],
isPatch = false,
onClickTaskLink = () => {},
showTaskExecutionLabel = false,
statusOptions = [],
}: {
baseStatusOptions?: TreeDataEntry[];
isPatch?: boolean;
onClickTaskLink?: (taskId: string) => void;
showTaskExecutionLabel?: boolean;
statusOptions?: TreeDataEntry[];
}): LGColumnDef<TaskTableInfo>[] => [
{
header: "Name",
accessorKey: "displayName",
id: TaskSortCategory.Name,
cell: ({
getValue,
row: {
original: { execution, id },
},
}): JSX.Element => (
<TaskLink
execution={execution}
onClick={onClickTaskLink}
showTaskExecutionLabel={showTaskExecutionLabel}
taskId={id}
taskName={getValue() as string}
/>
),
meta: {
search: {
"data-cy": "task-name-filter-popover",
placeholder: "Task name regex",
},
},
enableSorting: true,
size: 300,
},
{
accessorKey: "status",
id: TaskSortCategory.Status,
header: "Task Status",
cell: ({
getValue,
row: {
original: { dependsOn, execution, id },
},
}) => {
const status = getValue() as string;

return dependsOn?.length && getValue() === TaskStatus.Blocked ? (
<Tooltip
data-cy="depends-on-tooltip"
justify="middle"
popoverZIndex={zIndex.tooltip}
trigger={
<span>
<TaskStatusBadge status={status} id={id} execution={execution} />
</span>
}
>
Depends on {pluralize("task", dependsOn.length)}:{" "}
{dependsOn.map(({ name }) => `“${name}”`).join(", ")}
</Tooltip>
) : (
getValue() && (
<TaskStatusBadge status={status} id={id} execution={execution} />
)
);
},
meta: {
treeSelect: {
"data-cy": "status-filter-popover",
options: statusOptions,
},
},
enableSorting: true,
size: 80,
},
{
id: TaskSortCategory.BaseStatus,
accessorKey: "baseTask.status",
header: `${isPatch ? "Base" : "Previous"} Status`,
cell: ({
getValue,
row: {
original: { baseTask },
},
}) =>
getValue() && (
<TaskStatusBadge
status={getValue() as string}
id={baseTask?.id}
execution={baseTask?.execution}
/>
),
meta: {
treeSelect: {
"data-cy": "base-status-filter-popover",
options: baseStatusOptions,
},
},
enableSorting: true,
size: 80,
},
{
accessorKey: "buildVariantDisplayName",
id: TaskSortCategory.Variant,
header: "Variant",
cell: ({
getValue,
row: {
original: { buildVariant, projectIdentifier },
},
}) => (
<ConditionalWrapper
condition={buildVariant !== mergeTaskVariant}
wrapper={(children) => (
<StyledRouterLink
to={getVariantHistoryRoute(projectIdentifier, buildVariant)}
>
{children}
</StyledRouterLink>
)}
>
{getValue() as string}
</ConditionalWrapper>
),
meta: {
search: {
"data-cy": "variant-filter-popover",
placeholder: "Variant name regex",
},
},
enableSorting: true,
size: 250,
},
];
30 changes: 29 additions & 1 deletion src/components/TasksTable/TasksTable.stories.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import { CustomStoryObj, CustomMeta } from "test_utils/types";

import TasksTable from ".";

export default {
Expand All @@ -21,6 +20,8 @@ export const VersionTasksTable: CustomStoryObj<typeof TasksTable> = {
const tasks = [
{
id: "some_id",
projectIdentifier: "evg",
execution: 0,
aborted: false,
displayName: "Some Fancy ID",
version: "123",
Expand All @@ -29,11 +30,17 @@ const tasks = [
buildVariantDisplayName: "Ubuntu 16.04",
blocked: false,
baseTask: {
id: "some_base_task",
execution: 0,
status: "unscheduled",
},
executionTasksFull: [],
dependsOn: [],
},
{
id: "some_id_2",
projectIdentifier: "evg",
execution: 0,
aborted: false,
displayName: "Some other Fancy ID",
version: "123",
Expand All @@ -42,11 +49,17 @@ const tasks = [
buildVariantDisplayName: "Ubuntu 16.04",
blocked: false,
baseTask: {
id: "some_base_task_2",
execution: 0,
status: "failed",
},
executionTasksFull: [],
dependsOn: [],
},
{
id: "some_id_3",
projectIdentifier: "evg",
execution: 0,
aborted: false,
displayName: "Some different Fancy ID",
version: "234",
Expand All @@ -55,15 +68,21 @@ const tasks = [
buildVariantDisplayName: "Windows 97",
blocked: false,
baseTask: {
id: "some_base_task_3",
execution: 0,
status: "failed",
},
executionTasksFull: [],
dependsOn: [],
},
];

const nestedTasks = [
...tasks,
{
id: "some_id_4",
projectIdentifier: "evg",
execution: 0,
aborted: false,
displayName: "Some Fancy Display Task",
version: "234",
Expand All @@ -72,6 +91,8 @@ const nestedTasks = [
buildVariantDisplayName: "Windows 97",
blocked: false,
baseTask: {
id: "some_base_task_4",
execution: 0,
status: "failed",
},
executionTasksFull: [
Expand All @@ -85,11 +106,15 @@ const nestedTasks = [
buildVariantDisplayName: "Windows 97",
blocked: false,
baseTask: {
id: "some_base_task_5",
execution: 0,
status: "aborted",
},
},
{
id: "some_id_6",
projectIdentifier: "evg",
execution: 0,
aborted: false,
displayName: "Another execution task",
version: "234",
Expand All @@ -98,9 +123,12 @@ const nestedTasks = [
buildVariantDisplayName: "Windows 97",
blocked: false,
baseTask: {
id: "some_base_task_6",
execution: 0,
status: "system-failed",
},
},
],
dependsOn: [],
},
];
14 changes: 1 addition & 13 deletions src/components/TasksTable/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,19 +24,7 @@ import {
import { TableOnChange, TaskStatus } from "types/task";
import { sortTasks } from "utils/statuses";
import { TaskLink } from "./TaskLink";

type TaskTableInfo = {
baseTask?: {
status: string;
};
buildVariantDisplayName?: string;
dependsOn?: Array<{ name: string }>;
displayName: string;
executionTasksFull?: TaskTableInfo[];
id: string;
projectIdentifier?: string;
status: string;
};
import { TaskTableInfo } from "./types";

interface TasksTableProps {
baseStatusSelectorProps?: TreeSelectProps;
Expand Down
16 changes: 16 additions & 0 deletions src/components/TasksTable/types.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
export type TaskTableInfo = {
baseTask?: {
id: string;
execution: number;
status: string;
};
buildVariant?: string;
buildVariantDisplayName?: string;
dependsOn?: Array<{ name: string }>;
displayName: string;
execution: number;
executionTasksFull?: TaskTableInfo[];
id: string;
projectIdentifier?: string;
status: string;
};
Loading

0 comments on commit 8324fe5

Please sign in to comment.