@allurereport/web-awesome 3.0.1 → 3.1.0

package/src/components/ReportBody/Filters.tsx

@@ -1,122 +0,0 @@
-import { Button, Menu, Toggle, TooltipWrapper, allureIcons } from "@allurereport/web-components";
-import { computed } from "@preact/signals";
-import { For } from "@preact/signals/utils";
-import { useEffect } from "preact/hooks";
-import { useI18n } from "@/stores/locale";
-import {
-  type TreeFilters,
-  setFilters,
-  setTestTypeFilter,
-  setTransitionFilter,
-  testTypeFilters,
-  transitionFilters,
-} from "@/stores/treeFilters";
-import { filtersList } from "@/stores/treeFilters/constants";
-import * as styles from "./styles.scss";
-
-const filterIcons: Record<TreeFilters, string> = {
-  flaky: allureIcons.lineIconBomb2,
-  retry: allureIcons.lineArrowsRefreshCcw1,
-  new: allureIcons.lineAlertsNew,
-  fixed: allureIcons.lineAlertsFixed,
-  regressed: allureIcons.lineAlertsRegressed,
-  malfunctioned: allureIcons.lineAlertsMalfunctioned,
-};
-
-const FilterItem = (props: { filter: TreeFilters; value: boolean; onChange: (value: boolean) => void }) => {
-  const { filter, value, onChange } = props;
-  const { t: tooltip } = useI18n("filters.description");
-  const { t } = useI18n("filters");
-
-  return (
-    <TooltipWrapper data-testid="filter-tooltip" tooltipText={tooltip(filter)}>
-      <Menu.Item
-        closeMenuOnClick={false}
-        ariaLabel={t("enable-filter", { filter: t(filter) })}
-        onClick={() => onChange(!value)}
-        leadingIcon={filterIcons[filter]}
-        rightSlot={
-          <div className={styles.filterToggle}>
-            <Toggle
-              focusable={false}
-              value={value}
-              label={t("enable-filter", { filter: t(filter) })}
-              data-testid={`${filter}-filter`}
-              onChange={(changeValue) => onChange(changeValue)}
-            />
-          </div>
-        }
-      >
-        {t(filter)}
-      </Menu.Item>
-    </TooltipWrapper>
-  );
-};
-
-const hasFilter = computed(
-  () => transitionFilters.value.some(([, value]) => value) || testTypeFilters.value.some(([, value]) => value),
-);
-
-export const Filters = () => {
-  const { t } = useI18n("filters");
-
-  useEffect(() => {
-    const params = new URLSearchParams(window.location.search);
-    const filtersParams = params.getAll("filter");
-
-    if (filtersParams.length > 0) {
-      const activeFilters = filtersList.reduce(
-        (acc, key) => ({
-          ...acc,
-          [key]: filtersParams.includes(key),
-        }),
-        {} as Record<string, boolean>,
-      );
-
-      setFilters(activeFilters);
-    }
-  }, []);
-
-  return (
-    <Menu
-      menuTrigger={({ isOpened, onClick }) => (
-        <div className={hasFilter.value && styles.filtersBtnWithFilters}>
-          <Button
-            icon={allureIcons.lineGeneralSettings1}
-            text={t("more-filters")}
-            size="m"
-            style="outline"
-            isActive={isOpened}
-            data-testid="filters-button"
-            onClick={onClick}
-          />
-        </div>
-      )}
-    >
-      <Menu.Section>
-        <For each={testTypeFilters}>
-          {([filter, value]) => (
-            <FilterItem
-              key={filter}
-              filter={filter}
-              value={value}
-              onChange={(newValue) => setTestTypeFilter(filter, newValue)}
-            />
-          )}
-        </For>
-      </Menu.Section>
-      <Menu.Section data-testid="filters-menu">
-        <For each={transitionFilters}>
-          {([filter, value]) => (
-            <FilterItem
-              key={filter}
-              filter={filter}
-              value={value}
-              onChange={(newValue) => setTransitionFilter(filter, newValue)}
-            />
-          )}
-        </For>
-      </Menu.Section>
-    </Menu>
-  );
-};

package/src/stores/theme.ts

@@ -1,30 +0,0 @@
-import { getReportOptions } from "@allurereport/web-commons";
-import type { Theme } from "@allurereport/web-components";
-import { signal } from "@preact/signals";
-import type { AwesomeReportOptions } from "../../types.js";
-
-export const themeStore = signal<Theme>("auto");
-
-export const setTheme = (mode: "light" | "dark" | "auto") => {
-  themeStore.value = mode;
-
-  try {
-    window.localStorage.setItem("theme", mode);
-  } catch {}
-
-  document.documentElement.setAttribute("data-theme", mode);
-};
-
-export const toggleTheme = () => {
-  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<AwesomeReportOptions>() ?? {};
-  const themeFromLS = (window.localStorage.getItem("theme") as Theme | null) || (theme as Theme);
-
-  setTheme(themeFromLS);
-};

