zudoku 0.4.1 → 0.4.2-dev.0

package/src/lib/plugins/openapi/playground/Playground.tsx

@@ -11,9 +11,9 @@ import {
 } from "../../../components/Select.js";
 import { Spinner } from "../../../components/Spinner.js";
 import { Button } from "../../../ui/Button.js";
-import { Card } from "../../../ui/Card.js";
+import { Callout } from "../../../ui/Callout.js";
+import { Card, CardContent, CardHeader, CardTitle } from "../../../ui/Card.js";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "../../../ui/Tabs.js";
-import { fetchTimeout } from "../../../util/fetchTimeout.js";
 import { ColorizedParam } from "../ColorizedParam.js";
 import { createUrl } from "./createUrl.js";
 import { Headers } from "./Headers.js";
@@ -23,23 +23,6 @@ import { ResponseTab } from "./ResponseTab.js";
 
 export const NO_IDENTITY = "__none";
 
-function mimeTypeToLanguage(mimeType: string) {
-  const mimeTypeMapping = {
-    "application/json": "json",
-    "text/json": "json",
-    "text/html": "html",
-    "text/css": "css",
-    "text/javascript": "javascript",
-    "application/xml": "xml",
-    "application/xhtml+xml": "xhtml",
-    "text/plain": "plain",
-  } as const;
-
-  return Object.entries(mimeTypeMapping).find(([mime]) =>
-    mimeType.includes(mime),
-  )?.[1];
-}
-
 const statusCodeMap: Record<number, string> = {
   200: "OK",
   201: "Created",
@@ -148,18 +131,31 @@ export const Playground = ({
           ?.find((i) => i.id === data.identity)
           ?.authorizeRequest(request);
       }
-      const response = await fetchTimeout(request);
-      const time = performance.now() - start;
+      try {
+        const response = await fetch(request, {
+          signal: AbortSignal.timeout(5000),
+        });
+
+        const time = performance.now() - start;
 
-      const body = await response.text();
+        const body = await response.text();
 
-      return {
-        status: response.status,
-        headers: response.headers,
-        size: body.length,
-        body,
-        time,
-      };
+        return {
+          status: response.status,
+          headers: response.headers,
+          size: body.length,
+          body,
+          time,
+        };
+      } catch (error) {
+        if (error instanceof TypeError) {
+          throw new Error(
+            "The request failed, possibly due to network issues or CORS policy.",
+          );
+        } else {
+          throw error;
+        }
+      }
     },
   });
 
