cartesi/rollups-explorer | Build 9950359198 | apps/web/src/components/inputs/inputDetailsView.tsx | Coveralls

1

"use client";

1✔

2

import { InputDetails } from "@cartesi/rollups-explorer-ui";

1✔

3

import { Box } from "@mantine/core";

1✔

4

import { omit, pathOr } from "ramda";

1✔

5

import { FC, useEffect, useState } from "react";

1✔

6

import { useQuery } from "urql";

1✔

7

import { Address } from "viem";

1✔

8

import { InputItemFragment } from "../../graphql/explorer/operations";

1✔

9

import {

1✔

10

    InputDetailsDocument,

1✔

11

    InputDetailsQuery,

1✔

12

    InputDetailsQueryVariables,

1✔

13

} from "../../graphql/rollups/operations";

1✔

14

import { useConnectionConfig } from "../../providers/connectionConfig/hooks";

1✔

15

import { Voucher } from "../../graphql/rollups/types";

1✔

16

import VoucherExecution from "./voucherExecution";

1✔

17

1✔

18

interface ApplicationInputDataProps {

1✔

19

    input: InputItemFragment;

1✔

20

1✔

21

1✔

22

type InputTypes = "vouchers" | "reports" | "notices";

1✔

23

1✔

24

const payloadOrString = pathOr("", ["edges", 0, "node", "payload"]);

1✔

25

1✔

26

const updateForNextPage = (

1✔

27

    name: InputTypes,

3✔

28

    obj: InputDetailsQueryVariables,

3✔

29

) => {

3✔

30

    switch (name) {

3✔

31

        case "vouchers":

3✔

32

            return omit(["lastVouchers", "vouchersPrevPage"], obj);

1✔

33

        case "notices":

3✔

34

            return omit(["lastNotices", "noticesPrevPage"], obj);

1✔

35

        case "reports":

3✔

36

            return omit(["lastReports", "reportsPrevPage"], obj);

1✔

39

3✔

40

};

3✔

41

1✔

42

const updateForPrevPage = (

1✔

43

    name: InputTypes,

3✔

44

    obj: InputDetailsQueryVariables,

3✔

45

) => {

3✔

46

    switch (name) {

3✔

47

        case "vouchers":

3✔

48

            return omit(["firstVouchers", "vouchersNextPage"], obj);

1✔

49

        case "notices":

3✔

50

            return omit(["firstNotices", "noticesNextPage"], obj);

1✔

51

        case "reports":

3✔

52

            return omit(["firstReports", "reportsNextPage"], obj);

1✔

55

3✔

56

};

3✔

57

1✔

58

/**

1✔

59

 * InputDetailsView should be lazy rendered.

1✔

60

 * to avoid multiple eager network calls.

1✔

61

*/

1✔

62

const InputDetailsView: FC<ApplicationInputDataProps> = ({ input }) => {

1✔

63

    const { getConnection, hasConnection, showConnectionModal } =

21✔

64

        useConnectionConfig();

21✔

65

    const appId = input.application.id as Address;

21✔

66

    const inputIdx = input.index;

21✔

67

    const connection = getConnection(appId);

21✔

68

    const [variables, updateQueryVars] = useState<InputDetailsQueryVariables>({

21✔

69

        firstNotices: 1,

21✔

70

        firstReports: 1,

21✔

71

        firstVouchers: 1,

21✔

72

        inputIdx,

21✔

73

});

21✔

74

21✔

75

    const [result, execQuery] = useQuery<

21✔

76

        InputDetailsQuery,

21✔

77

        InputDetailsQueryVariables

21✔

78

>({

21✔

79

        query: InputDetailsDocument,

21✔

80

        pause: true,

21✔

81

        variables,

21✔

82

});

21✔

83

21✔

84

    const reports = result.data?.input.reports;

21✔

85

    const notices = result.data?.input.notices;

21✔

86

    const vouchers = result.data?.input.vouchers;

21✔

87

21✔

88

    const showNotices =

21✔

89

        !connection ||

21✔

90

        (connection && notices && payloadOrString(notices) !== "");

13✔

91

    const showReports =

21✔

92

        !connection ||

21✔

93

        (connection && reports && payloadOrString(reports) !== "");

13✔

94

    const showVouchers =

21✔

95

        !connection ||

21✔

96

        (connection && vouchers && payloadOrString(vouchers) !== "");

13✔

97

    const vouchersForExecution = (vouchers?.edges?.map((e) => e.node) ??

21✔

98

        []) as Partial<Voucher>[];

7✔

99

    const showVoucherForExecution =

21✔

100

        showVouchers && vouchersForExecution.length > 0;

21✔

101

21✔

102

    useEffect(() => {

21✔

103

        if (connection) execQuery({ url: connection.url });

20✔

104

    }, [connection, execQuery, variables]);

21✔

105

21✔

106

    return (

21✔

107

        <Box py="md">

21✔

108

            <InputDetails>

21✔

109

                <InputDetails.InputContent

21✔

110

                    content={input.payload}

21✔

111

                    contentType="raw"

21✔

112

/>

21✔

113

21✔

114

                {showReports && (

21✔

115

                    <InputDetails.ReportContent

20✔

116

                        content={payloadOrString(reports)}

20✔

117

                        contentType="raw"

20✔

118

                        onConnect={() => showConnectionModal(appId)}

20✔

119

                        isLoading={result.fetching}

20✔

120

                        isConnected={hasConnection(appId)}

20✔

121

                        paging={{

20✔

122

                            total: reports?.totalCount ?? 0,

20✔

123

                            onNextPage: () => {

20✔

124

                                updateQueryVars((vars) => {

1✔

125

                                    const newVars = {

1✔

126

                                        ...vars,

1✔

127

                                        firstReports: 1,

1✔

128

                                        reportsNextPage:

1✔

129

                                            reports?.pageInfo.endCursor,

1✔

130

};

1✔

131

1✔

132

                                    return updateForNextPage(

1✔

133

                                        "reports",

1✔

134

                                        newVars,

1✔

135

);

1✔

136

});

1✔

137

},

1✔

138

                            onPreviousPage: () => {

20✔

139

                                updateQueryVars((vars) => {

1✔

140

                                    const newVars = {

1✔

141

                                        ...vars,

1✔

142

                                        lastReports: 1,

1✔

143

                                        reportsPrevPage:

1✔

144

                                            reports?.pageInfo.startCursor,

1✔

145

};

1✔

146

                                    return updateForPrevPage(

1✔

147

                                        "reports",

1✔

148

                                        newVars,

1✔

149

);

1✔

150

});

1✔

151

},

1✔

152

}}

20✔

153

/>

20✔

154

)}

21✔

155

21✔

156

                {showNotices && (

21✔

157

                    <InputDetails.NoticeContent

17✔

158

                        content={payloadOrString(notices)}

17✔

159

                        contentType="raw"

17✔

160

                        onConnect={() => showConnectionModal(appId)}

17✔

161

                        isLoading={result.fetching}

17✔

162

                        isConnected={hasConnection(appId)}

17✔

163

                        paging={{

17✔

164

                            total: notices?.totalCount ?? 0,

17✔

165

                            onNextPage: () => {

17✔

166

                                updateQueryVars((vars) => {

1✔

167

                                    const newVars = {

1✔

168

                                        ...vars,

1✔

169

                                        firstNotices: 1,

1✔

170

                                        noticesNextPage:

1✔

171

                                            notices?.pageInfo.endCursor,

1✔

172

};

1✔

173

                                    return updateForNextPage(

1✔

174

                                        "notices",

1✔

175

                                        newVars,

1✔

176

);

1✔

177

});

1✔

178

},

1✔

179

                            onPreviousPage: () => {

17✔

180

                                updateQueryVars((vars) => {

1✔

181

                                    const newVars = {

1✔

182

                                        ...vars,

1✔

183

                                        lastNotices: 1,

1✔

184

                                        noticesPrevPage:

1✔

185

                                            notices?.pageInfo.startCursor,

1✔

186

};

1✔

187

1✔

188

                                    return updateForPrevPage(

1✔

189

                                        "notices",

1✔

190

                                        newVars,

1✔

191

);

1✔

192

});

1✔

193

},

1✔

194

}}

17✔

195

/>

17✔

196

)}

21✔

197

21✔

198

                {showVouchers && (

21✔

199

                    <InputDetails.VoucherContent

17✔

200

                        content={payloadOrString(vouchers)}

17✔

201

                        contentType="raw"

17✔

202

                        onConnect={() => showConnectionModal(appId)}

17✔

203

                        isLoading={result.fetching}

17✔

204

                        isConnected={hasConnection(appId)}

17✔

205

                        paging={{

17✔

206

                            total: vouchers?.totalCount ?? 0,

17✔

207

                            onNextPage: () => {

17✔

208

                                updateQueryVars((vars) => {

1✔

209

                                    const newVars = {

1✔

210

                                        ...vars,

1✔

211

                                        firstVouchers: 1,

1✔

212

                                        vouchersNextPage:

1✔

213

                                            vouchers?.pageInfo.endCursor,

1✔

214

};

1✔

215

1✔

216

                                    return updateForNextPage(

1✔

217

                                        "vouchers",

1✔

218

                                        newVars,

1✔

219

);

1✔

220

});

1✔

221

},

1✔

222

                            onPreviousPage: () => {

17✔

223

                                updateQueryVars((vars) => {

1✔

224

                                    const newVars = {

1✔

225

                                        ...vars,

1✔

226

                                        lastVouchers: 1,

1✔

227

                                        vouchersPrevPage:

1✔

228

                                            vouchers?.pageInfo.startCursor,

1✔

229

};

1✔

230

1✔

231

                                    return updateForPrevPage(

1✔

232

                                        "vouchers",

1✔

233

                                        newVars,

1✔

234

);

1✔

235

});

1✔

236

},

1✔

237

}}

17✔

238

17✔

239

                        {showVoucherForExecution ? (

17✔

240

                            <VoucherExecution

10✔

241

                                appId={appId}

10✔

242

                                voucher={vouchersForExecution[0]}

10✔

243

/>

10✔

244

                        ) : null}

7✔

245

                    </InputDetails.VoucherContent>

17✔

246

)}

21✔

247

            </InputDetails>

21✔

248

        </Box>

21✔

249

);

21✔

250

};

21✔

251

1✔

252

export default InputDetailsView;

1✔

cartesi / rollups-explorer / 9950359198

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

1	"use client";	1✔
2	import { InputDetails } from "@cartesi/rollups-explorer-ui";	1✔
3	import { Box } from "@mantine/core";	1✔
4	import { omit, pathOr } from "ramda";	1✔
5	import { FC, useEffect, useState } from "react";	1✔
6	import { useQuery } from "urql";	1✔
7	import { Address } from "viem";	1✔
8	import { InputItemFragment } from "../../graphql/explorer/operations";	1✔
9	import {	1✔
10	InputDetailsDocument,	1✔
11	InputDetailsQuery,	1✔
12	InputDetailsQueryVariables,	1✔
13	} from "../../graphql/rollups/operations";	1✔
14	import { useConnectionConfig } from "../../providers/connectionConfig/hooks";	1✔
15	import { Voucher } from "../../graphql/rollups/types";	1✔
16	import VoucherExecution from "./voucherExecution";	1✔
17		1✔
18	interface ApplicationInputDataProps {	1✔
19	input: InputItemFragment;	1✔
20	}	1✔
21		1✔
22	type InputTypes = "vouchers" \| "reports" \| "notices";	1✔
23		1✔
24	const payloadOrString = pathOr("", ["edges", 0, "node", "payload"]);	1✔
25		1✔
26	const updateForNextPage = (	1✔
27	name: InputTypes,	3✔
28	obj: InputDetailsQueryVariables,	3✔
29	) => {	3✔
30	switch (name) {	3✔
31	case "vouchers":	3✔
32	return omit(["lastVouchers", "vouchersPrevPage"], obj);	1✔
33	case "notices":	3✔
34	return omit(["lastNotices", "noticesPrevPage"], obj);	1✔
35	case "reports":	3✔
36	return omit(["lastReports", "reportsPrevPage"], obj);	1✔
37	default:	3!
UNCOV 38	throw new Error(`${name} not supported.`);	×
39	}	3✔
40	};	3✔
41		1✔
42	const updateForPrevPage = (	1✔
43	name: InputTypes,	3✔
44	obj: InputDetailsQueryVariables,	3✔
45	) => {	3✔
46	switch (name) {	3✔
47	case "vouchers":	3✔
48	return omit(["firstVouchers", "vouchersNextPage"], obj);	1✔
49	case "notices":	3✔
50	return omit(["firstNotices", "noticesNextPage"], obj);	1✔
51	case "reports":	3✔
52	return omit(["firstReports", "reportsNextPage"], obj);	1✔
53	default:	3!
UNCOV 54	throw new Error(`${name} not supported.`);	×
55	}	3✔
56	};	3✔
57		1✔
58	/**	1✔
59	* InputDetailsView should be lazy rendered.	1✔
60	* to avoid multiple eager network calls.	1✔
61	*/	1✔
62	const InputDetailsView: FC<ApplicationInputDataProps> = ({ input }) => {	1✔
63	const { getConnection, hasConnection, showConnectionModal } =	21✔
64	useConnectionConfig();	21✔
65	const appId = input.application.id as Address;	21✔
66	const inputIdx = input.index;	21✔
67	const connection = getConnection(appId);	21✔
68	const [variables, updateQueryVars] = useState<InputDetailsQueryVariables>({	21✔
69	firstNotices: 1,	21✔
70	firstReports: 1,	21✔
71	firstVouchers: 1,	21✔
72	inputIdx,	21✔
73	});	21✔
74		21✔
75	const [result, execQuery] = useQuery<	21✔
76	InputDetailsQuery,	21✔
77	InputDetailsQueryVariables	21✔
78	>({	21✔
79	query: InputDetailsDocument,	21✔
80	pause: true,	21✔
81	variables,	21✔
82	});	21✔
83		21✔
84	const reports = result.data?.input.reports;	21✔
85	const notices = result.data?.input.notices;	21✔
86	const vouchers = result.data?.input.vouchers;	21✔
87		21✔
88	const showNotices =	21✔
89	!connection \|\|	21✔
90	(connection && notices && payloadOrString(notices) !== "");	13✔
91	const showReports =	21✔
92	!connection \|\|	21✔
93	(connection && reports && payloadOrString(reports) !== "");	13✔
94	const showVouchers =	21✔
95	!connection \|\|	21✔
96	(connection && vouchers && payloadOrString(vouchers) !== "");	13✔
97	const vouchersForExecution = (vouchers?.edges?.map((e) => e.node) ??	21✔
98	[]) as Partial<Voucher>[];	7✔
99	const showVoucherForExecution =	21✔
100	showVouchers && vouchersForExecution.length > 0;	21✔
101		21✔
102	useEffect(() => {	21✔
103	if (connection) execQuery({ url: connection.url });	20✔
104	}, [connection, execQuery, variables]);	21✔
105		21✔
106	return (	21✔
107	<Box py="md">	21✔
108	<InputDetails>	21✔
109	<InputDetails.InputContent	21✔
110	content={input.payload}	21✔
111	contentType="raw"	21✔
112	/>	21✔
113		21✔
114	{showReports && (	21✔
115	<InputDetails.ReportContent	20✔
116	content={payloadOrString(reports)}	20✔
117	contentType="raw"	20✔
118	onConnect={() => showConnectionModal(appId)}	20✔
119	isLoading={result.fetching}	20✔
120	isConnected={hasConnection(appId)}	20✔
121	paging={{	20✔
122	total: reports?.totalCount ?? 0,	20✔
123	onNextPage: () => {	20✔
124	updateQueryVars((vars) => {	1✔
125	const newVars = {	1✔
126	...vars,	1✔
127	firstReports: 1,	1✔
128	reportsNextPage:	1✔
129	reports?.pageInfo.endCursor,	1✔
130	};	1✔
131		1✔
132	return updateForNextPage(	1✔
133	"reports",	1✔
134	newVars,	1✔
135	);	1✔
136	});	1✔
137	},	1✔
138	onPreviousPage: () => {	20✔
139	updateQueryVars((vars) => {	1✔
140	const newVars = {	1✔
141	...vars,	1✔
142	lastReports: 1,	1✔
143	reportsPrevPage:	1✔
144	reports?.pageInfo.startCursor,	1✔
145	};	1✔
146	return updateForPrevPage(	1✔
147	"reports",	1✔
148	newVars,	1✔
149	);	1✔
150	});	1✔
151	},	1✔
152	}}	20✔
153	/>	20✔
154	)}	21✔
155		21✔
156	{showNotices && (	21✔
157	<InputDetails.NoticeContent	17✔
158	content={payloadOrString(notices)}	17✔
159	contentType="raw"	17✔
160	onConnect={() => showConnectionModal(appId)}	17✔
161	isLoading={result.fetching}	17✔
162	isConnected={hasConnection(appId)}	17✔
163	paging={{	17✔
164	total: notices?.totalCount ?? 0,	17✔
165	onNextPage: () => {	17✔
166	updateQueryVars((vars) => {	1✔
167	const newVars = {	1✔
168	...vars,	1✔
169	firstNotices: 1,	1✔
170	noticesNextPage:	1✔
171	notices?.pageInfo.endCursor,	1✔
172	};	1✔
173	return updateForNextPage(	1✔
174	"notices",	1✔
175	newVars,	1✔
176	);	1✔
177	});	1✔
178	},	1✔
179	onPreviousPage: () => {	17✔
180	updateQueryVars((vars) => {	1✔
181	const newVars = {	1✔
182	...vars,	1✔
183	lastNotices: 1,	1✔
184	noticesPrevPage:	1✔
185	notices?.pageInfo.startCursor,	1✔
186	};	1✔
187		1✔
188	return updateForPrevPage(	1✔
189	"notices",	1✔
190	newVars,	1✔
191	);	1✔
192	});	1✔
193	},	1✔
194	}}	17✔
195	/>	17✔
196	)}	21✔
197		21✔
198	{showVouchers && (	21✔
199	<InputDetails.VoucherContent	17✔
200	content={payloadOrString(vouchers)}	17✔
201	contentType="raw"	17✔
202	onConnect={() => showConnectionModal(appId)}	17✔
203	isLoading={result.fetching}	17✔
204	isConnected={hasConnection(appId)}	17✔
205	paging={{	17✔
206	total: vouchers?.totalCount ?? 0,	17✔
207	onNextPage: () => {	17✔
208	updateQueryVars((vars) => {	1✔
209	const newVars = {	1✔
210	...vars,	1✔
211	firstVouchers: 1,	1✔
212	vouchersNextPage:	1✔
213	vouchers?.pageInfo.endCursor,	1✔
214	};	1✔
215		1✔
216	return updateForNextPage(	1✔
217	"vouchers",	1✔
218	newVars,	1✔
219	);	1✔
220	});	1✔
221	},	1✔
222	onPreviousPage: () => {	17✔
223	updateQueryVars((vars) => {	1✔
224	const newVars = {	1✔
225	...vars,	1✔
226	lastVouchers: 1,	1✔
227	vouchersPrevPage:	1✔
228	vouchers?.pageInfo.startCursor,	1✔
229	};	1✔
230		1✔
231	return updateForPrevPage(	1✔
232	"vouchers",	1✔
233	newVars,	1✔
234	);	1✔
235	});	1✔
236	},	1✔
237	}}	17✔
238	>	17✔
239	{showVoucherForExecution ? (	17✔
240	<VoucherExecution	10✔
241	appId={appId}	10✔
242	voucher={vouchersForExecution[0]}	10✔
243	/>	10✔
244	) : null}	7✔
245	</InputDetails.VoucherContent>	17✔
246	)}	21✔
247	</InputDetails>	21✔
248	</Box>	21✔
249	);	21✔
250	};	21✔
251		1✔
252	export default InputDetailsView;	1✔

cartesi / rollups-explorer / 9950359198

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