package/src/stores/treeFilters/index.ts

@@ -1,3 +0,0 @@
-export * from "./store";
-export * from "./actions";
-export type * from "./types";

package/src/stores/treeFilters/types.ts

@@ -1,12 +0,0 @@
-import type { AwesomeStatus } from "types";
-
-export type TreeSortBy = "order" | "duration" | "status" | "alphabet";
-export type TreeDirection = "asc" | "desc";
-export type TreeFilters = "flaky" | "retry" | "new" | "fixed" | "regressed" | "malfunctioned";
-export type TreeFiltersState = {
-  query: string;
-  status: AwesomeStatus;
-  filter: Record<TreeFilters, boolean>;
-  sortBy: TreeSortBy;
-  direction: TreeDirection;
-};

package/test/stores/treeFilters.test.ts

@@ -1,302 +0,0 @@
-import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
-import {
-  clearTreeFilters,
-  setTestTypeFilter,
-  setTransitionFilter,
-  setTreeDirection,
-  setTreeQuery,
-  setTreeSortBy,
-  setTreeStatus,
-  treeDirection,
-  treeFilter,
-  treeQuery,
-  treeSortBy,
-  treeStatus,
-} from "@/stores/treeFilters";
-
-const defaultFilter = {
-  flaky: false,
-  retry: false,
-  new: false,
-  fixed: false,
-  regressed: false,
-  malfunctioned: false,
-};
-
-describe("stores > treeFilters", () => {
-  beforeEach(() => {
-    // Reset all signals to default state before each test
-    treeQuery.value = "";
-    treeStatus.value = "total";
-    treeSortBy.value = "order";
-    treeDirection.value = "asc";
-    treeFilter.value = { ...defaultFilter };
-  });
-
-  afterEach(() => {
-    vi.clearAllMocks();
-  });
-
-  describe("clearTreeFilters", () => {
-    it("should reset query, status and filters to default state", () => {
-      // Set some non-default values
-      treeQuery.value = "test query";
-      treeStatus.value = "passed";
-      treeFilter.value = {
-        flaky: true,
-        retry: true,
-        new: true,
-        fixed: true,
-        regressed: true,
-        malfunctioned: true,
-      };
-
-      clearTreeFilters();
-
-      expect(treeQuery.value).toBe("");
-      expect(treeStatus.value).toBe("total");
-      expect(treeFilter.value).toEqual(defaultFilter);
-    });
-
-    it("should not reset sortBy and direction", () => {
-      treeSortBy.value = "duration";
-      treeDirection.value = "desc";
-
-      clearTreeFilters();
-
-      expect(treeSortBy.value).toBe("duration");
-      expect(treeDirection.value).toBe("desc");
-    });
-  });
-
-  describe("setTreeQuery", () => {
-    it("should update query", () => {
-      setTreeQuery("search term");
-
-      expect(treeQuery.value).toBe("search term");
-    });
-
-    it("should update query to empty string", () => {
-      treeQuery.value = "some query";
-
-      setTreeQuery("");
-
-      expect(treeQuery.value).toBe("");
-    });
-  });
-
-  describe("setTreeStatus", () => {
-    it("should update status to passed", () => {
-      setTreeStatus("passed");
-
-      expect(treeStatus.value).toBe("passed");
-    });
-
-    it("should update status to failed", () => {
-      setTreeStatus("failed");
-
-      expect(treeStatus.value).toBe("failed");
-    });
-
-    it("should update status to broken", () => {
-      setTreeStatus("broken");
-
-      expect(treeStatus.value).toBe("broken");
-    });
-
-    it("should update status to skipped", () => {
-      setTreeStatus("skipped");
-
-      expect(treeStatus.value).toBe("skipped");
-    });
-
-    it("should update status to total", () => {
-      treeStatus.value = "passed";
-
-      setTreeStatus("total");
-
-      expect(treeStatus.value).toBe("total");
-    });
-  });
-
-  describe("setTreeSortBy", () => {
-    it("should update sortBy to duration", () => {
-      setTreeSortBy("duration");
-
-      expect(treeSortBy.value).toBe("duration");
-    });
-
-    it("should update sortBy to status", () => {
-      setTreeSortBy("status");
-
-      expect(treeSortBy.value).toBe("status");
-    });
-
-    it("should update sortBy to alphabet", () => {
-      setTreeSortBy("alphabet");
-
-      expect(treeSortBy.value).toBe("alphabet");
-    });
-
-    it("should update sortBy to order", () => {
-      treeSortBy.value = "duration";
-
-      setTreeSortBy("order");
-
-      expect(treeSortBy.value).toBe("order");
-    });
-  });
-
-  describe("setTreeDirection", () => {
-    it("should update direction to desc", () => {
-      setTreeDirection("desc");
-
-      expect(treeDirection.value).toBe("desc");
-    });
-
-    it("should update direction to asc", () => {
-      treeDirection.value = "desc";
-
-      setTreeDirection("asc");
-
-      expect(treeDirection.value).toBe("asc");
-    });
-  });
-
-  describe("setTestTypeFilter", () => {
-    it("should enable flaky filter", () => {
-      setTestTypeFilter("flaky", true);
-
-      expect(treeFilter.value.flaky).toBe(true);
-    });
-
-    it("should disable flaky filter", () => {
-      treeFilter.value = { ...defaultFilter, flaky: true };
-
-      setTestTypeFilter("flaky", false);
-
-      expect(treeFilter.value.flaky).toBe(false);
-    });
-
-    it("should enable retry filter", () => {
-      setTestTypeFilter("retry", true);
-
-      expect(treeFilter.value.retry).toBe(true);
-    });
-
-    it("should disable retry filter", () => {
-      treeFilter.value = { ...defaultFilter, retry: true };
-
-      setTestTypeFilter("retry", false);
-
-      expect(treeFilter.value.retry).toBe(false);
-    });
-
-    it("should enable both flaky and retry filters independently", () => {
-      setTestTypeFilter("flaky", true);
-      setTestTypeFilter("retry", true);
-
-      expect(treeFilter.value.flaky).toBe(true);
-      expect(treeFilter.value.retry).toBe(true);
-    });
-
-    it("should not affect transition filters", () => {
-      treeFilter.value = { ...defaultFilter, new: true };
-
-      setTestTypeFilter("flaky", true);
-
-      expect(treeFilter.value.new).toBe(true);
-      expect(treeFilter.value.flaky).toBe(true);
-    });
-  });
-
-  describe("setTransitionFilter", () => {
-    it("should enable new filter", () => {
-      setTransitionFilter("new", true);
-
-      expect(treeFilter.value.new).toBe(true);
-    });
-
-    it("should enable fixed filter", () => {
-      setTransitionFilter("fixed", true);
-
-      expect(treeFilter.value.fixed).toBe(true);
-    });
-
-    it("should enable regressed filter", () => {
-      setTransitionFilter("regressed", true);
-
-      expect(treeFilter.value.regressed).toBe(true);
-    });
-
-    it("should enable malfunctioned filter", () => {
-      setTransitionFilter("malfunctioned", true);
-
-      expect(treeFilter.value.malfunctioned).toBe(true);
-    });
-
-    it("should disable the previous transition when enabling a new one", () => {
-      setTransitionFilter("new", true);
-      expect(treeFilter.value.new).toBe(true);
-
-      setTransitionFilter("fixed", true);
-
-      expect(treeFilter.value.new).toBe(false);
-      expect(treeFilter.value.fixed).toBe(true);
-      expect(treeFilter.value.regressed).toBe(false);
-      expect(treeFilter.value.malfunctioned).toBe(false);
-    });
-
-    it("should disable all other transitions when enabling regressed", () => {
-      treeFilter.value = { ...defaultFilter, new: true, fixed: true };
-
-      setTransitionFilter("regressed", true);
-
-      expect(treeFilter.value.new).toBe(false);
-      expect(treeFilter.value.fixed).toBe(false);
-      expect(treeFilter.value.regressed).toBe(true);
-      expect(treeFilter.value.malfunctioned).toBe(false);
-    });
-
-    it("should allow only one transition to be enabled at a time", () => {
-      setTransitionFilter("new", true);
-      setTransitionFilter("fixed", true);
-      setTransitionFilter("regressed", true);
-      setTransitionFilter("malfunctioned", true);
-
-      expect(treeFilter.value.new).toBe(false);
-      expect(treeFilter.value.fixed).toBe(false);
-      expect(treeFilter.value.regressed).toBe(false);
-      expect(treeFilter.value.malfunctioned).toBe(true);
-    });
-
-    it("should disable the transition when value is false", () => {
-      treeFilter.value = { ...defaultFilter, new: true };
-
-      setTransitionFilter("new", false);
-
-      expect(treeFilter.value.new).toBe(false);
-    });
-
-    it("should disable all transitions when disabling the active one", () => {
-      setTransitionFilter("fixed", true);
-
-      setTransitionFilter("fixed", false);
-
-      expect(treeFilter.value.new).toBe(false);
-      expect(treeFilter.value.fixed).toBe(false);
-      expect(treeFilter.value.regressed).toBe(false);
-      expect(treeFilter.value.malfunctioned).toBe(false);
-    });
-
-    it("should not affect test type filters (flaky, retry)", () => {
-      treeFilter.value = { ...defaultFilter, flaky: true, retry: true };
-
-      setTransitionFilter("new", true);
-
-      expect(treeFilter.value.flaky).toBe(true);
-      expect(treeFilter.value.retry).toBe(true);
-      expect(treeFilter.value.new).toBe(true);
-    });
-  });
-});