9808024042

Committed 05 Jul 2024 12:06PM CUT coverage: 94.266% (+0.06%) from 94.209%

Build # 9808024042

Build Type

Pull #198

github

Committed by

nevendyulgerov

Commit Message

fixup! fix(workflows): Disable job continuation on error

Pull Request Pull Request #198: #186 Add input completion status

Run Details

808 of 946 branches covered (85.41%)

Branch coverage included in aggregate %.

95 of 95 new or added lines in 3 files covered. (100.0%)

8908 of 9361 relevant lines covered (95.16%)

53.8 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

74.29

/apps/web/src/components/applications/applicationsTable.tsx

"use client";

import {
    Loader,
    Table,
    Text,
    Transition,
    useMantineColorScheme,
    useMantineTheme,
} from "@mantine/core";
import { FC, useRef } from "react";
import { ApplicationItemFragment } from "../../graphql/explorer/operations";
import { Application } from "../../graphql/explorer/types";
import ApplicationRow from "./applicationRow";
import { useElementVisibility } from "../../hooks/useElementVisibility";
import TableResponsiveWrapper from "../tableResponsiveWrapper";

export interface ApplicationsTableProps {
    applications: ApplicationItemFragment[];
    fetching: boolean;
    totalCount: number;
}

const ApplicationsTable: FC<ApplicationsTableProps> = (props) => {
    const { applications, fetching, totalCount } = props;
    const tableRowRef = useRef<HTMLDivElement>(null);
    const theme = useMantineTheme();
    const { colorScheme } = useMantineColorScheme();
    const bgColor = colorScheme === "dark" ? theme.colors.dark[7] : theme.white;
    const { childrenRef, isVisible } = useElementVisibility({
        element: tableRowRef,
    });

    return (
        <TableResponsiveWrapper ref={tableRowRef}>
            <Table
                width={"100%"}
                style={{ borderCollapse: "collapse" }}
                data-testid="applications-table"
            >
                <Table.Thead>
                    <Table.Tr>
                        <Table.Th>Id</Table.Th>
                        <Table.Th>Owner</Table.Th>
                        <Table.Th>URL</Table.Th>
                        <Table.Th ref={childrenRef}>Data</Table.Th>
                        <Transition
                            mounted={isVisible}
                            transition="scale-x"
                            duration={500}
                            timingFunction="ease-out"
                        >
                            {(styles) => (
                                <th
                                    style={{
                                        ...styles,
                                        position: "sticky",
                                        top: 0,
                                        right: 0,
                                        backgroundColor: bgColor,
                                        padding:
                                            "var(--table-vertical-spacing) var(--table-horizontal-spacing, var(--mantine-spacing-lg))",
                                    }}
                                >
                                    Data
                                </th>
                            )}
                        </Transition>
                    </Table.Tr>
                </Table.Thead>
                <Table.Tbody>
                    {fetching ? (
                        <Table.Tr>
                            <Table.Td align="center" colSpan={4}>
                                <Loader data-testid="applications-spinner" />
                            </Table.Td>
                        </Table.Tr>
                    ) : (
                        totalCount === 0 && (
                            <Table.Tr>
                                <Table.Td colSpan={4} align="center">
                                    <Text fw={700}>No applications</Text>
                                </Table.Td>
                            </Table.Tr>
                        )
                    )}
                    {applications.map((application) => (
                        <ApplicationRow
                            key={application.id}
                            application={
                                application as Omit<Application, "inputs">
                            }
                            keepDataColVisible={!isVisible}
                        />
                    ))}
                </Table.Tbody>
            </Table>
        </TableResponsiveWrapper>
    );
};

export default ApplicationsTable;

