@allurereport/web-awesome 3.0.0-beta.10

package/src/utils/treeFilters.ts

@@ -0,0 +1,147 @@
+import type { Comparator, DefaultTreeGroup, Statistic, TestStatus, TreeLeaf } from "@allurereport/core-api";
+import {
+  alphabetically,
+  andThen,
+  byStatistic,
+  byStatus,
+  compareBy,
+  emptyStatistic,
+  incrementStatistic,
+  mergeStatistic,
+  ordinal,
+  reverse,
+} from "@allurereport/core-api";
+import type { TreeFiltersState, TreeSortBy } from "@/stores/tree";
+import type { AwesomeRecursiveTree, AwesomeTree, AwesomeTreeGroup, AwesomeTreeLeaf } from "../../types";
+
+export const isIncluded = (leaf: TreeLeaf<AwesomeTreeLeaf>, filterOptions: TreeFiltersState) => {
+  const queryMatched = !filterOptions?.query || leaf.name.toLowerCase().includes(filterOptions.query.toLowerCase());
+  const statusMatched =
+    !filterOptions?.status || filterOptions?.status === "total" || leaf.status === filterOptions.status;
+  const flakyMatched = !filterOptions?.filter?.flaky || leaf.flaky;
+  const retryMatched = !filterOptions?.filter?.retry || leaf.retry;
+  // TODO: at this moment we don't have a new field implementation even in the generator
+  // const newMatched = !filterOptions?.filter?.new || leaf.new;
+
+  return [queryMatched, statusMatched, flakyMatched, retryMatched].every(Boolean);
+};
+
+const leafComparatorByTreeSortBy = (sortBy: TreeSortBy = "status"): Comparator<TreeLeaf<AwesomeTreeLeaf>> => {
+  const typedCompareBy = compareBy<TreeLeaf<AwesomeTreeLeaf>>;
+  switch (sortBy) {
+    case "order":
+      return typedCompareBy("groupOrder", ordinal());
+    case "duration":
+      return typedCompareBy("duration", ordinal());
+    case "alphabet":
+      return typedCompareBy("name", alphabetically());
+    case "status":
+      return typedCompareBy("status", byStatus());
+    default:
+      // eslint-disable-next-line no-console
+      console.error(`unsupported comparator ${sortBy}`);
+      return () => 0;
+  }
+};
+
+const groupComparatorByTreeSortBy = (sortBy: TreeSortBy = "status"): Comparator<DefaultTreeGroup> => {
+  const typedCompareBy = compareBy<DefaultTreeGroup>;
+  switch (sortBy) {
+    case "alphabet":
+      return typedCompareBy("name", alphabetically());
+    case "order":
+    case "duration":
+    case "status":
+      return typedCompareBy("statistic", byStatistic());
+    default:
+      // eslint-disable-next-line no-console
+      console.error(`unsupported comparator ${sortBy}`);
+      return () => 0;
+  }
+};
+
+export const leafComparator = (filterOptions: TreeFiltersState): Comparator<TreeLeaf<AwesomeTreeLeaf>> => {
+  const cmp = leafComparatorByTreeSortBy(filterOptions.sortBy);
+  const directional = filterOptions.direction === "asc" ? cmp : reverse(cmp);
+  // apply fallback sorting by name
+  return andThen([directional, compareBy("name", alphabetically())]);
+};
+
+export const groupComparator = (filterOptions: TreeFiltersState): Comparator<DefaultTreeGroup> => {
+  const cmp = groupComparatorByTreeSortBy(filterOptions.sortBy);
+  const directional = filterOptions.direction === "asc" ? cmp : reverse(cmp);
+  // apply fallback sorting by name
+  return andThen([directional, compareBy("name", alphabetically())]);
+};
+
+export const filterLeaves = (
+  leaves: string[] = [],
+  leavesById: AwesomeTree["leavesById"],
+  filterOptions: TreeFiltersState,
+) => {
+  const filteredLeaves = [...leaves]
+    .map((leafId) => leavesById[leafId])
+    .filter((leaf: TreeLeaf<AwesomeTreeLeaf>) => isIncluded(leaf, filterOptions));
+
+  const comparator = leafComparator(filterOptions);
+  return filteredLeaves.sort(comparator);
+};
+
+/**
+ * Fills the given tree from generator and returns recursive tree which includes leaves data instead of their IDs
+ * Filters leaves when `filterOptions` property is provided
+ * @param payload
+ */
+export const createRecursiveTree = (payload: {
+  group: AwesomeTreeGroup;
+  groupsById: AwesomeTree["groupsById"];
+  leavesById: AwesomeTree["leavesById"];
+  filterOptions?: TreeFiltersState;
+}): AwesomeRecursiveTree => {
+  const { group, groupsById, leavesById, filterOptions } = payload;
+  const groupLeaves: string[] = group.leaves ?? [];
+
+  const leaves = filterLeaves(groupLeaves, leavesById, filterOptions);
+  const trees =
+    group.groups
+      ?.map((groupId) =>
+        createRecursiveTree({
+          group: groupsById[groupId],
+          groupsById,
+          leavesById,
+          filterOptions,
+        }),
+      )
+      ?.filter((rt) => !isRecursiveTreeEmpty(rt)) ?? [];
+
+  const statistic: Statistic = emptyStatistic();
+  trees.forEach((rt: AwesomeRecursiveTree) => {
+    if (rt.statistic) {
+      const additional: Statistic = rt.statistic;
+      mergeStatistic(statistic, additional);
+    }
+  });
+  leaves.forEach((leaf) => {
+    const status: TestStatus = leaf.status;
+    incrementStatistic(statistic, status);
+  });
+
+  return {
+    ...group,
+    statistic,
+    leaves,
+    trees: trees.sort(groupComparator(filterOptions)),
+  };
+};
+
+export const isRecursiveTreeEmpty = (tree: AwesomeRecursiveTree): boolean => {
+  if (!tree.trees?.length && !tree.leaves?.length) {
+    return true;
+  }
+
+  if (tree.leaves?.length) {
+    return false;
+  }
+
+  return tree.trees?.every((subTree) => isRecursiveTreeEmpty(subTree));
+};

