@allurereport/web-classic 3.0.0-beta.21 → 3.0.0-beta.23

package/src/components/Tree/Tree.tsx

@@ -2,7 +2,7 @@ import type { Statistic } from "@allurereport/core-api";
 import cx from "clsx";
 import type { FunctionComponent } from "preact";
 import { useState } from "preact/hooks";
-import type { AwesomeRecursiveTree, AwesomeStatus } from "types";
+import type { ClassicRecursiveTree, ClassicStatus } from "types";
 import TreeItem from "@/components/Tree/TreeItem";
 import { route } from "@/stores/router";
 import TreeHeader from "./TreeHeader";
@@ -10,10 +10,10 @@ import * as styles from "./styles.scss";
 
 interface TreeProps {
   statistic?: Statistic;
-  tree: AwesomeRecursiveTree;
+  tree: ClassicRecursiveTree;
   name?: string;
   root?: boolean;
-  statusFilter?: AwesomeStatus;
+  statusFilter?: ClassicStatus;
 }
 
 const Tree: FunctionComponent<TreeProps> = ({ tree, statusFilter, root, name, statistic }) => {

package/src/components/Tree/index.tsx

@@ -1,6 +1,6 @@
 import { Button, Loadable, PageLoader, Text } from "@allurereport/web-components";
 import { useEffect } from "preact/hooks";
-import type { AwesomeStatus } from "types";
+import type { ClassicStatus } from "types";
 import Tree from "@/components/Tree/Tree";
 import { useI18n } from "@/stores/locale";
 import { currentTab } from "@/stores/tabs";
@@ -11,7 +11,7 @@ export const TreeList = () => {
   const { t } = useI18n("empty");
 
   useEffect(() => {
-    setTreeStatus(currentTab.value as AwesomeStatus);
+    setTreeStatus(currentTab.value as ClassicStatus);
   }, [currentTab.value]);
 
   return (
@@ -51,7 +51,7 @@ export const TreeList = () => {
 
         return (
           <div className={styles["tree-list"]}>
-            <Tree tree={filteredTree.value} statusFilter={currentTab.value as AwesomeStatus} root />
+            <Tree tree={filteredTree.value} statusFilter={currentTab.value as ClassicStatus} root />
           </div>
         );
       }}

package/src/stores/behaviors.ts

@@ -1,6 +1,6 @@
 import { fetchReportJsonData } from "@allurereport/web-commons";
 import { computed, signal } from "@preact/signals";
-import type { AwesomeStatus, AwesomeTree, AwesomeTreeGroup } from "types";
+import type { ClassicStatus, ClassicTree, ClassicTreeGroup } from "types";
 import type { StoreSignalState } from "@/stores/types";
 import { createRecursiveTree, isRecursiveTreeEmpty } from "@/utils/treeFilters";
 
@@ -9,13 +9,13 @@ export type TreeDirection = "asc" | "desc";
 export type TreeFilters = "flaky" | "retry" | "new";
 export type TreeFiltersState = {
   query: string;
-  status: AwesomeStatus;
+  status: ClassicStatus;
   filter: Record<TreeFilters, boolean>;
   sortBy: TreeSortBy;
   direction: TreeDirection;
 };
 
-export const behaviorsStore = signal<StoreSignalState<AwesomeTree>>({
+export const behaviorsStore = signal<StoreSignalState<ClassicTree>>({
   loading: true,
   error: undefined,
   data: undefined,
@@ -39,7 +39,7 @@ export const filteredBehaviors = computed(() => {
   const { root, leavesById, groupsById } = behaviorsStore.value.data;
 
   return createRecursiveTree({
-    group: root as AwesomeTreeGroup,
+    group: root as ClassicTreeGroup,
     leavesById,
     groupsById,
     filterOptions: behaviorsFiltersStore.value,
@@ -71,7 +71,7 @@ export const setBehaviorsQuery = (query: string) => {
   };
 };
 
-export const setBehaviorsStatus = (status: AwesomeStatus) => {
+export const setBehaviorsStatus = (status: ClassicStatus) => {
   behaviorsFiltersStore.value = {
     ...behaviorsFiltersStore.value,
     status,
@@ -110,7 +110,7 @@ export const fetchBehaviorsData = async () => {
   };
 
   try {
-    const res = await fetchReportJsonData<AwesomeTree>("widgets/behaviors.json", { bustCache: true });
+    const res = await fetchReportJsonData<ClassicTree>("widgets/behaviors.json", { bustCache: true });
 
     behaviorsStore.value = {
       data: res,

package/src/stores/categories.ts

@@ -1,6 +1,6 @@
 import { fetchReportJsonData } from "@allurereport/web-commons";
 import { computed, signal } from "@preact/signals";
-import type { AwesomeStatus, AwesomeTree, AwesomeTreeGroup } from "types";
+import type { ClassicStatus, ClassicTree, ClassicTreeGroup } from "types";
 import type { StoreSignalState } from "@/stores/types";
 import { createRecursiveTree, isRecursiveTreeEmpty } from "@/utils/treeFilters";
 
@@ -9,13 +9,13 @@ export type TreeDirection = "asc" | "desc";
 export type TreeFilters = "flaky" | "retry" | "new";
 export type TreeFiltersState = {
   query: string;
-  status: AwesomeStatus;
+  status: ClassicStatus;
   filter: Record<TreeFilters, boolean>;
   sortBy: TreeSortBy;
   direction: TreeDirection;
 };
 
-export const categoriesStore = signal<StoreSignalState<AwesomeTree>>({
+export const categoriesStore = signal<StoreSignalState<ClassicTree>>({
   loading: true,
   error: undefined,
   data: undefined,
@@ -39,7 +39,7 @@ export const filteredCategories = computed(() => {
   const { root, leavesById, groupsById } = categoriesStore.value.data;
 
   return createRecursiveTree({
-    group: root as AwesomeTreeGroup,
+    group: root as ClassicTreeGroup,
     leavesById,
     groupsById,
     filterOptions: categoriesFiltersStore.value,
@@ -71,7 +71,7 @@ export const setCategoriesQuery = (query: string) => {
   };
 };
 
-export const setCategoriesStatus = (status: AwesomeStatus) => {
+export const setCategoriesStatus = (status: ClassicStatus) => {
   categoriesFiltersStore.value = {
     ...categoriesFiltersStore.value,
     status,
@@ -110,7 +110,7 @@ export const fetchCategoriesData = async () => {
   };
 
   try {
-    const res = await fetchReportJsonData<AwesomeTree>("widgets/categories.json", { bustCache: true });
+    const res = await fetchReportJsonData<ClassicTree>("widgets/categories.json", { bustCache: true });
 
     categoriesStore.value = {
       data: res,

package/src/stores/locale.ts

@@ -2,9 +2,9 @@ import { getReportOptions } from "@allurereport/web-commons";
 import { computed, signal } from "@preact/signals";
 import i18next, { type TOptions } from "i18next";
 import { DEFAULT_LOCALE, LANG_LOCALE, type LangLocale } from "@/translations/constants";
-import type { AwesomeReportOptions } from "../../types.js";
+import type { ClassicReportOptions } from "../../types.js";
 
-const { reportLanguage } = getReportOptions<AwesomeReportOptions>() ?? {};
+const { reportLanguage } = getReportOptions<ClassicReportOptions>() ?? {};
 
 const namespaces = [
   "empty",

package/src/stores/packages.ts

@@ -1,6 +1,6 @@
 import { fetchReportJsonData } from "@allurereport/web-commons";
 import { computed, signal } from "@preact/signals";
-import type { AwesomeStatus, AwesomeTree, AwesomeTreeGroup } from "types";
+import type { ClassicStatus, ClassicTree, ClassicTreeGroup } from "types";
 import type { StoreSignalState } from "@/stores/types";
 import { createRecursiveTree, isRecursiveTreeEmpty } from "@/utils/treeFilters";
 
@@ -9,13 +9,13 @@ export type TreeDirection = "asc" | "desc";
 export type TreeFilters = "flaky" | "retry" | "new";
 export type TreeFiltersState = {
   query: string;
-  status: AwesomeStatus;
+  status: ClassicStatus;
   filter: Record<TreeFilters, boolean>;
   sortBy: TreeSortBy;
   direction: TreeDirection;
 };
 
-export const packagesStore = signal<StoreSignalState<AwesomeTree>>({
+export const packagesStore = signal<StoreSignalState<ClassicTree>>({
   loading: true,
   error: undefined,
   data: undefined,
@@ -39,7 +39,7 @@ export const filteredPackages = computed(() => {
   const { root, leavesById, groupsById } = packagesStore.value.data;
 
   return createRecursiveTree({
-    group: root as AwesomeTreeGroup,
+    group: root as ClassicTreeGroup,
     leavesById,
     groupsById,
     filterOptions: packagesFiltersStore.value,
@@ -71,7 +71,7 @@ export const setPackagesQuery = (query: string) => {
   };
 };
 
-export const setPackagesStatus = (status: AwesomeStatus) => {
+export const setPackagesStatus = (status: ClassicStatus) => {
   packagesFiltersStore.value = {
     ...packagesFiltersStore.value,
     status,
@@ -110,7 +110,7 @@ export const fetchPackagesData = async () => {
   };
 
   try {
-    const res = await fetchReportJsonData<AwesomeTree>("widgets/packages.json", { bustCache: true });
+    const res = await fetchReportJsonData<ClassicTree>("widgets/packages.json", { bustCache: true });
 
     packagesStore.value = {
       data: res,

package/src/stores/testResults.ts

@@ -1,9 +1,9 @@
 import { fetchReportJsonData } from "@allurereport/web-commons";
 import { signal } from "@preact/signals";
-import { type AwesomeTestResult } from "types";
+import { type ClassicTestResult } from "types";
 import { type StoreSignalState } from "./types";
 
-export type TestResultsStoreState = Record<string, AwesomeTestResult>;
+export type TestResultsStoreState = Record<string, ClassicTestResult>;
 
 export type TestResultNavStoreState = string[];
 
@@ -49,7 +49,7 @@ export const fetchTestResult = async (testResultId: string) => {
   };
 
   try {
-    const data = await fetchReportJsonData<AwesomeTestResult>(`data/test-results/${testResultId}.json`);
+    const data = await fetchReportJsonData<ClassicTestResult>(`data/test-results/${testResultId}.json`);
 
     testResultStore.value = {
       data: { ...testResultStore.value.data, [testResultId]: data },

package/src/stores/theme.ts

@@ -1,33 +1,30 @@
 import { getReportOptions } from "@allurereport/web-commons";
+import type { Theme } from "@allurereport/web-components";
 import { signal } from "@preact/signals";
-import type { AwesomeReportOptions } from "../../types.js";
+import type { ClassicReportOptions } from "../../types.js";
 
-type Theme = "light" | "dark";
+export const themeStore = signal<Theme>("auto");
 
-const { theme } = getReportOptions<AwesomeReportOptions>() ?? {};
+export const setTheme = (mode: "light" | "dark" | "auto") => {
+  themeStore.value = mode;
 
-export const themeStore = signal<Theme>("light");
+  try {
+    window.localStorage.setItem("theme", mode);
+  } catch {}
 
-export const setTheme = (newTheme: Theme): void => {
-  themeStore.value = newTheme;
-  document.documentElement.setAttribute("data-theme", newTheme);
-  window.localStorage.setItem("theme", newTheme);
+  document.documentElement.setAttribute("data-theme", mode);
 };
 
 export const toggleTheme = () => {
-  setTheme(themeStore.value === "light" ? "dark" : "light");
+  const order = ["light", "dark", "auto"];
+  const current = themeStore.value;
+  const next = order[(order.indexOf(current) + 1) % order.length] as Theme;
+  setTheme(next);
 };
 
 export const getTheme = () => {
+  const { theme } = getReportOptions<ClassicReportOptions>() ?? {};
   const themeFromLS = (window.localStorage.getItem("theme") as Theme | null) || (theme as Theme);
 
-  if (themeFromLS) {
-    setTheme(themeFromLS);
-    return;
-  }
-
-  const prefersDarkScheme = window.matchMedia("(prefers-color-scheme: dark)").matches;
-  const initialTheme = prefersDarkScheme ? "dark" : "light";
-
-  setTheme(initialTheme);
+  setTheme(themeFromLS);
 };

package/src/stores/tree.ts

@@ -1,6 +1,6 @@
 import { fetchReportJsonData } from "@allurereport/web-commons";
 import { computed, signal } from "@preact/signals";
-import type { AwesomeStatus, AwesomeTree, AwesomeTreeGroup } from "types";
+import type { ClassicStatus, ClassicTree, ClassicTreeGroup } from "types";
 import type { StoreSignalState } from "@/stores/types";
 import { createRecursiveTree, isRecursiveTreeEmpty } from "@/utils/treeFilters";
 
@@ -9,13 +9,13 @@ export type TreeDirection = "asc" | "desc";
 export type TreeFilters = "flaky" | "retry" | "new";
 export type TreeFiltersState = {
   query: string;
-  status: AwesomeStatus;
+  status: ClassicStatus;
   filter: Record<TreeFilters, boolean>;
   sortBy: TreeSortBy;
   direction: TreeDirection;
 };
 
-export const treeStore = signal<StoreSignalState<AwesomeTree>>({
+export const treeStore = signal<StoreSignalState<ClassicTree>>({
   loading: true,
   error: undefined,
   data: undefined,
@@ -39,7 +39,7 @@ export const filteredTree = computed(() => {
   const { root, leavesById, groupsById } = treeStore.value.data;
 
   return createRecursiveTree({
-    group: root as AwesomeTreeGroup,
+    group: root as ClassicTreeGroup,
     leavesById,
     groupsById,
     filterOptions: treeFiltersStore.value,
@@ -71,7 +71,7 @@ export const setTreeQuery = (query: string) => {
   };
 };
 
-export const setTreeStatus = (status: AwesomeStatus) => {
+export const setTreeStatus = (status: ClassicStatus) => {
   treeFiltersStore.value = {
     ...treeFiltersStore.value,
     status,
@@ -110,7 +110,7 @@ export const fetchTreeData = async () => {
   };
 
   try {
-    const res = await fetchReportJsonData<AwesomeTree>("widgets/tree.json", { bustCache: true });
+    const res = await fetchReportJsonData<ClassicTree>("widgets/tree.json", { bustCache: true });
 
     treeStore.value = {
       data: res,

package/src/utils/treeFilters.ts

@@ -12,9 +12,9 @@ import {
   reverse,
 } from "@allurereport/core-api";
 import type { TreeFiltersState, TreeSortBy } from "@/stores/tree";
-import type { AwesomeRecursiveTree, AwesomeTree, AwesomeTreeGroup, AwesomeTreeLeaf } from "../../types";
+import type { ClassicRecursiveTree, ClassicTree, ClassicTreeGroup, ClassicTreeLeaf } from "../../types";
 
-export const isIncluded = (leaf: TreeLeaf<AwesomeTreeLeaf>, filterOptions: TreeFiltersState) => {
+export const isIncluded = (leaf: TreeLeaf<ClassicTreeLeaf>, filterOptions: TreeFiltersState) => {
   const queryMatched = !filterOptions?.query || leaf.name.toLowerCase().includes(filterOptions.query.toLowerCase());
   const statusMatched =
     !filterOptions?.status || filterOptions?.status === "total" || leaf.status === filterOptions.status;
@@ -26,8 +26,8 @@ export const isIncluded = (leaf: TreeLeaf<AwesomeTreeLeaf>, filterOptions: TreeF
   return [queryMatched, statusMatched, flakyMatched, retryMatched].every(Boolean);
 };
 
-const leafComparatorByTreeSortBy = (sortBy: TreeSortBy): Comparator<TreeLeaf<AwesomeTreeLeaf>> => {
-  const typedCompareBy = compareBy<TreeLeaf<AwesomeTreeLeaf>>;
+const leafComparatorByTreeSortBy = (sortBy: TreeSortBy): Comparator<TreeLeaf<ClassicTreeLeaf>> => {
+  const typedCompareBy = compareBy<TreeLeaf<ClassicTreeLeaf>>;
   switch (sortBy) {
     case "order":
       return typedCompareBy("groupOrder", ordinal());
@@ -52,7 +52,7 @@ const groupComparatorByTreeSortBy = (sortBy: TreeSortBy): Comparator<DefaultTree
   }
 };
 
-export const leafComparator = (filterOptions: TreeFiltersState): Comparator<TreeLeaf<AwesomeTreeLeaf>> => {
+export const leafComparator = (filterOptions: TreeFiltersState): Comparator<TreeLeaf<ClassicTreeLeaf>> => {
   const cmp = leafComparatorByTreeSortBy(filterOptions.sortBy);
   const directional = filterOptions.direction === "asc" ? cmp : reverse(cmp);
   // apply fallback sorting by name
@@ -68,12 +68,12 @@ export const groupComparator = (filterOptions: TreeFiltersState): Comparator<Def
 
 export const filterLeaves = (
   leaves: string[] = [],
-  leavesById: AwesomeTree["leavesById"],
+  leavesById: ClassicTree["leavesById"],
   filterOptions: TreeFiltersState,
 ) => {
   const filteredLeaves = [...leaves]
     .map((leafId) => leavesById[leafId])
-    .filter((leaf: TreeLeaf<AwesomeTreeLeaf>) => isIncluded(leaf, filterOptions));
+    .filter((leaf: TreeLeaf<ClassicTreeLeaf>) => isIncluded(leaf, filterOptions));
 
   const comparator = leafComparator(filterOptions);
   return filteredLeaves.sort(comparator);
@@ -85,11 +85,11 @@ export const filterLeaves = (
  * @param payload
  */
 export const createRecursiveTree = (payload: {
-  group: AwesomeTreeGroup;
-  groupsById: AwesomeTree["groupsById"];
-  leavesById: AwesomeTree["leavesById"];
+  group: ClassicTreeGroup;
+  groupsById: ClassicTree["groupsById"];
+  leavesById: ClassicTree["leavesById"];
   filterOptions?: TreeFiltersState;
-}): AwesomeRecursiveTree => {
+}): ClassicRecursiveTree => {
   const { group, groupsById, leavesById, filterOptions } = payload;
   const groupLeaves: string[] = group.leaves ?? [];
 
@@ -107,7 +107,7 @@ export const createRecursiveTree = (payload: {
       ?.filter((rt) => !isRecursiveTreeEmpty(rt)) ?? [];
 
   const statistic: Statistic = emptyStatistic();
-  trees.forEach((rt: AwesomeRecursiveTree) => {
+  trees.forEach((rt: ClassicRecursiveTree) => {
     if (rt.statistic) {
       const additional: Statistic = rt.statistic;
       mergeStatistic(statistic, additional);
@@ -126,7 +126,7 @@ export const createRecursiveTree = (payload: {
   };
 };
 
-export const isRecursiveTreeEmpty = (tree: AwesomeRecursiveTree): boolean => {
+export const isRecursiveTreeEmpty = (tree: ClassicRecursiveTree): boolean => {
   if (!tree.trees?.length && !tree.leaves?.length) {
     return true;
   }