1	"use client";	1✔
2		1✔
3	import {	1✔
4	Loader,	1✔
5	Table,	1✔
6	Text,	1✔
7	Transition,	1✔
8	useMantineColorScheme,	1✔
9	useMantineTheme,	1✔
10	} from "@mantine/core";	1✔
11	import { FC, useRef } from "react";	1✔
12	import { ApplicationItemFragment } from "../../graphql/explorer/operations";	1✔
13	import { Application } from "../../graphql/explorer/types";	1✔
14	import ApplicationRow from "./applicationRow";	1✔
15	import { useElementVisibility } from "../../hooks/useElementVisibility";	1✔
16	import TableResponsiveWrapper from "../tableResponsiveWrapper";	1✔
17		1✔
18	export interface ApplicationsTableProps {	1✔
19	applications: ApplicationItemFragment[];	1✔
20	fetching: boolean;	1✔
21	totalCount: number;	1✔
22	}	1✔
23		1✔
24	const ApplicationsTable: FC<ApplicationsTableProps> = (props) => {	1✔
25	const { applications, fetching, totalCount } = props;	5✔
26	const tableRowRef = useRef<HTMLDivElement>(null);	5✔
27	const theme = useMantineTheme();	5✔
28	const { colorScheme } = useMantineColorScheme();	5✔
29	const bgColor = colorScheme === "dark" ? theme.colors.dark[7] : theme.white;	5!
30	const { childrenRef, isVisible } = useElementVisibility({	5✔
31	element: tableRowRef,	5✔
32	});	5✔
33		5✔
34	return (	5✔
35	<TableResponsiveWrapper ref={tableRowRef}>	5✔
36	<Table	5✔
37	width={"100%"}	5✔
38	style={{ borderCollapse: "collapse" }}	5✔
39	data-testid="applications-table"	5✔
40	>	5✔
41	<Table.Thead>	5✔
42	<Table.Tr>	5✔
43	<Table.Th>Id</Table.Th>	5✔
44	<Table.Th>Owner</Table.Th>	5✔
45	<Table.Th>URL</Table.Th>	5✔
46	<Table.Th ref={childrenRef}>Data</Table.Th>	5✔
47	<Transition	5✔
48	mounted={isVisible}	5✔
49	transition="scale-x"	5✔
50	duration={500}	5✔
51	timingFunction="ease-out"	5✔
52	>	5✔
53	{(styles) => (	5✔
54	<th	×
55	style={{	×
56	...styles,	×
57	position: "sticky",	×
58	top: 0,	×
59	right: 0,	×
60	backgroundColor: bgColor,	×
61	padding:	×
62	"var(--table-vertical-spacing) var(--table-horizontal-spacing, var(--mantine-spacing-lg))",	×
63	}}	×
64	>	×
65	Data	×
66	</th>	×
67	)}	5✔
68	</Transition>	5✔
69	</Table.Tr>	5✔
70	</Table.Thead>	5✔
71	<Table.Tbody>	5✔
72	{fetching ? (	5!
73	<Table.Tr>	×
74	<Table.Td align="center" colSpan={4}>	×
75	<Loader data-testid="applications-spinner" />	×
76	</Table.Td>	×
77	</Table.Tr>	×
78	) : (	5✔
79	totalCount === 0 && (	5✔
80	<Table.Tr>	5✔
81	<Table.Td colSpan={4} align="center">	5✔
82	<Text fw={700}>No applications</Text>	5✔
83	</Table.Td>	5✔
84	</Table.Tr>	5✔
85	)	5✔
86	)}	5✔
87	{applications.map((application) => (	5✔
88	<ApplicationRow	×
89	key={application.id}	×
90	application={	×
91	application as Omit<Application, "inputs">	×
92	}	×
93	keepDataColVisible={!isVisible}	×
94	/>	×
95	))}	5✔
96	</Table.Tbody>	5✔
97	</Table>	5✔
98	</TableResponsiveWrapper>	5✔
99	);	5✔
100	};	5✔
101		1✔
102	export default ApplicationsTable;	1✔

cartesi / rollups-explorer / 9808024042

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous