diff --git a/frontend/src/app/Results/ResultsPageTestingFarm.tsx b/frontend/src/app/Results/ResultsPageTestingFarm.tsx
index aba4a228..cb53cec4 100644
--- a/frontend/src/app/Results/ResultsPageTestingFarm.tsx
+++ b/frontend/src/app/Results/ResultsPageTestingFarm.tsx
@@ -22,6 +22,7 @@ import {
DataListCell,
DataListToggle,
ClipboardCopy,
+ CardHeader,
} from "@patternfly/react-core";
import { ErrorConnection } from "../Errors/ErrorConnection";
@@ -45,6 +46,7 @@ import {
import { Preloader } from "../Preloader/Preloader";
import { ResultsPageCoprDetails } from "./ResultsPageCoprDetails";
import { SHACopy } from "../utils/SHACopy";
+import { TestingFarmPoC } from "./TestingFarmPoC";
export interface TestingFarmOverview {
pipeline_id: string; // UUID
@@ -218,6 +220,24 @@ const ResultsPageTestingFarm = () => {
+
+
+
+
+ Testing Farm proof of concept
+
+
+ {!data ? (
+
+ ) : (
+
+ )}
+
+
+
+
{!data ? (
diff --git a/frontend/src/app/Results/TestcaseLog.tsx b/frontend/src/app/Results/TestcaseLog.tsx
new file mode 100644
index 00000000..d1892f2c
--- /dev/null
+++ b/frontend/src/app/Results/TestcaseLog.tsx
@@ -0,0 +1,23 @@
+// Copyright Contributors to the Packit project.
+// SPDX-License-Identifier: MIT
+
+import { LogViewer } from "@patternfly/react-log-viewer";
+import { useQuery } from "@tanstack/react-query";
+import { fetchLog } from "./TestingFarmPoC";
+
+export const TestcaseLog: React.FC<{ testCase: Element }> = ({ testCase }) => {
+ const logs = Array.from(testCase.querySelectorAll("logs > log"));
+ const logToDisplay = logs
+ .find((log) => log.getAttribute("name")?.endsWith("testout.log"))
+ ?.getAttribute("href");
+
+ const { data, isInitialLoading } = useQuery([logToDisplay], () =>
+ logToDisplay ? fetchLog(logToDisplay) : "",
+ );
+
+ if (isInitialLoading) {
+ return ;
+ }
+
+ return ;
+};
diff --git a/frontend/src/app/Results/TestingFarmPoC.tsx b/frontend/src/app/Results/TestingFarmPoC.tsx
new file mode 100644
index 00000000..53e7780d
--- /dev/null
+++ b/frontend/src/app/Results/TestingFarmPoC.tsx
@@ -0,0 +1,127 @@
+// Copyright Contributors to the Packit project.
+// SPDX-License-Identifier: MIT
+
+import { Tab, TabTitleText, Tabs } from "@patternfly/react-core";
+import { LogViewer } from "@patternfly/react-log-viewer";
+import { useQuery } from "@tanstack/react-query";
+import { name } from "ejs";
+import { useMemo, useState } from "react";
+import { Preloader } from "../Preloader/Preloader";
+
+const fetchTestingFarm = (url: string): Promise =>
+ fetch(url).then((response) => {
+ if (!response.ok && response.status !== 404) {
+ throw Promise.reject(response);
+ }
+ return response.json();
+ });
+
+interface TestingFarmPoCProps {
+ url: string;
+}
+export const TestingFarmPoC: React.FC = ({ url }) => {
+ const { data, isError, isInitialLoading } = useQuery([url], () =>
+ fetchTestingFarm(url),
+ );
+ if (isInitialLoading) {
+ return <>Loading>;
+ }
+ const xunit = new DOMParser().parseFromString(data.result.xunit, "text/xml");
+ console.log(xunit);
+ console.log(xunit.getElementsByTagName("testsuites"));
+ const testsuitesDom = Array.from(xunit.getElementsByTagName("testsuites"));
+ const testsuiteDom = Array.from(
+ testsuitesDom[0].getElementsByTagName("testsuite"),
+ ); //.map(testSuite => <>test>)
+ console.log(testsuiteDom);
+ return (
+ <>
+ Overall status: {testsuitesDom[0].getAttribute("overall-result")}
+
+ >
+ );
+};
+
+const TestSuiteTabs: React.FC<{ testSuitesDom: Element[] }> = ({
+ testSuitesDom,
+}) => {
+ const [activeKey, setActiveKey] = useState(0); // Toggle currently active tab
+ const handleTabClick = (
+ event: React.MouseEvent | React.KeyboardEvent | MouseEvent,
+ tabIndex: string | number,
+ ) => {
+ setActiveKey(tabIndex);
+ };
+ const t = testSuitesDom.map((testSuite, i) => {
+ const testsuiteTabs = Array.from(
+ testSuite.getElementsByTagName("testsuite"),
+ ).map((testSuite, j) => testSuiteTab(j, testSuite));
+ return (
+
+ {testsuiteTabs}
+
+ );
+ });
+ return <>{t}>;
+};
+
+const testSuiteTab = (eventKey: string | number, testSuiteDom: Element) => {
+ const testcases = Array.from(testSuiteDom.getElementsByTagName("testcase"));
+ return (
+
+ {testSuiteDom.getAttribute("name")} -{" "}
+ {testSuiteDom.getAttribute("result")}
+
+ }
+ >
+
+ {testcases.map((testcase, i) => (
+
+ {testcase.getAttribute("name")} -{" "}
+ {testSuiteDom.getAttribute("result")}
+
+ }
+ >
+
+
+ ))}
+
+
+ );
+};
+
+const fetchLog = async (url: string): Promise => {
+ const response = await fetch(url);
+ if (!response.ok && response.status !== 404) {
+ throw Promise.reject(response);
+ }
+ return await response.text();
+};
+
+const TestcaseLog: React.FC<{ testCase: Element }> = ({ testCase }) => {
+ const logs = Array.from(testCase.querySelectorAll("logs > log"));
+ const logToDisplay = logs
+ .find((log) => log.getAttribute("name")?.endsWith("testout.log"))
+ ?.getAttribute("href");
+
+ console.log("logToDisplay", logToDisplay);
+ const { data, isInitialLoading } = useQuery({
+ queryKey: [logToDisplay],
+ queryFn: () => (logToDisplay ? fetchLog(logToDisplay) : ""),
+ enabled: !!logToDisplay,
+ });
+
+ if (isInitialLoading) {
+ return ;
+ }
+
+ return ;
+};