@allurereport/web-awesome 3.1.0 → 3.3.0

package/src/locales/{ua.json → uk.json}

@@ -21,7 +21,8 @@
     "results": "Результати",
     "globalAttachments": "Глобальні Вкладення",
     "globalErrors": "Глобальні Помилки",
-    "qualityGates": "Ворота Якості"
+    "qualityGates": "Ворота Якості",
+    "categories": "Категорії"
   },
   "search": {
     "search": "Пошук",
@@ -29,13 +30,19 @@
   },
   "filters": {
     "flaky": "Нестабільні",
+    "nonFlaky": "Стабільні",
     "retry": "Повторені",
     "new": "Нові",
     "fixed": "Виправлені",
     "regressed": "Регресовані",
     "malfunctioned": "Зламані",
     "transition": "Перехід",
+    "status": "Статус",
+    "severity": "Важливість",
+    "owner": "Власник",
+    "layer": "Шар",
     "tags": "Теги",
+    "categories": "Категорії",
     "goto_filter": "Перейти до фільтру",
     "errors": {
       "max_values_one": "Тільки перше {{count}} значення використовується для фільтрації.\nДодаткові значення ігноруються",
@@ -48,7 +55,8 @@
       "fixed": "Показати тести, які тепер успішні, але раніше були \"неуспішними\" або \"зламаними\" в попередньому звіті",
       "regressed": "Показати результати тестів, які змінили статус на \"неуспішний\" з \"успішний\" або \"зламаний\"",
       "malfunctioned": "Показати результати тестів, які змінили статус на \"зламаний\" з \"успішний\" або \"неуспішний\"",
-      "tags": "Показати результати тестів, які мають вказані теги"
+      "tags": "Показати результати тестів, які мають вказані теги",
+      "categories": "Показати результати тестів, які мають зазначені категорії"
     }
   },
   "sort-by": {
@@ -82,6 +90,16 @@
   },
   "empty": {
     "no-results": "Немає результатів",
+    "no-value": "Немає значення",
+    "no-value-for": "Немає значення: {{entity}}",
+    "no-transition": "Немає переходу",
+    "no-layer": "Немає шару",
+    "no-owner": "Немає власника",
+    "no-severity": "Немає важливості",
+    "no-status": "Немає статусу",
+    "no-environment": "Немає середовища",
+    "no-flaky": "Немає нестабільності",
+    "empty-value": "Порожньо",
     "no-tests-found": "Результати не знайдено",
     "no-message-provided": "Повідомлення не надано",
     "clear-filters": "Очистити фільтри",
@@ -92,7 +110,8 @@
     "no-retries-results": "Інформація про перезапуски відсутня",
     "no-test-steps-results": "Немає інформації про кроки тестування",
     "no-test-case-results": "Немає результатів тест-кейсів",
-    "no-environments-results": "Інформація про оточення відсутня"
+    "no-environments-results": "Інформація про оточення відсутня",
+    "no-categories-results": "Немає доступних результатів за категоріями"
   },
   "severity": {
     "blocker": "блокер",
@@ -116,6 +135,7 @@
     "labels": "Мітки",
     "metadata": "Метадані",
     "parameters": "Параметри",
+    "category": "Категорія",
     "description": "Опис",
     "links": "Посилання",
     "overview": "Огляд",
@@ -128,6 +148,7 @@
     "showLess": "Показати менше",
     "showMore": "Показати більше",
     "copy": "Скопіювати",
+    "copy-email": "Скопіювати email",
     "attempt": "Спроба {{attempt}} з {{total}}",
     "at": "в",
     "variables": "Змінні",
@@ -257,8 +278,8 @@
         "history": "{{timestamp, timestamp_date}}"
       }
     },
