Fix web view height

src-tauri/src/main.rs

@@ -101,6 +101,7 @@ async fn actually_send_ephemeral_request(
 
     let client = reqwest::Client::builder()
         .redirect(Policy::none())
+        // .danger_accept_invalid_certs(true)
         .build()
         .expect("Failed to build client");
 

src-web/components/ImageView.tsx

@@ -0,0 +1,8 @@
+interface Props {
+  data: string;
+}
+
+export function ImageView({ data }: Props) {
+  // const dataUri = `data:image/png;base64,${window.btoa(data)}`;
+  return <div>Image preview not supported until binary response support is added</div>;
+}

src-web/components/ResponsePane.tsx

@@ -21,6 +21,7 @@ import { StatusColor } from './core/StatusColor';
 import { TabContent, Tabs } from './core/Tabs/Tabs';
 import { Webview } from './core/Webview';
 import { EmptyStateText } from './EmptyStateText';
+import { ImageView } from './ImageView';
 import { ResponseHeaders } from './ResponseHeaders';
 
 interface Props {
@@ -91,15 +92,15 @@ export const ResponsePane = memo(function ResponsePane({ style, className }: Pro
             )}
           >
             {activeResponse && (
-              <>
-                <div className="whitespace-nowrap p-3 py-2">
+              <HStack alignItems="center" className="w-full">
+                <div className="whitespace-nowrap px-3">
                   <StatusColor statusCode={activeResponse.status}>
                     {activeResponse.status}
                     {activeResponse.statusReason && ` ${activeResponse.statusReason}`}
                   </StatusColor>
                   &nbsp;&bull;&nbsp;
                   {activeResponse.elapsed}ms &nbsp;&bull;&nbsp;
-                  {Math.round(activeResponse.body.length / 1000)} KB
+                  {(activeResponse.body.length / 1000).toFixed(1)} KB
                 </div>
 
                 <Dropdown
@@ -136,7 +137,7 @@ export const ResponsePane = memo(function ResponsePane({ style, className }: Pro
                     iconSize="md"
                   />
                 </Dropdown>
-              </>
+              </HStack>
             )}
           </HStack>
 
@@ -150,6 +151,9 @@ export const ResponsePane = memo(function ResponsePane({ style, className }: Pro
               className="px-3"
               tabs={tabs}
             >
+              <TabContent value="headers">
+                <ResponseHeaders headers={activeResponse?.headers ?? []} />
+              </TabContent>
               <TabContent value="body">
                 {!activeResponse.body ? (
                   <EmptyStateText>No Response</EmptyStateText>
@@ -167,6 +171,8 @@ export const ResponsePane = memo(function ResponsePane({ style, className }: Pro
                     defaultValue={tryFormatJson(activeResponse?.body)}
                     contentType={contentType}
                   />
+                ) : contentType.startsWith('image') ? (
+                  <ImageView data={activeResponse?.body} />
                 ) : activeResponse?.body ? (
                   <Editor
                     readOnly
@@ -177,9 +183,6 @@ export const ResponsePane = memo(function ResponsePane({ style, className }: Pro
                   />
                 ) : null}
               </TabContent>
-              <TabContent value="headers">
-                <ResponseHeaders headers={activeResponse?.headers ?? []} />
-              </TabContent>
             </Tabs>
           )}
         </>

src-web/components/RouteError.tsx

@@ -15,9 +15,14 @@ export default function RouteError() {
         <pre className="text-sm select-auto cursor-text bg-gray-100 p-3 rounded whitespace-normal">
           {message}
         </pre>
-        <Button to="/" color="primary">
-          Go Home
-        </Button>
+        <VStack space={2}>
+          <Button to="/" color="primary">
+            Go Home
+          </Button>
+          <Button color="secondary" onClick={() => window.location.reload()}>
+            Refresh
+          </Button>
+        </VStack>
       </VStack>
     </div>
   );

src-web/components/core/Webview.tsx

@@ -16,12 +16,12 @@ export function Webview({ body, url, contentType }: Props) {
   }, [url, body, contentType]);
 
   return (
-    <div className="px-2 pb-2">
+    <div className="h-full pb-3">
       <iframe
         title="Response preview"
         srcDoc={contentForIframe}
         sandbox="allow-scripts allow-same-origin"
-        className="h-full w-full rounded-md border border-gray-100/20"
+        className="h-full w-full rounded border border-highlightSecondary"
       />
     </div>
   );