diff --git a/app/components/inline-stats-circle.tsx b/app/components/inline-stats-circle.tsx new file mode 100644 index 0000000..f524e51 --- /dev/null +++ b/app/components/inline-stats-circle.tsx @@ -0,0 +1,34 @@ +'use client'; + +import { FC } from 'react'; +import { CircularProgress } from '@heroui/react'; + +import { type ReportStats } from '@/app/lib/parser/types'; + +type ReportFiltersProps = { + stats: ReportStats; +}; + +const InlineStatsCircle: FC = ({ stats }) => { + if (!stats.total) return null; + + const passedPercentage = (stats.expected / (stats.total - stats.skipped)) * 100; + + return ( + + ); +}; + +export default InlineStatsCircle; diff --git a/app/components/report-details/file-list.tsx b/app/components/report-details/file-list.tsx index 91631b4..74f0c03 100644 --- a/app/components/report-details/file-list.tsx +++ b/app/components/report-details/file-list.tsx @@ -1,11 +1,12 @@ 'use client'; import { FC, useEffect, useState } from 'react'; -import { Accordion, AccordionItem, Spinner } from '@heroui/react'; +import { Accordion, AccordionItem, Alert, Spinner } from '@heroui/react'; import { toast } from 'sonner'; import { subtitle } from '../primitives'; import { StatChart } from '../stat-chart'; +import InlineStatsCircle from '../inline-stats-circle'; import FileSuitesTree from './suite-tree'; import ReportFilters from './tests-filters'; @@ -49,13 +50,14 @@ const FileList: FC = ({ report }) => { {!filteredTests?.files?.length ? ( -

No files found

+ ) : ( - + {(filteredTests?.files ?? []).map((file) => ( } title={

{file.fileName} diff --git a/app/components/reports-table.tsx b/app/components/reports-table.tsx index 5b8d5f3..36f01f7 100644 --- a/app/components/reports-table.tsx +++ b/app/components/reports-table.tsx @@ -21,6 +21,7 @@ import { toast } from 'sonner'; import { withBase } from '../lib/url'; import TablePaginationOptions from './table-pagination-options'; +import InlineStatsCircle from './inline-stats-circle'; import { withQueryParams } from '@/app/lib/network'; import { defaultProjectName } from '@/app/lib/constants'; @@ -33,6 +34,7 @@ import { ReadReportsHistory, ReportHistory } from '@/app/lib/storage'; const columns = [ { name: 'Title', uid: 'title' }, { name: 'Project', uid: 'project' }, + { name: 'Pass Rate', uid: 'passRate' }, { name: 'Created at', uid: 'createdAt' }, { name: 'Size', uid: 'size' }, { name: '', uid: 'actions' }, @@ -45,6 +47,7 @@ const coreFields = [ 'createdAt', 'size', 'sizeBytes', + 'options', 'reportUrl', 'metadata', 'startTime', @@ -53,6 +56,7 @@ const coreFields = [ 'projectNames', 'stats', 'errors', + 'playwrightVersion', ]; const getMetadataItems = (item: ReportHistory) => { @@ -74,6 +78,12 @@ const getMetadataItems = (item: ReportHistory) => { metadata.push({ key: 'branch', value: itemWithMetadata.branch, icon: }); } + if (itemWithMetadata.playwrightVersion) { + metadata.push({ key: 'playwright', value: itemWithMetadata.playwrightVersion }); + } + + metadata.push({ key: 'workers', value: itemWithMetadata.metadata?.actualWorkers }); + // Add any other metadata fields Object.entries(itemWithMetadata).forEach(([key, value]) => { if (!coreFields.includes(key) && !['environment', 'workingDir', 'branch'].includes(key)) { @@ -195,7 +205,7 @@ export default function ReportsTable({ onChange }: Readonly) > {(item) => ( - +

{/* Main title and link */} @@ -224,12 +234,13 @@ export default function ReportsTable({ onChange }: Readonly)
- {item.project} - + {item.project} + {} + - {item.size} - + {item.size} +