summaryrefslogtreecommitdiffstats
path: root/src/components/RequestSummary
diff options
context:
space:
mode:
authorGravatar Tom van der Lee <tom@vanderlee.io>2022-02-12 11:33:52 +0100
committerGravatar Tom van der Lee <tom@vanderlee.io>2022-02-12 11:33:52 +0100
commit871a85d9343cf49646d13dc455c062efadcb959a (patch)
tree7d36b14b237719901d71d58c88f74b87b875ee61 /src/components/RequestSummary
parent7c48533571e9f9d3731a59433a56cc8d6e008123 (diff)
downloadclient-871a85d9343cf49646d13dc455c062efadcb959a.tar.gz
client-871a85d9343cf49646d13dc455c062efadcb959a.tar.bz2
client-871a85d9343cf49646d13dc455c062efadcb959a.zip
Beatified codev1.3.0
Diffstat (limited to 'src/components/RequestSummary')
-rw-r--r--src/components/RequestSummary/RequestSummary.tsx41
1 files changed, 23 insertions, 18 deletions
diff --git a/src/components/RequestSummary/RequestSummary.tsx b/src/components/RequestSummary/RequestSummary.tsx
index b3e7ddc..db2f69c 100644
--- a/src/components/RequestSummary/RequestSummary.tsx
+++ b/src/components/RequestSummary/RequestSummary.tsx
@@ -1,49 +1,54 @@
1import {RequestResponse} from "~hooks/useRequests"; 1import { RequestResponse } from "~hooks/useRequests";
2import * as React from "react"; 2import * as React from "react";
3import classNames from "classnames"; 3import classNames from "classnames";
4 4
5import {Badge, Card, Col, Row} from "react-bootstrap"; 5import { Badge, Card, Col, Row } from "react-bootstrap";
6 6
7interface RequestSummaryProps { 7interface RequestSummaryProps {
8 selected?: boolean 8 selected?: boolean;
9 requestResponse: RequestResponse 9 requestResponse: RequestResponse;
10} 10}
11 11
12function isBetween(value: number, min: number, max: number) { 12function isBetween(value: number, min: number, max: number) {
13 return value >= min && value <= max 13 return value >= min && value <= max;
14} 14}
15 15
16function calcBadgeVariant(statusCode: number | undefined): string { 16function calcBadgeVariant(statusCode: number | undefined): string {
17 if (statusCode === undefined) { 17 if (statusCode === undefined) {
18 return 'secondary'; 18 return "secondary";
19 } else if (isBetween(statusCode, 100, 199)) { 19 } else if (isBetween(statusCode, 100, 199)) {
20 return 'info'; 20 return "info";
21 } else if (isBetween(statusCode, 200, 299)) { 21 } else if (isBetween(statusCode, 200, 299)) {
22 return 'success'; 22 return "success";
23 } else if (isBetween(statusCode, 300, 399)) { 23 } else if (isBetween(statusCode, 300, 399)) {
24 return 'primary'; 24 return "primary";
25 } else if (isBetween(statusCode, 400, 499)) { 25 } else if (isBetween(statusCode, 400, 499)) {
26 return 'danger'; 26 return "danger";
27 } else if (isBetween(statusCode, 500, 599)) { 27 } else if (isBetween(statusCode, 500, 599)) {
28 return 'warning'; 28 return "warning";
29 } 29 }
30} 30}
31 31
32export default function RequestSummary({ requestResponse: { request, response }, selected = false }: RequestSummaryProps) { 32export default function RequestSummary({
33 requestResponse: { request, response },
34 selected = false,
35}: RequestSummaryProps) {
33 return ( 36 return (
34 <Row> 37 <Row>
35 <Col className='flex-grow-0 d-flex align-items-center'>{request.method}</Col> 38 <Col className="flex-grow-0 d-flex align-items-center">
36 <Col className='flex-grow-1'>{ request.path }</Col> 39 {request.method}
37 <Col className='flex-grow-0 d-flex align-items-center'> 40 </Col>
41 <Col className="flex-grow-1">{request.path}</Col>
42 <Col className="flex-grow-0 d-flex align-items-center">
38 <Badge 43 <Badge
39 className={classNames({ 44 className={classNames({
40 'border': selected, 45 border: selected,
41 })} 46 })}
42 bg={calcBadgeVariant(response?.status)} 47 bg={calcBadgeVariant(response?.status)}
43 > 48 >
44 { response?.status ?? 'Loading...'} 49 {response?.status ?? "Loading..."}
45 </Badge> 50 </Badge>
46 </Col> 51 </Col>
47 </Row> 52 </Row>
48 ) 53 );
49} 54}