summaryrefslogtreecommitdiffstats
path: root/src/components/Content
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/Content')
-rw-r--r--src/components/Content/Content.tsx19
1 files changed, 11 insertions, 8 deletions
diff --git a/src/components/Content/Content.tsx b/src/components/Content/Content.tsx
index e670376..94fca32 100644
--- a/src/components/Content/Content.tsx
+++ b/src/components/Content/Content.tsx
@@ -4,7 +4,7 @@ import { Headers, RequestPayload, ResponsePayload } from "~hooks/useRequests";
4import ReactJson from "react-json-view"; 4import ReactJson from "react-json-view";
5import styles from "~/components/Content/Content.module.scss"; 5import styles from "~/components/Content/Content.module.scss";
6import { Button, Col, Container, Row } from "react-bootstrap"; 6import { Button, Col, Container, Row } from "react-bootstrap";
7import { DarkModeContext } from "~/contexts/DarkMode"; 7import { SettingsContext } from "~/contexts/Settings";
8 8
9function getHeader( 9function getHeader(
10 headers: Headers, 10 headers: Headers,
@@ -80,14 +80,14 @@ export default function Content({
80} 80}
81 81
82function ContentBody({ data, raw = false }: Omit<ContentProps, "setRaw">) { 82function ContentBody({ data, raw = false }: Omit<ContentProps, "setRaw">) {
83 const { darkMode } = useContext(DarkModeContext); 83 const { darkMode } = useContext(SettingsContext);
84 const contentType = useMemo(() => { 84 const contentType = useMemo(() => {
85 if (raw) { 85 if (raw) {
86 return ""; 86 return "";
87 } 87 }
88 88
89 const type = getHeader(data.headers, "content-type"); 89 const type = getHeader(data.headers, "content-type");
90 return type.toLowerCase().split(";")[0]; 90 return type?.toLowerCase().split(";")[0];
91 }, [data, raw]); 91 }, [data, raw]);
92 92
93 if (raw) { 93 if (raw) {
@@ -98,7 +98,10 @@ function ContentBody({ data, raw = false }: Omit<ContentProps, "setRaw">) {
98 ); 98 );
99 } 99 }
100 100
101 if (["application/pdf", "text/html"].includes(contentType)) { 101 if (
102 contentType !== undefined &&
103 ["application/pdf", "text/html"].includes(contentType)
104 ) {
102 return ( 105 return (
103 <iframe 106 <iframe
104 className="bg-white" 107 className="bg-white"
@@ -110,7 +113,7 @@ function ContentBody({ data, raw = false }: Omit<ContentProps, "setRaw">) {
110 ); 113 );
111 } 114 }
112 115
113 if (contentType.startsWith("application/json")) { 116 if (contentType?.startsWith("application/json")) {
114 return ( 117 return (
115 <ReactJson 118 <ReactJson
116 src={JSON.parse(atob(data.body))} 119 src={JSON.parse(atob(data.body))}
@@ -125,15 +128,15 @@ function ContentBody({ data, raw = false }: Omit<ContentProps, "setRaw">) {
125 ); 128 );
126 } 129 }
127 130
128 if (contentType.startsWith("audio")) { 131 if (contentType?.startsWith("audio")) {
129 return <audio src={`data:${contentType};base64,${data.body}`} />; 132 return <audio src={`data:${contentType};base64,${data.body}`} />;
130 } 133 }
131 134
132 if (contentType.startsWith("video")) { 135 if (contentType?.startsWith("video")) {
133 return <video src={`data:${contentType};base64,${data.body}`} />; 136 return <video src={`data:${contentType};base64,${data.body}`} />;
134 } 137 }
135 138
136 if (contentType.startsWith("image")) { 139 if (contentType?.startsWith("image")) {
137 return <img src={`data:${contentType};base64,${data.body}`} alt="" />; 140 return <img src={`data:${contentType};base64,${data.body}`} alt="" />;
138 } 141 }
139 142