From bcb77d979d817e1e609adb4d007bbbcc3f61efbd Mon Sep 17 00:00:00 2001
From: Tom van der Lee <tom@vanderlee.io>
Date: Thu, 30 Dec 2021 09:51:00 +0100
Subject: Prepare for github

---
 src/components/RequestSummary/RequestSummary.tsx | 33 ++++++++++++++++++++++++
 1 file changed, 33 insertions(+)
 create mode 100644 src/components/RequestSummary/RequestSummary.tsx

(limited to 'src/components/RequestSummary/RequestSummary.tsx')

diff --git a/src/components/RequestSummary/RequestSummary.tsx b/src/components/RequestSummary/RequestSummary.tsx
new file mode 100644
index 0000000..af928c0
--- /dev/null
+++ b/src/components/RequestSummary/RequestSummary.tsx
@@ -0,0 +1,33 @@
+import {RequestResponse} from "~hooks/useRequests";
+import * as React from "react";
+import classNames from "classnames";
+
+import styles from './RequestSummary.module.scss';
+
+interface RequestSummaryProps {
+  requestResponse: RequestResponse
+  className?: string
+}
+
+function isBetween(value: number, min: number, max: number) {
+  return value >= min && value <= max
+}
+
+export default function RequestSummary({ requestResponse: { request, response }, className = ''}: RequestSummaryProps) {
+  const statusCode = response?.status ?? 0
+  return (
+    <div className={classNames(styles.requestSummary, className)}>
+      <span className={styles.method}>{ request.method }</span>
+      <p>{ request.path }</p>
+      <span className={classNames(styles.statusCode, {
+        [styles.info]: isBetween(statusCode, 100, 199),
+        [styles.success]: isBetween(statusCode, 200, 299),
+        [styles.redirect]: isBetween(statusCode, 300, 399),
+        [styles.clientError]: isBetween(statusCode, 400, 499),
+        [styles.serverError]: isBetween(statusCode, 500, 599)
+      })}>
+        { response?.status ?? 'Loading...'}
+      </span>
+    </div>
+  )
+}
-- 
cgit v1.2.3