package/test/utils/treeFilters.test.ts

@@ -0,0 +1,448 @@
+import { describe, expect, it } from "vitest";
+import { createRecursiveTree, filterLeaves } from "../../src/utils/treeFilters.js";
+import type { AwesomeTestResult } from "../../types.js";
+
+describe("utils > treeFilters", () => {
+  describe("filterLeaves", () => {
+    it("returns the leaves as is when no filter options are provided", () => {
+      const baseDate = Date.now();
+      const leaves = ["a1", "b2", "c3"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+          start: baseDate,
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          start: baseDate + 1000,
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          start: baseDate + 2000,
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        query: "",
+        status: "total",
+        filter: {
+          flaky: false,
+          retry: false,
+          new: false,
+        },
+        sortBy: "order",
+        direction: "asc",
+      });
+
+      expect(result).toEqual([
+        expect.objectContaining({ name: "a1" }),
+        expect.objectContaining({ name: "b2" }),
+        expect.objectContaining({ name: "c3" }),
+      ]);
+    });
+
+    it("returns the leaves only matched the status filter", () => {
+      const baseDate = Date.now();
+      const leaves = ["a1", "b2", "c3"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+          status: "passed",
+          start: baseDate,
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          status: "failed",
+          start: baseDate + 1000,
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          status: "passed",
+          start: baseDate + 2000,
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        query: "",
+        status: "passed",
+        filter: {
+          flaky: false,
+          retry: false,
+          new: false,
+        },
+        sortBy: "order",
+        direction: "asc",
+      });
+
+      expect(result).toEqual([expect.objectContaining({ name: "a1" }), expect.objectContaining({ name: "c3" })]);
+    });
+
+    it("returns the flaky leaves", () => {
+      const baseDate = Date.now();
+      const leaves = ["a1", "b2", "c3"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+          start: baseDate,
+          flaky: true,
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          start: baseDate + 1000,
+          flaky: false,
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          start: baseDate + 2000,
+          flaky: true,
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        query: "",
+        status: "total",
+        filter: {
+          flaky: true,
+          retry: false,
+          new: false,
+        },
+        sortBy: "order",
+        direction: "asc",
+      });
+
+      expect(result).toEqual([expect.objectContaining({ name: "a1" }), expect.objectContaining({ name: "c3" })]);
+    });
+
+    it("returns leaves which contains retries", () => {
+      const baseDate = Date.now();
+      const leaves = ["a1", "b2", "c3"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+          start: baseDate,
+          retry: true,
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          start: baseDate + 1000,
+          retry: false,
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          start: baseDate + 2000,
+          retry: false,
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        filter: {
+          retry: true,
+        },
+      });
+
+      expect(result).toEqual([expect.objectContaining({ name: "a1" })]);
+    });
+
+    it("sorts leave by duration in ascending order", () => {
+      const leaves = ["a1", "b2", "c3"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+          duration: 1000,
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          duration: 2000,
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          duration: 3000,
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        direction: "asc",
+        sortBy: "duration",
+      });
+
+      expect(result).toEqual([
+        expect.objectContaining({ name: "a1" }),
+        expect.objectContaining({ name: "b2" }),
+        expect.objectContaining({ name: "c3" }),
+      ]);
+    });
+
+    it("sorts leave by duration in descending order", () => {
+      const leaves = ["a1", "b2", "c3"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+          duration: 1000,
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          duration: 2000,
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          duration: 3000,
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        direction: "desc",
+        sortBy: "duration",
+      });
+
+      expect(result).toEqual([
+        expect.objectContaining({ name: "c3" }),
+        expect.objectContaining({ name: "b2" }),
+        expect.objectContaining({ name: "a1" }),
+      ]);
+    });
+
+    it("sorts leaves by title in ascending order", () => {
+      const leaves = ["a1", "b2", "c3"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        direction: "asc",
+        sortBy: "alphabet",
+      });
+
+      expect(result).toEqual([
+        expect.objectContaining({ name: "a1" }),
+        expect.objectContaining({ name: "b2" }),
+        expect.objectContaining({ name: "c3" }),
+      ]);
+    });
+
+    it("sorts leaves by title in descending order", () => {
+      const leaves = ["a1", "b2", "c3"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        direction: "desc",
+        sortBy: "alphabet",
+      });
+
+      expect(result).toEqual([
+        expect.objectContaining({ name: "c3" }),
+        expect.objectContaining({ name: "b2" }),
+        expect.objectContaining({ name: "a1" }),
+      ]);
+    });
+
+    it("sorts leaves by status in ascending order", () => {
+      const leaves = ["a1", "b2", "c3", "d4", "e5"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+          status: "passed",
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          status: "failed",
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          status: "broken",
+        } as AwesomeTestResult,
+        d4: {
+          name: "d4",
+          status: "unknown",
+        } as AwesomeTestResult,
+        e5: {
+          name: "e5",
+          status: "skipped",
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        direction: "asc",
+        sortBy: "status",
+      });
+
+      expect(result).toEqual([
+        expect.objectContaining({ name: "b2" }),
+        expect.objectContaining({ name: "c3" }),
+        expect.objectContaining({ name: "a1" }),
+        expect.objectContaining({ name: "e5" }),
+        expect.objectContaining({ name: "d4" }),
+      ]);
+    });
+
+    it("sorts leaves by status in descending order", () => {
+      const leaves = ["a1", "b2", "c3", "d4", "e5"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+          status: "passed",
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          status: "failed",
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          status: "broken",
+        } as AwesomeTestResult,
+        d4: {
+          name: "d4",
+          status: "unknown",
+        } as AwesomeTestResult,
+        e5: {
+          name: "e5",
+          status: "skipped",
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        direction: "desc",
+        sortBy: "status",
+      });
+
+      expect(result).toEqual([
+        expect.objectContaining({ name: "d4" }),
+        expect.objectContaining({ name: "e5" }),
+        expect.objectContaining({ name: "a1" }),
+        expect.objectContaining({ name: "c3" }),
+        expect.objectContaining({ name: "b2" }),
+      ]);
+    });
+
+    it("sorts leaves by order number in ascending order", () => {
+      const baseDate = Date.now();
+      const leaves = ["a1", "b2", "c3"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+          start: baseDate + 2000,
+          groupOrder: 3,
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          start: baseDate + 1000,
+          groupOrder: 2,
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          start: baseDate,
+          groupOrder: 1,
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        direction: "asc",
+        sortBy: "order",
+      });
+
+      expect(result).toEqual([
+        expect.objectContaining({ name: "c3" }),
+        expect.objectContaining({ name: "b2" }),
+        expect.objectContaining({ name: "a1" }),
+      ]);
+    });
+
+    it("sorts leaves by order number in descending order", () => {
+      const baseDate = Date.now();
+      const leaves = ["a1", "b2", "c3"];
+      const leavesById = {
+        a1: {
+          name: "a1",
+          start: baseDate + 2000,
+          groupOrder: 3,
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          start: baseDate + 1000,
+          groupOrder: 2,
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          start: baseDate,
+          groupOrder: 1,
+        } as AwesomeTestResult,
+      };
+      const result = filterLeaves(leaves, leavesById, {
+        direction: "desc",
+        sortBy: "order",
+      });
+
+      expect(result).toEqual([
+        expect.objectContaining({ name: "a1" }),
+        expect.objectContaining({ name: "b2" }),
+        expect.objectContaining({ name: "c3" }),
+      ]);
+    });
+  });
+
+  describe("createRecursiveTree", () => {
+    it("creates recursive tree with filtered and sorted leaves objects", () => {
+      const baseDate = Date.now();
+      const group = {
+        leaves: ["a1"],
+        groups: ["a1"],
+      };
+      const leavesById = {
+        a1: {
+          name: "a1",
+          start: baseDate,
+        } as AwesomeTestResult,
+        b2: {
+          name: "b2",
+          start: baseDate + 1000,
+        } as AwesomeTestResult,
+        c3: {
+          name: "c3",
+          start: baseDate + 2000,
+        } as AwesomeTestResult,
+      };
+      const groupsById = {
+        a1: {
+          leaves: ["b2"],
+          groups: ["b2"],
+        },
+        b2: {
+          leaves: ["c3"],
+          groups: [],
+        },
+      };
+      const result = createRecursiveTree({
+        group,
+        leavesById,
+        groupsById,
+        filterOptions: {
+          sortBy: "alphabet",
+          direction: "asc",
+        },
+      });
+
+      expect(result).toEqual(
+        expect.objectContaining({
+          leaves: [expect.objectContaining({ name: "a1" })],
+          trees: [
+            expect.objectContaining({
+              leaves: [expect.objectContaining({ name: "b2" })],
+              trees: [
+                expect.objectContaining({
+                  leaves: [expect.objectContaining({ name: "c3" })],
+                  trees: [],
+                }),
+              ],
+            }),
+          ],
+        }),
+      );
+    });
+  });
+});

package/tsconfig.json

@@ -0,0 +1,27 @@
+{
+  "compilerOptions": {
+    "baseUrl": "./",
+    "paths": {
+      "@/*": ["src/*"]
+    },
+    "jsx": "preserve",
+    "jsxFactory": "h",
+    "jsxFragmentFactory": "Fragment",
+    "jsxImportSource": "preact",
+    "target": "ESNext",
+    "module": "ESNext",
+    "moduleResolution": "node",
+    "allowSyntheticDefaultImports": true,
+    "useUnknownInCatchVariables": false,
+    "noEmit": true,
+    "noImplicitAny": true,
+    "resolveJsonModule": true,
+    "esModuleInterop": true,
+    "lib": ["ES2019", "dom"],
+    // node types should not be used in web-commons
+    "types": [],
+    "skipLibCheck": true
+  },
+  "include": ["src"],
+  "exclude": ["node_modules", "dist"]
+}