fix ui issues

Author: formaceft-93

packages/plugin-awesome/src/generators.ts

@@ -45,8 +45,10 @@ import {
 } from "@allurereport/plugin-api";
 import type {
   AwesomeCategory,
+  AwesomeExecutorInfo,
   AwesomeFixtureResult,
   AwesomeReportOptions,
+  AwesomeRunSummary,
   AwesomeSearchDocument,
   AwesomeTestResult,
   AwesomeTreeGroup,
@@ -273,6 +275,22 @@ export const generateSearchIndex = async (
   await writer.writeWidget(filename, searchDocuments);
 };
 
+export const getRunSummary = (testResults: Pick<TestResult, "start" | "stop">[]): AwesomeRunSummary | undefined => {
+  let start = Infinity;
+  let stop = -Infinity;
+
+  for (const { start: s, stop: e } of testResults) {
+    if (typeof s === "number" && Number.isFinite(s) && typeof e === "number" && Number.isFinite(e)) {
+      start = Math.min(start, s);
+      stop = Math.max(stop, e);
+    }
+  }
+
+  return Number.isFinite(start) && Number.isFinite(stop)
+    ? { start, stop, duration: Math.max(0, stop - start) }
+    : undefined;
+};
+
 export const generateTree = async (
   writer: AwesomeDataWriter,
   treeFilename: string,
@@ -609,6 +627,8 @@ export const generateStaticFiles = async (
     reportDataFiles: ReportFile[];
     reportUuid: string;
     reportName: string;
+    executor?: AwesomeExecutorInfo;
+    runSummary?: AwesomeRunSummary;
   },
 ) => {
   const {
@@ -626,6 +646,8 @@ export const generateStaticFiles = async (
     layout = "base",
     defaultSection = "",
     ci,
+    executor,
+    runSummary,
     stepTreeExpansion,
   } = payload;
   const manifest = await readTemplateManifest(payload.singleFile);
@@ -685,6 +707,8 @@ export const generateStaticFiles = async (
     groupBy: groupBy?.length ? groupBy : [],
     cacheKey: now.toString(),
     ci,
+    executor,
+    runSummary,
     layout,
     allureVersion,
     sections,

packages/plugin-awesome/src/plugin.ts

@@ -7,6 +7,7 @@ import {
   createPluginSummary,
 } from "@allurereport/plugin-api";
 import { preciseTreeLabels } from "@allurereport/plugin-api";
+import type { AwesomeExecutorInfo } from "@allurereport/web-awesome";
 
 import { applyCategoriesToTestResults, generateCategories } from "./categories.js";
 import { generateTimeline } from "./generateTimeline.js";
@@ -28,6 +29,7 @@ import {
   generateTree,
   generateTreeFilters,
   generateVariables,
+  getRunSummary,
 } from "./generators.js";
 import type { AwesomePluginOptions } from "./model.js";
 import { type AwesomeDataWriter, InMemoryReportDataWriter, ReportFileDataWriter } from "./writer.js";
@@ -72,8 +74,10 @@ export class AwesomePlugin implements Plugin {
     const hideLabels = context.hideLabels;
     const categories = context.categories ?? [];
     const environmentItems = await store.metadataByKey<EnvironmentItem[]>("allure_environment");
+    const executor = await store.metadataByKey<AwesomeExecutorInfo>("allure2_executor");
     const attachments = await store.allAttachments();
     const allTrs = await store.allTestResults({ includeRetries: true, filter });
+    const runSummary = getRunSummary(allTrs);
     const statistics = await store.testsStatistic(filter);
     const environments = await store.allEnvironmentIdentities();
     const envStatistics = new Map<string, Statistic>();
@@ -197,6 +201,8 @@ export class AwesomePlugin implements Plugin {
       reportUuid: context.reportUuid,
       reportName: context.reportName,
       ci: context.ci,
+      executor,
+      runSummary,
       reportDataFiles,
     });
   };

packages/plugin-awesome/test/generators.test.ts

@@ -12,6 +12,7 @@ import {
   generateAttachmentsFiles,
   generateGlobals,
   generateSearchIndex,
+  getRunSummary,
 } from "../src/generators.js";
 
 beforeEach(async () => {
@@ -37,6 +38,35 @@ const getTestResultsStats = (trs: TestResult[], filter: (tr: TestResult) => bool
   );
 };
 
+describe("getRunSummary", () => {
+  it("should return undefined for empty result input", () => {
+    expect(getRunSummary([])).toBeUndefined();
+  });
+
+  it("should derive launch interval from valid result timings", () => {
+    expect(
+      getRunSummary([
+        { start: 1000, stop: 2000 },
+        { start: 500, stop: 2500 },
+        { start: 1500, stop: 1800 },
+      ]),
+    ).toEqual({
+      start: 500,
+      stop: 2500,
+      duration: 2000,
+    });
+  });
+
+  it("should ignore results without valid timing data", () => {
+    expect(
+      getRunSummary([
+        { start: undefined, stop: 2000 },
+        { start: 1000, stop: undefined },
+      ]),
+    ).toBeUndefined();
+  });
+});
+
 const mockTestResult = (id: string, name: string, status: TestResult["status"]): TestResult =>
   ({
     id,

packages/plugin-awesome/test/plugin.test.ts

@@ -696,9 +696,9 @@ describe("plugin", () => {
   });
 
   describe("report assets", () => {
-    const makeSingleFileStore = (testResults: TestResult[]): AllureStore =>
+    const makeSingleFileStore = (testResults: TestResult[], metadata: Record<string, unknown> = {}): AllureStore =>
       ({
-        metadataByKey: vi.fn().mockResolvedValue(undefined),
+        metadataByKey: vi.fn(async (key: string) => metadata[key]),
         allEnvironments: vi.fn().mockResolvedValue(["default"]),
         allEnvironmentIdentities: vi
           .fn()
@@ -759,6 +759,14 @@ describe("plugin", () => {
       return data;
     };
 
+    const extractReportOptions = (html: string) => {
+      const match = html.match(/window\.allureReportOptions = (\{.*?\})\s*<\/script>/s);
+
+      expect(match, "index.html must include report options").not.toBeNull();
+
+      return JSON.parse(match![1]);
+    };
+
     it("should copy every emitted multi-file asset", async () => {
       const addedFiles = new Map<string, Buffer>();
       const reportFiles: ReportFiles = {
@@ -866,5 +874,60 @@ describe("plugin", () => {
       // data test results file for the test must be present
       expect(Object.keys(embeddedData).some((k) => k.startsWith("data/test-results/"))).toBe(true);
     });
+
+    it("should include launch timing and allure2 executor metadata in report options", async () => {
+      const testResults: TestResult[] = [
+        {
+          id: "tr-1",
+          name: "passed test",
+          status: "passed",
+          environment: "default",
+          start: 1000,
+          stop: 2000,
+          labels: [],
+        },
+        {
+          id: "tr-retry",
+          name: "failed retry",
+          status: "failed",
+          environment: "default",
+          isRetry: true,
+          start: 500,
+          stop: 2500,
+          labels: [],
+        },
+      ] as TestResult[];
+      const executor = {
+        name: "TeamCity",
+        type: "teamcity",
+        buildName: "Wrike #123",
+        buildUrl: "https://teamcity.example/build/123",
+        reportUrl: "https://teamcity.example/report/123",
+      };
+      const addedFiles = new Map<string, Buffer>();
+      const reportFiles: ReportFiles = {
+        addFile: vi.fn(async (path: string, data: Buffer) => {
+          addedFiles.set(path, data);
+          return path;
+        }),
+      };
+      const plugin = new AwesomePlugin({ singleFile: true });
+
+      await plugin.start(makeSingleFileContext(reportFiles));
+      await plugin.done(
+        makeSingleFileContext(reportFiles),
+        makeSingleFileStore(testResults, { allure2_executor: executor }),
+      );
+
+      const indexHtml = addedFiles.get("index.html")?.toString("utf-8") ?? "";
+      const reportOptions = extractReportOptions(indexHtml);
+
+      expect(reportOptions.runSummary).toEqual({
+        start: 500,
+        stop: 2500,
+        duration: 2000,
+      });
+      expect(reportOptions.executor).toEqual(executor);
+    });
   });
 });

packages/web-awesome/src/components/Footer/FooterVersion.tsx

@@ -3,11 +3,13 @@ import { Text } from "@allurereport/web-components";
 import { useState } from "preact/hooks";
 import type { AwesomeReportOptions } from "types";
 
-import { currentLocaleIso } from "@/stores";
+import { useI18n } from "@/stores";
+import { timestampToDate } from "@/utils/time";
 
 import * as styles from "./styles.scss";
 
 export const FooterVersion = () => {
+  const { t } = useI18n("ui");
   const [createdAt] = useState(() => {
     const reportOptions = getReportOptions<AwesomeReportOptions>();
     if (reportOptions?.createdAt) {
@@ -27,18 +29,11 @@ export const FooterVersion = () => {
     return undefined;
   });
 
-  const formattedCreatedAt = new Date(createdAt as number).toLocaleDateString(currentLocaleIso.value as string, {
-    month: "numeric",
-    day: "numeric",
-    year: "numeric",
-    hour: "numeric",
-    minute: "numeric",
-    second: "numeric",
-  });
+  const formattedCreatedAt = timestampToDate(createdAt as number);
 
   return (
     <Text type="paragraph" size="m" className={styles.version}>
-      {formattedCreatedAt}
+      {t("generated")} {formattedCreatedAt}
       {currentVersion && <span> Ver: {currentVersion}</span>}
     </Text>
   );

packages/web-awesome/src/components/Footer/index.tsx

@@ -1,10 +1,13 @@
+import { LanguagePicker } from "@allurereport/web-components";
 import type { ClassValue } from "clsx";
 import { clsx } from "clsx";
 
 import { FooterLogo } from "@/components/Footer/FooterLogo";
 import { FooterVersion } from "@/components/Footer/FooterVersion";
+import { currentLocale, setLocale } from "@/stores/locale";
 
 import * as styles from "@/components/BaseLayout/styles.scss";
+import * as footerStyles from "@/components/Footer/styles.scss";
 
 interface FooterProps {
   className?: ClassValue;
@@ -13,7 +16,10 @@ export const Footer = ({ className }: FooterProps) => {
   return (
     <div className={clsx(styles.below, className)}>
       <FooterLogo />
-      <FooterVersion />
+      <div className={footerStyles["footer-controls"]}>
+        <LanguagePicker locale={currentLocale.value} setLocale={setLocale} />
+        <FooterVersion />
+      </div>
     </div>
   );
 };

packages/web-awesome/src/components/Footer/styles.scss

@@ -12,3 +12,9 @@
 .version {
   color: var(--color-text-muted);
 }
+
+.footer-controls {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}

packages/web-awesome/src/components/Header/CiInfo/index.tsx

@@ -13,7 +13,7 @@ interface CiInfoProps {
 }
 
 interface CiIconProps {
-  type: CiDescriptor["type"];
+  type?: CiDescriptor["type"];
 }
 
 export const CiIcon = ({ type }: CiIconProps) => {
@@ -47,35 +47,39 @@ export const CiIcon = ({ type }: CiIconProps) => {
 export const CiInfo = ({ className }: CiInfoProps) => {
   const { ci } = getReportOptions<AwesomeReportOptions>();
 
-  if (!ci) {
-    return null;
-  }
+  const ciLink = ci ? ci.pullRequestUrl || ci.jobRunUrl || ci.jobUrl : undefined;
+  const ciLabel = getCiLabel(ci, ciLink);
+  const safeLink = sanitizeExternalUrl(ciLink);
 
-  const link = ci.pullRequestUrl || ci.jobRunUrl || ci.jobUrl;
-  const safeLink = sanitizeExternalUrl(link);
-  const label = ci.pullRequestName || ci.jobRunName || ci.jobName || link;
-
-  if (!link) {
+  if (!ciLabel) {
     return null;
   }
 
   if (!safeLink) {
     return (
       <span className={clsx(styles["ci-info"], className)}>
-        <CiIcon type={ci.type} />
+        <CiIcon type={ci?.type} />
         <Text type="paragraph" size="m" bold>
-          {label}
+          {ciLabel}
         </Text>
       </span>
     );
   }
 
   return (
     <a className={clsx(styles["ci-info"], className)} href={safeLink} target="_blank" rel="noopener noreferrer">
-      <CiIcon type={ci.type} />
+      <CiIcon type={ci?.type} />
       <Text type="paragraph" size="m" bold>
-        {label}
+        {ciLabel}
       </Text>
     </a>
   );
 };
+
+const getCiLabel = (ci?: CiDescriptor, link?: string) => {
+  if (!ci) {
+    return undefined;
+  }
+
+  return ci.pullRequestName || ci.jobRunName || ci.jobName || link;
+};

packages/web-awesome/src/components/HeaderControls/index.tsx

@@ -1,10 +1,9 @@
 import { themeStore, toggleUserTheme } from "@allurereport/web-commons";
-import { LanguagePicker, ThemeButton } from "@allurereport/web-components";
+import { ThemeButton } from "@allurereport/web-components";
 import { computed } from "@preact/signals";
 
 import { EnvironmentPicker } from "@/components/EnvironmentPicker";
 import ToggleLayout from "@/components/ToggleLayout";
-import { currentLocale, setLocale } from "@/stores/locale";
 
 interface HeaderControlsProps {
   className?: string;
@@ -16,7 +15,6 @@ export const HeaderControls = ({ className }: HeaderControlsProps) => {
   return (
     <div className={className}>
       <EnvironmentPicker />
-      <LanguagePicker locale={currentLocale.value} setLocale={setLocale} />
       <ToggleLayout />
       <ThemeButton theme={selectedTheme.value} toggleTheme={toggleUserTheme} />
     </div>