diff options
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/RequestList/RequestList.tsx | 6 | ||||
| -rw-r--r-- | src/components/RequestSummary/RequestSummary.tsx | 15 |
2 files changed, 18 insertions, 3 deletions
diff --git a/src/components/RequestList/RequestList.tsx b/src/components/RequestList/RequestList.tsx index 06a78a3..acef47a 100644 --- a/src/components/RequestList/RequestList.tsx +++ b/src/components/RequestList/RequestList.tsx | |||
| @@ -106,8 +106,7 @@ export default function RequestList({ | |||
| 106 | ) | 106 | ) |
| 107 | .filter( | 107 | .filter( |
| 108 | ([index, request]) => | 108 | ([index, request]) => |
| 109 | search === "" || | 109 | search === "" || searchRegex.test(request.request.path) |
| 110 | searchRegex.test(`${request.request.method} ${request.request.path}`) | ||
| 111 | ); | 110 | ); |
| 112 | }, [requests, search, enabledMethods, enableRegex]); | 111 | }, [requests, search, enabledMethods, enableRegex]); |
| 113 | 112 | ||
| @@ -168,6 +167,7 @@ export default function RequestList({ | |||
| 168 | <RequestSummary | 167 | <RequestSummary |
| 169 | requestResponse={requestResponse} | 168 | requestResponse={requestResponse} |
| 170 | selected={selected} | 169 | selected={selected} |
| 170 | showTime | ||
| 171 | /> | 171 | /> |
| 172 | </ListGroup.Item> | 172 | </ListGroup.Item> |
| 173 | ); | 173 | ); |
| @@ -205,7 +205,7 @@ export default function RequestList({ | |||
| 205 | onChange={() => setEnableRegex(!enableRegex)} | 205 | onChange={() => setEnableRegex(!enableRegex)} |
| 206 | /> | 206 | /> |
| 207 | </Form.Group> | 207 | </Form.Group> |
| 208 | <Form.Group> | 208 | <Form.Group className="mb-4"> |
| 209 | <Form.Label className="fw-bold">Method</Form.Label> | 209 | <Form.Label className="fw-bold">Method</Form.Label> |
| 210 | {Object.entries(methods).map(([method, enabled]) => ( | 210 | {Object.entries(methods).map(([method, enabled]) => ( |
| 211 | <Form.Check | 211 | <Form.Check |
diff --git a/src/components/RequestSummary/RequestSummary.tsx b/src/components/RequestSummary/RequestSummary.tsx index 44254d0..49e6086 100644 --- a/src/components/RequestSummary/RequestSummary.tsx +++ b/src/components/RequestSummary/RequestSummary.tsx | |||
| @@ -3,10 +3,12 @@ import * as React from "react"; | |||
| 3 | import classNames from "classnames"; | 3 | import classNames from "classnames"; |
| 4 | 4 | ||
| 5 | import { Badge, Col, Row } from "react-bootstrap"; | 5 | import { Badge, Col, Row } from "react-bootstrap"; |
| 6 | import dayjs from "dayjs"; | ||
| 6 | 7 | ||
| 7 | interface RequestSummaryProps { | 8 | interface RequestSummaryProps { |
| 8 | selected?: boolean; | 9 | selected?: boolean; |
| 9 | requestResponse: RequestResponse; | 10 | requestResponse: RequestResponse; |
| 11 | showTime?: boolean; | ||
| 10 | } | 12 | } |
| 11 | 13 | ||
| 12 | function isBetween(value: number, min: number, max: number) { | 14 | function isBetween(value: number, min: number, max: number) { |
| @@ -32,9 +34,22 @@ function calcBadgeVariant(statusCode: number | undefined): string { | |||
| 32 | export default function RequestSummary({ | 34 | export default function RequestSummary({ |
| 33 | requestResponse: { request, response }, | 35 | requestResponse: { request, response }, |
| 34 | selected = false, | 36 | selected = false, |
| 37 | showTime = false, | ||
| 35 | }: RequestSummaryProps) { | 38 | }: RequestSummaryProps) { |
| 36 | return ( | 39 | return ( |
| 37 | <Row> | 40 | <Row> |
| 41 | {showTime && ( | ||
| 42 | <Col | ||
| 43 | className={classNames( | ||
| 44 | "flex-grow-0 d-flex align-items-center text-nowrap", | ||
| 45 | { | ||
| 46 | "text-muted": !selected, | ||
| 47 | } | ||
| 48 | )} | ||
| 49 | > | ||
| 50 | {dayjs(request.timestamp).format("LTS")} | ||
| 51 | </Col> | ||
| 52 | )} | ||
| 38 | <Col className="flex-grow-0 d-flex align-items-center"> | 53 | <Col className="flex-grow-0 d-flex align-items-center"> |
| 39 | {request.method} | 54 | {request.method} |
| 40 | </Col> | 55 | </Col> |