@@ -298,11 +294,24 @@ export const Playground = ({
           </div>
           <div className="flex flex-col gap-4 p-8 bg-muted/70">
             {queryMutation.error ? (
-              <div>
-                Error:{" "}
-                {queryMutation.error.message ||
-                  String(queryMutation.error) ||
-                  "Unexpected error"}
+              <div className="flex flex-col gap-2">
+                {formState.pathParams.some((p) => p.value === "") && (
+                  <Callout type="caution">
+                    Some path parameters are missing values. Please fill them in
+                    to ensure the request is sent correctly.
+                  </Callout>
+                )}
+                <Card>
+                  <CardHeader>
+                    <CardTitle>Request failed</CardTitle>
+                  </CardHeader>
+                  <CardContent>
+                    Error:{" "}
+                    {queryMutation.error.message ||
+                      String(queryMutation.error) ||
+                      "Unexpected error"}
+                  </CardContent>
+                </Card>
               </div>
             ) : queryMutation.data ? (
               <div className="flex flex-col gap-2">

package/src/lib/plugins/openapi/playground/ResponseTab.tsx

@@ -55,7 +55,7 @@ export const ResponseTab = ({
           }
           noBackground
           showLanguageIndicator
-          className="overflow-x-auto p-4 text-xs"
+          className="overflow-x-auto p-4 text-xs max-h-[480px]"
           code={view === "raw" ? body : beautifiedBody}
         />
       </Card>

package/src/lib/plugins/openapi/schema/SchemaView.tsx

@@ -26,7 +26,7 @@ export const SchemaView = ({
   }
 
   const renderSchema = (schema: SchemaObject, level: number) => {
-    if (schema.oneOf || schema.allOf || schema.anyOf) {
+    if (hasLogicalGroupings(schema)) {
       return <SchemaLogicalGroup schema={schema} level={level} />;
     }
 
@@ -55,10 +55,7 @@ export const SchemaView = ({
             )}
           </Card>
         );
-      } else if (
-        itemsSchema.type === "object" ||
-        hasLogicalGroupings(itemsSchema)
-      ) {
+      } else if (itemsSchema.type === "object") {
         return (
           <Card className="flex flex-col gap-2 bg-border/30 p-4">
             <span className="text-sm text-muted-foreground">object[]</span>
@@ -100,9 +97,6 @@ export const SchemaView = ({
         },
       );
 
-      const isTopLevelSingleItem =
-        level === 0 && Object.keys(groupedProperties).length === 1;
-
       const groupNames = ["required", "optional", "deprecated"] as const;
 
       return (
@@ -118,8 +112,7 @@ export const SchemaView = ({
                       schema={schema}
                       group={group}
                       level={level}
-                      defaultOpen={isTopLevelSingleItem || defaultOpen}
-                      showCollapseButton={!isTopLevelSingleItem}
+                      defaultOpen={defaultOpen}
                     />
                   ))}
                 </ul>

package/src/lib/ui/Callout.tsx

@@ -74,7 +74,7 @@ export const Callout = ({ type, children, title, className }: CalloutProps) => {
       )}
     >
       <Icon
-        className={cn(!title && "mt-1 translate-y-px", iconColor)}
+        className={cn(!title && "translate-y-px", iconColor)}
         size={20}
         aria-hidden="true"
       />

package/dist/lib/util/fetchTimeout.d.ts

@@ -1 +0,0 @@
-export declare const fetchTimeout: (input: RequestInfo, init?: RequestInit, timeout?: number) => Promise<Response>;

package/dist/lib/util/fetchTimeout.js

@@ -1,14 +0,0 @@
-export const fetchTimeout = async (input, init, timeout = 5000) => {
-    const controller = new AbortController();
-    const signal = controller.signal;
-    const fetchPromise = fetch(input, { ...init, signal });
-    const timeoutPromise = new Promise((_, reject) => {
-        const timer = setTimeout(() => {
-            controller.abort("Request timed out");
-            reject(new Error("Request timed out"));
-        }, timeout);
-        void fetchPromise.finally(() => clearTimeout(timer));
-    });
-    return Promise.race([fetchPromise, timeoutPromise]);
-};
-//# sourceMappingURL=fetchTimeout.js.map

package/dist/lib/util/fetchTimeout.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"fetchTimeout.js","sourceRoot":"","sources":["../../../src/lib/util/fetchTimeout.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,EAC/B,KAAkB,EAClB,IAAkB,EAClB,OAAO,GAAG,IAAI,EACK,EAAE;IACrB,MAAM,UAAU,GAAG,IAAI,eAAe,EAAE,CAAC;IACzC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAEjC,MAAM,YAAY,GAAG,KAAK,CAAC,KAAK,EAAE,EAAE,GAAG,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC;IAEvD,MAAM,cAAc,GAAG,IAAI,OAAO,CAAW,CAAC,CAAC,EAAE,MAAM,EAAE,EAAE;QACzD,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE;YAC5B,UAAU,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC;YACtC,MAAM,CAAC,IAAI,KAAK,CAAC,mBAAmB,CAAC,CAAC,CAAC;QACzC,CAAC,EAAE,OAAO,CAAC,CAAC;QAEZ,KAAK,YAAY,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC;IACvD,CAAC,CAAC,CAAC;IAEH,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC,YAAY,EAAE,cAAc,CAAC,CAAC,CAAC;AACtD,CAAC,CAAC"}