-    "fbsuAgePyramid": {
-      "title": "FBSU вікова піраміда",
+    "statusAgePyramid": {
+      "title": "Вікова піраміда за статусом",
       "status": {
         "passed": "$t(statuses:passed, capitalize)",
         "failed": "$t(statuses:failed, capitalize)",

package/src/locales/zh.json

@@ -21,7 +21,8 @@
     "results": "结果",
     "globalAttachments": "全局附件",
     "globalErrors": "全局错误",
-    "qualityGates": "质量门"
+    "qualityGates": "质量门",
+    "categories": "分类"
   },
   "search": {
     "search": "搜索",
@@ -29,13 +30,19 @@
   },
   "filters": {
     "flaky": "不稳定",
+    "nonFlaky": "稳定",
     "retry": "重试",
     "new": "新的",
     "fixed": "已修复",
     "regressed": "已回归",
     "malfunctioned": "已损坏",
     "transition": "过渡",
+    "status": "状态",
+    "severity": "严重程度",
+    "owner": "负责人",
+    "layer": "层",
     "tags": "标签",
+    "categories": "分类",
     "goto_filter": "转到过滤器",
     "errors": {
       "max_values_one": "仅使用第一个 {{count}} 值进行过滤。\n忽略其他值",
@@ -48,7 +55,8 @@
       "fixed": "显示现在通过但之前\"失败\"或\"损坏\"的测试",
       "regressed": "显示从\"通过\"或\"损坏\"状态变为\"失败\"状态的测试结果",
       "malfunctioned": "显示从\"通过\"或\"失败\"状态变为\"损坏\"状态的测试结果",
-      "tags": "显示具有指定标签的测试结果"
+      "tags": "显示具有指定标签的测试结果",
+      "categories": "显示具有指定分类的测试结果"
     }
   },
   "sort-by": {
@@ -82,6 +90,16 @@
   },
   "empty": {
     "no-results": "没有结果",
+    "no-value": "无值",
+    "no-value-for": "无值：{{entity}}",
+    "no-transition": "无过渡",
+    "no-layer": "无层",
+    "no-owner": "无负责人",
+    "no-severity": "无严重程度",
+    "no-status": "无状态",
+    "no-environment": "无环境",
+    "no-flaky": "无不稳定",
+    "empty-value": "空",
     "no-tests-found": "未找到结果",
     "no-message-provided": "未提供消息",
     "clear-filters": "清除过滤器",
@@ -92,7 +110,8 @@
     "no-retries-results": "没有重试信息",
     "no-test-steps-results": "没有可用的测试步骤信息",
     "no-test-case-results": "没有测试用例结果",
-    "no-environments-results": "没有环境信息"
+    "no-environments-results": "没有环境信息",
+    "no-categories-results": "暂无可用的分类结果"
   },
   "severity": {
     "blocker": "阻断",
@@ -116,6 +135,7 @@
     "labels": "标签",
     "metadata": "元数据",
     "parameters": "参数",
+    "category": "分类",
     "description": "描述",
     "links": "链接",
     "overview": "概览",
@@ -128,6 +148,7 @@
     "showLess": "显示更少",
     "showMore": "显示更多",
     "copy": "复制",
+    "copy-email": "复制邮箱",
     "attempt": "第 {{attempt}} 次尝试，共 {{total}} 次",
     "at": "在",
     "variables": "变量",
@@ -306,8 +327,8 @@
         "history": "{{timestamp, timestamp_date}}"
       }
     },
-    "fbsuAgePyramid": {
-      "title": "FBSU年龄金字塔",
+    "statusAgePyramid": {
+      "title": "状态年龄金字塔",
       "status": {
         "passed": "$t(statuses:passed, capitalize)",
         "failed": "$t(statuses:failed, capitalize)",

package/src/stores/categories.ts

@@ -0,0 +1,44 @@
+import type { TestCategories } from "@allurereport/core-api";
+import { fetchReportJsonData } from "@allurereport/web-commons";
+import { computed, signal } from "@preact/signals";
+import type { StoreSignalState } from "@/stores/types";
+
+export const categoriesStore = signal<StoreSignalState<TestCategories>>({
+  loading: true,
+  error: undefined,
+  data: undefined,
+});
+
+export const noCategories = computed(() => categoriesStore?.value?.data.roots.length);
+
+let lastCategoriesEnv: string | undefined;
+
+const resolveCategoriesPath = (env?: string) => (env ? `widgets/${env}/categories.json` : "widgets/categories.json");
+
+export const fetchCategoriesData = async (env?: string) => {
+  if (lastCategoriesEnv === env && categoriesStore.peek().data) {
+    return;
+  }
+  lastCategoriesEnv = env;
+  categoriesStore.value = {
+    ...categoriesStore.value,
+    loading: true,
+    error: undefined,
+  };
+
+  try {
+    const res = await fetchReportJsonData<TestCategories>(resolveCategoriesPath(env));
+
+    categoriesStore.value = {
+      data: res,
+      error: undefined,
+      loading: false,
+    };
+  } catch (e) {
+    categoriesStore.value = {
+      ...categoriesStore.value,
+      error: undefined,
+      loading: false,
+    };
+  }
+};

package/src/stores/locale.ts

@@ -1,5 +1,11 @@
 import { formatDuration } from "@allurereport/core-api";
-import { DEFAULT_LOCALE, LANG_LOCALE, type LangLocale, getReportOptions } from "@allurereport/web-commons";
+import {
+  DEFAULT_LOCALE,
+  LANG_LOCALE,
+  type LangLocale,
+  getLocaleDateTimeOverride,
+  getReportOptions,
+} from "@allurereport/web-commons";
 import { computed, signal } from "@preact/signals";
 import i18next, { type TOptions } from "i18next";
 import type { AwesomeReportOptions } from "types";
@@ -50,7 +56,8 @@ export const waitForI18next = i18next
       namespace: string,
       callback: (errorValue: unknown, translations: null) => void,
     ) => {
-      await import(`@/locales/${language}.json`)
+      const loadLocale = language === "en-iso" ? "en" : language;
+      await import(`@/locales/${loadLocale}.json`)
         .then((resources: Record<string, null>) => {
           callback(null, resources[namespace]);
         })
@@ -66,43 +73,68 @@ export const waitForI18next = i18next
     interpolation: { escapeValue: false },
   })
   .then(() => {
-    i18next.services.formatter.add("capitalize", (value) => {
+    i18next.services.formatter.add("capitalize", (value: string) => {
       return value.charAt(0).toLocaleUpperCase() + value.slice(1);
     });
-    i18next.services.formatter.add("timestamp_date", (value: number, lng, options) => {
-      const formatter = new Intl.DateTimeFormat(lng, {
-        ...options,
-        month: "numeric",
-        day: "numeric",
-        year: "numeric",
-      });
-      return formatter.format(value);
-    });
-    i18next.services.formatter.add("timestamp_long", (value: number, lng, options) => {
-      const formatter = new Intl.DateTimeFormat(lng, {
-        ...options,
-        month: "numeric",
-        day: "numeric",
-        year: "numeric",
-        hour: "numeric",
-        minute: "numeric",
-        second: "numeric",
-        hour12: false,
-      });
-      return formatter.format(value).replace(",", ` ${i18next.t("ui:at")}`);
-    });
-    i18next.services.formatter.add("timestamp_long_no_seconds", (value: number, lng, options) => {
-      const formatter = new Intl.DateTimeFormat(lng, {
-        ...options,
-        month: "numeric",
-        day: "numeric",
-        year: "numeric",
-        hour: "numeric",
-        minute: "numeric",
-        hour12: false,
-      });
-      return formatter.format(value).replace(",", ` ${i18next.t("ui:at")}`);
-    });
+    i18next.services.formatter.add(
+      "timestamp_date",
+      (value: number, lng: string, options?: Intl.DateTimeFormatOptions) => {
+        const override = getLocaleDateTimeOverride(lng, "date");
+        const formatter = new Intl.DateTimeFormat(override?.locale ?? lng, {
+          ...options,
+          month: "numeric",
+          day: "numeric",
+          year: "numeric",
+          ...(override?.options ?? {}),
+        });
+        const formatted = formatter.format(value);
+        return override?.stripComma ? formatted.replace(",", "") : formatted;
+      },
+    );
+
+    i18next.services.formatter.add(
+      "timestamp_long",
+      (value: number, lng: string, options?: Intl.DateTimeFormatOptions) => {
+        const override = getLocaleDateTimeOverride(lng, "dateTime");
+        const formatter = new Intl.DateTimeFormat(override?.locale ?? lng, {
+          ...options,
+          month: "numeric",
+          day: "numeric",
+          year: "numeric",
+          hour: "numeric",
+          minute: "numeric",
+          second: "numeric",
+          hour12: false,
+          ...(override?.options ?? {}),
+        });
+        const formatted = formatter.format(value);
+        if (override?.includeAtSeparator === false || override?.stripComma) {
+          return formatted.replace(",", "");
+        }
+        return formatted.replace(",", ` ${i18next.t("ui:at")}`);
+      },
+    );
+    i18next.services.formatter.add(
+      "timestamp_long_no_seconds",
+      (value: number, lng: string, options?: Intl.DateTimeFormatOptions) => {
+        const override = getLocaleDateTimeOverride(lng, "dateTimeNoSeconds");
+        const formatter = new Intl.DateTimeFormat(override?.locale ?? lng, {
+          ...options,
+          month: "numeric",
+          day: "numeric",
+          year: "numeric",
+          hour: "numeric",
+          minute: "numeric",
+          hour12: false,
+          ...(override?.options ?? {}),
+        });
+        const formatted = formatter.format(value);
+        if (override?.includeAtSeparator === false || override?.stripComma) {
+          return formatted.replace(",", "");
+        }
+        return formatted.replace(",", ` ${i18next.t("ui:at")}`);
+      },
+    );
     i18next.services.formatter.add("format_duration", (value: number) => {
       return formatDuration(value);
     });

package/src/stores/qualityGate.ts

@@ -3,7 +3,7 @@ import { fetchReportJsonData } from "@allurereport/web-commons";
 import { signal } from "@preact/signals";
 import { type StoreSignalState } from "./types";
 
-export const qualityGateStore = signal<StoreSignalState<QualityGateValidationResult[]>>({
+export const qualityGateStore = signal<StoreSignalState<Record<string, QualityGateValidationResult[]>>>({
   loading: true,
   error: undefined,
   data: undefined,
@@ -11,7 +11,7 @@ export const qualityGateStore = signal<StoreSignalState<QualityGateValidationRes
 
 export const fetchQualityGateResults = async () => {
   try {
-    const data = await fetchReportJsonData<QualityGateValidationResult[]>("widgets/quality-gate.json");
+    const data = await fetchReportJsonData<Record<string, QualityGateValidationResult[]>>("widgets/quality-gate.json");
 
     qualityGateStore.value = {
       data,

package/src/stores/router.ts

@@ -1,27 +1,79 @@
 import { createRoute, navigateTo as routerNavigateTo } from "@allurereport/web-commons";
 import { computed } from "@preact/signals";
 
+const normalizeTab = (tab?: string) => (tab && tab !== "overview" ? tab : undefined);
+
 export const navigateToTestResult = (params: { testResultId: string; tab?: string }) => {
-  routerNavigateTo({ path: "/:testResultId/:tab?", params, keepSearchParams: true });
+  const normalized = { ...params, tab: normalizeTab(params.tab) };
+  const path = rootTabRoute.value.matches ? "/:rootTab/:testResultId/:tab?" : "/:testResultId/:tab?";
+  const routeParams = rootTabRoute.value.matches
+    ? { ...normalized, rootTab: rootTabRoute.value.params.rootTab }
+    : normalized;
+  routerNavigateTo({ path, params: routeParams, keepSearchParams: true });
+};
+
+export const navigateToPlainTestResult = (params: { testResultId: string; tab?: string }) => {
+  const normalized = { ...params, tab: normalizeTab(params.tab) };
+  routerNavigateTo({ path: "/:testResultId/:tab?", params: normalized, keepSearchParams: true });
 };
 
 export const navigateToTestResultTab = (params: { testResultId: string; tab: string }) => {
-  routerNavigateTo({ path: "/:testResultId/:tab?", params, keepSearchParams: true, replace: true });
+  const normalized = { ...params, tab: normalizeTab(params.tab) };
+  const path = rootTabRoute.value.matches ? "/:rootTab/:testResultId/:tab?" : "/:testResultId/:tab?";
+  const routeParams = rootTabRoute.value.matches
+    ? { ...normalized, rootTab: rootTabRoute.value.params.rootTab }
+    : normalized;
+  routerNavigateTo({ path, params: routeParams, keepSearchParams: true, replace: true });
 };
 
 export const navigateToRoot = () => {
   routerNavigateTo({ path: "/", keepSearchParams: true });
 };
 
+export const navigateToCategoriesRoot = () => {
+  routerNavigateTo({ path: "/categories", keepSearchParams: true });
+};
+
+export const navigateToCategoriesTestResult = (params: { testResultId: string; tab?: string }) => {
+  const normalized = { ...params, tab: normalizeTab(params.tab) };
+  routerNavigateTo({ path: "/categories/:testResultId/:tab?", params: normalized, keepSearchParams: true });
+};
+
+export const navigateToRootTabRoot = (params: { rootTab: string }) => {
+  routerNavigateTo({ path: "/:rootTab", params, keepSearchParams: true });
+};
+
+export const navigateToRootTabTestResult = (params: { rootTab: string; testResultId: string; tab?: string }) => {
+  const normalized = { ...params, tab: normalizeTab(params.tab) };
+  routerNavigateTo({ path: "/:rootTab/:testResultId/:tab?", params: normalized, keepSearchParams: true });
+};
+
 export const navigateToSection = (params: { section: "timeline" | "charts" }) => {
   routerNavigateTo({ path: "/:section", params, keepSearchParams: true, replace: false });
 };
 
 const sections = ["charts", "timeline"];
+const rootTabs = ["categories", "qualityGate", "globalAttachments", "globalErrors"];
+
+export const rootTabRoute = computed(() =>
+  createRoute<{ rootTab: string; testResultId?: string; tab?: string }>(
+    "/:rootTab/:testResultId?/:tab?",
+    ({ params }) => rootTabs.includes(params.rootTab) && params.rootTab !== params.testResultId,
+  ),
+);
+
+export const categoriesRoute = computed(() =>
+  createRoute<{ testResultId?: string; tab?: string }>("/categories/:testResultId?/:tab?"),
+);
 
 export const testResultRoute = computed(() =>
   createRoute<{ testResultId: string; tab?: string }>("/:testResultId/:tab?", ({ params }) => {
-    return params.testResultId && !sections.includes(params.testResultId);
+    return (
+      params.testResultId &&
+      params.testResultId !== "categories" &&
+      !sections.includes(params.testResultId) &&
+      !rootTabs.includes(params.testResultId)
+    );
   }),
 );
 

package/src/stores/testResult.ts

@@ -1,5 +1,16 @@
 import { computed } from "@preact/signals";
-import { testResultRoute } from "./router";
+import { rootTabRoute, testResultRoute } from "./router";
 
-export const trCurrentTab = computed(() => testResultRoute.value.params.tab ?? "overview");
-export const currentTrId = computed(() => testResultRoute.value.params.testResultId);
+const emptyRoute = { matches: false, params: {} as { testResultId?: string; tab?: string } };
+const activeTestResultRoute = computed(() => {
+  if (rootTabRoute.value.matches && rootTabRoute.value.params.testResultId) {
+    return rootTabRoute.value;
+  }
+  if (testResultRoute.value.matches) {
+    return testResultRoute.value;
+  }
+  return emptyRoute;
+});
+
+export const trCurrentTab = computed(() => activeTestResultRoute.value.params.tab ?? "overview");
+export const currentTrId = computed(() => activeTestResultRoute.value.params.testResultId);

package/src/stores/timeline.ts

@@ -5,8 +5,11 @@ import type { StoreSignalState } from "@/stores/types";
 
 export type TimlineTr = Pick<
   TestResult,
-  "id" | "name" | "status" | "flaky" | "hidden" | "labels" | "environment" | "start" | "stop" | "duration"
->;
+  "id" | "name" | "status" | "flaky" | "hidden" | "environment" | "start" | "duration"
+> & {
+  host: string;
+  thread: string;
+};
 
 export const timelineStore = signal<StoreSignalState<TimlineTr[]>>({
   loading: true,

package/src/stores/treeFilters/actions.ts

@@ -2,7 +2,7 @@ import type { TestStatus, TestStatusTransition } from "@allurereport/core-api";
 import { ReportFetchError, fetchReportJsonData, setParams } from "@allurereport/web-commons";
 import { PARAMS } from "./constants";
 import type { TreeFiltersData } from "./model";
-import { treeTags } from "./store";
+import { treeCategories, treeTags } from "./store";
 
 export const setQueryFilter = (query?: string) => {
   setParams({
@@ -46,14 +46,23 @@ export const setTagsFilter = (tags: string[]) => {
   });
 };
 
+export const setCategoriesFilter = (categories: string[]) => {
+  setParams({
+    key: PARAMS.CATEGORIES,
+    value: categories,
+  });
+};
+
 export const fetchTreeFiltersData = async () => {
   try {
     const response = await fetchReportJsonData<TreeFiltersData>("widgets/tree-filters.json", { bustCache: true });
 
     treeTags.value = response.tags;
+    treeCategories.value = response.categories ?? [];
   } catch (error) {
     if (error instanceof ReportFetchError && error.response.status === 404) {
       treeTags.value = [];
+      treeCategories.value = [];
       return;
     }
 

package/src/stores/treeFilters/constants.ts

@@ -10,4 +10,5 @@ export const PARAMS = {
   RETRY: "retry",
   TRANSITION: "transition",
   TAGS: "tags",
+  CATEGORIES: "categories",
 } as const;

package/src/stores/treeFilters/model.ts

@@ -16,6 +16,7 @@ export type Filters = {
   retry?: boolean;
   transition?: TestStatusTransition[];
   tags?: string[];
+  categories?: string[];
 };
 
 export type AwesomeFieldFilter = FieldFilter<keyof AwesomeTreeLeaf>;
@@ -48,4 +49,5 @@ export type AwesomeBooleanFieldFilter = AwesomeFieldFilter & {
 
 export type TreeFiltersData = {
   tags: string[];
+  categories: string[];
 };

package/src/stores/treeFilters/store.ts

@@ -3,6 +3,7 @@ import { getParamValue, getParamValues } from "@allurereport/web-commons";
 import { computed, signal } from "@preact/signals";
 import type { AwesomeStatus } from "types";
 import {
+  setCategoriesFilter,
   setFlakyFilter,
   setQueryFilter,
   setRetryFilter,
@@ -19,6 +20,7 @@ import type {
   AwesomeStringFieldFilter,
 } from "./model";
 import {
+  isCategoryFilter,
   isFlakyFilter,
   isRetryFilter,
   isTagFilter,
@@ -28,8 +30,10 @@ import {
 } from "./utils";
 
 export const treeTags = signal<string[]>([]);
+export const treeCategories = signal<string[]>([]);
 
 const hasTreeTags = computed(() => treeTags.value.length > 0);
+const hasTreeCategories = computed(() => treeCategories.value.length > 0);
 
 const urlQueryFilter = computed<string | undefined>(() => {
   const queryValue = getParamValue(PARAMS.QUERY) ?? "";
@@ -82,6 +86,22 @@ const urlTagsFilter = computed<string[]>(() => {
   return tags.filter((tag) => treeTags.value.includes(tag));
 });
 
+const EMPTY_CATEGORIES: string[] = [];
+
+const urlCategoriesFilter = computed<string[]>(() => {
+  const categories = getParamValues(PARAMS.CATEGORIES) ?? EMPTY_CATEGORIES;
+
+  if (categories.length === 0) {
+    return EMPTY_CATEGORIES;
+  }
+
+  if (treeCategories.value.length === 0) {
+    return categories;
+  }
+
+  return categories.filter((category) => treeCategories.value.includes(category));
+});
+
 const treeStatusFilter = computed<AwesomeStringFieldFilter>(() => ({
   type: "field",
   logicalOperator: "AND",
@@ -177,11 +197,23 @@ const treeTagsFilter = computed<AwesomeArrayFieldFilter>(() => ({
   },
 }));
 
+const treeCategoriesFilter = computed<AwesomeArrayFieldFilter>(() => ({
+  type: "field",
+  logicalOperator: "AND",
+  value: {
+    key: "categories",
+    value: urlCategoriesFilter.value,
+    type: "array",
+    strict: false,
+  },
+}));
+
 export const treeQuickFilters = computed<AwesomeFilter[]>(() => [
   treeRetryFilter.value,
   treeFlakyFilter.value,
   treeTransitionFilter.value,
   treeTagsFilter.value,
+  treeCategoriesFilter.value,
 ]);
 
 export const treeFilters = computed(() => {
@@ -220,6 +252,10 @@ export const treeFilters = computed(() => {
     filters.push(treeTagsFilter.value);
   }
 
+  if (urlCategoriesFilter.value.length > 0) {
+    filters.push(treeCategoriesFilter.value);
+  }
+
   if (urlStatusFilter.value) {
     filters.push(treeStatusFilter.value);
   }
@@ -255,6 +291,14 @@ export const setTreeFilter = (filter: AwesomeFilter) => {
   ) {
     setTagsFilter(filter.value.value);
   }
+
+  if (
+    isCategoryFilter(filter) &&
+    // Apply categories filter only if there are categories to filter by
+    hasTreeCategories.peek()
+  ) {
+    setCategoriesFilter(filter.value.value);
+  }
 };
 
 export const treeStatus = computed<AwesomeStatus>(() => urlStatusFilter.value ?? "total");
@@ -269,5 +313,6 @@ export const clearTreeFilters = () => {
   setFlakyFilter(false);
   setTransitionFilter([]);
   setTagsFilter([]);
+  setCategoriesFilter([]);
   setStatusFilter();
 };