zudoku 0.42.2 → 0.43.1

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

@@ -7,6 +7,7 @@ import type { SchemaObject } from "../../../oas/parser/index.js";
 import { Button } from "../../../ui/Button.js";
 import { cn } from "../../../util/cn.js";
 import { objectEntries } from "../../../util/objectEntries.js";
+import { ConstValue } from "../components/ConstValue.js";
 import { EnumValues } from "../components/EnumValues.js";
 import { SelectOnClick } from "../components/SelectOnClick.js";
 import { ParamInfos } from "../ParamInfos.js";
@@ -68,7 +69,7 @@ export const SchemaPropertyItem = ({
     return (
       <li className="p-4 bg-border/20 hover:bg-border/30">
         <div className="flex flex-col gap-2.5 justify-between text-sm">
-          <div className="space-x-2">
+          <div className="space-x-2 rtl:space-x-reverse">
             <code>{name}</code>
             <ParamInfos
               schema={schema}
@@ -84,7 +85,7 @@ export const SchemaPropertyItem = ({
   return (
     <li className="p-4 bg-border/20 hover:bg-border/30">
       <div className="flex flex-col gap-2.5 justify-between text-sm">
-        <div className="space-x-2">
+        <div className="space-x-2 rtl:space-x-reverse">
           <SelectOnClick asChild>
             <code>{name}</code>
           </SelectOnClick>
@@ -109,11 +110,13 @@ export const SchemaPropertyItem = ({
         {schema.type === "array" && "items" in schema && schema.items.enum && (
           <EnumValues values={schema.items.enum} />
         )}
+        {schema.const && <ConstValue schema={schema} hideDescription />}
         {schema.enum && <EnumValues values={schema.enum} />}
         <SchemaExampleAndDefault schema={schema} />
         {(hasLogicalGroupings(schema) ||
           isComplexType(schema) ||
-          isArrayType(schema)) && (
+          isArrayType(schema) ||
+          schema.additionalProperties) && (
           <Collapsible.Root
             defaultOpen={defaultOpen}
             open={isOpen}

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

@@ -1,8 +1,10 @@
+import { InfoIcon } from "lucide-react";
 import { Markdown, ProseClasses } from "../../../components/Markdown.js";
 import type { SchemaObject } from "../../../oas/parser/index.js";
-import { Card, CardContent, CardHeader, CardTitle } from "../../../ui/Card.js";
+import { Card } from "../../../ui/Card.js";
 import { cn } from "../../../util/cn.js";
 import { groupBy } from "../../../util/groupBy.js";
+import { ConstValue } from "../components/ConstValue.js";
 import { EnumValues } from "../components/EnumValues.js";
 import { ParamInfos } from "../ParamInfos.js";
 import { SchemaExampleAndDefault } from "./SchemaExampleAndDefault.js";
@@ -48,6 +50,10 @@ export const SchemaView = ({
     );
   }
 
+  if (schema.const) {
+    return <ConstValue schema={schema} />;
+  }
+
   if (hasLogicalGroupings(schema)) {
     return <SchemaLogicalGroup schema={schema} />;
   }
@@ -57,7 +63,7 @@ export const SchemaView = ({
   }
 
   if (schema.type === "array" && typeof schema.items === "object") {
-    return <SchemaView schema={schema.items as SchemaObject} />;
+    return <SchemaView schema={schema.items} />;
   }
 
   if (schema.type === "object") {
@@ -73,6 +79,28 @@ export const SchemaView = ({
     );
     const groupNames = ["required", "optional", "deprecated"] as const;
 
+    const additionalProperties =
+      typeof schema.additionalProperties === "object" ? (
+        <SchemaView schema={schema.additionalProperties} />
+      ) : schema.additionalProperties === true ? (
+        <div
+          className={cn(
+            ProseClasses,
+            "text-sm p-4 bg-border/20 hover:bg-border/30 flex items-center gap-1",
+          )}
+        >
+          <span>Additional properties are allowed</span>
+          <a
+            className="p-0.5 -m-0.5"
+            href="https://swagger.io/docs/specification/v3_0/data-models/dictionaries/"
+            rel="noopener noreferrer"
+            target="_blank"
+          >
+            <InfoIcon size={14} />
+          </a>
+        </div>
+      ) : null;
+
     return (
       <Card className="divide-y overflow-hidden">
         {groupNames.map(
@@ -91,19 +119,7 @@ export const SchemaView = ({
               </ul>
             ),
         )}
-      </Card>
-    );
-  }
-
-  if (schema.additionalProperties) {
-    return (
-      <Card className="my-2">
-        <CardHeader>
-          <CardTitle>Additional Properties:</CardTitle>
-        </CardHeader>
-        <CardContent>
-          <SchemaView schema={schema.additionalProperties as SchemaObject} />
-        </CardContent>
+        {additionalProperties}
       </Card>
     );
   }

package/src/lib/plugins/openapi/util/generateSchemaExample.ts

@@ -24,6 +24,11 @@ export const generateSchemaExample = (
     }
   }
 
+  // No example needed for const values
+  if (schema.const !== undefined) {
+    return schema.const;
+  }
+
   // For object schemas with properties
   if (schema.type === "object" && schema.properties) {
     const example: Record<string, any> = {};
@@ -50,10 +55,50 @@ export const generateSchemaExample = (
     return [];
   }
 
+  if (schema.format !== undefined) {
+    // Partial implementation of JSON Schema format examples
+    // https://json-schema.org/draft/2020-12/draft-bhutton-json-schema-validation-00#rfc.section.7.3
+    switch (schema.format) {
+      case "date-time":
+        return "2024-08-25T15:00:00Z";
+      case "date":
+        return "2024-08-25";
+      case "time":
+        return "15:00:00";
+      case "email":
+        return "test@example.com";
+      case "uri":
+        return "https://www.example.com/path/to/resource";
+      case "uri-reference":
+        return "/path/to/resource";
+      case "uuid":
+        return "00000000-0000-0000-0000-000000000000";
+    }
+  }
+
   if (schema.enum) {
     return schema.enum[0];
   }
 
+  if (schema.oneOf) {
+    const randomIndex = Math.floor(Math.random() * schema.oneOf.length);
+    return generateSchemaExample(schema.oneOf[randomIndex] as SchemaObject);
+  }
+
+  if (schema.anyOf) {
+    // Should likely be expanded to return a partial set of values, but it would require
+    // detection if being used within an array or a string type.
+    const randomIndex = Math.floor(Math.random() * schema.anyOf.length);
+    return generateSchemaExample(schema.anyOf[randomIndex] as SchemaObject);
+  }
+
+  if (schema.allOf) {
+    // https://swagger.io/docs/specification/v3_0/data-models/oneof-anyof-allof-not/#allof
+    return schema.allOf.reduce((acc, allOfSchema) => {
+      return { ...acc, ...generateSchemaExample(allOfSchema as SchemaObject) };
+    }, {});
+  }
+
   switch (schema.type) {
     case "string":
       return name || "string";

package/src/lib/plugins/openapi/util/getRoutes.tsx

@@ -1,7 +1,21 @@
-import { redirect, type RouteObject } from "react-router";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import {
+  generatePath,
+  Navigate,
+  redirect,
+  type RouteObject,
+  useLocation,
+  useParams,
+} from "react-router";
 import { joinUrl } from "../../../util/joinUrl.js";
 import type { GraphQLClient } from "../client/GraphQLClient.js";
-import { type OpenApiPluginOptions, UNTAGGED_PATH } from "../index.js";
+import { useCreateQuery } from "../client/useCreateQuery.js";
+import { useOasConfig } from "../context.js";
+import {
+  GetSidebarOperationsQuery,
+  type OpenApiPluginOptions,
+  UNTAGGED_PATH,
+} from "../index.js";
 import type { OasPluginConfig } from "../interfaces.js";
 
 // Creates the main provider route that wraps operation routes.
@@ -47,6 +61,56 @@ const createRoute = ({
   },
 });
 
+const NonTagPagesOperationList = ({
+  render,
+  path,
+}: {
+  render: (tag: string) => React.ReactNode;
+  path: string;
+}) => {
+  const { type, input } = useOasConfig();
+  const { tag: currentTag } = useParams();
+  const location = useLocation();
+  const query = useCreateQuery(GetSidebarOperationsQuery, { type, input });
+  const {
+    data: { schema },
+  } = useSuspenseQuery(query);
+
+  const firstTag = schema.tags.at(0);
+
+  if (!currentTag && firstTag?.slug) {
+    return (
+      <Navigate
+        to={{
+          pathname: generatePath(path, { tag: firstTag.slug }),
+          search: location.search,
+        }}
+      />
+    );
+  }
+
+  if (currentTag && schema.tags.some((t) => t.slug === currentTag)) {
+    return render(currentTag);
+  }
+
+  return null;
+};
+
+const createNonTagPagesRoute = ({ path }: { path: string }): RouteObject => ({
+  path,
+  async lazy() {
+    const { OperationList } = await import("../OperationList.js");
+    return {
+      element: (
+        <NonTagPagesOperationList
+          path={path}
+          render={(tag) => <OperationList tag={tag} />}
+        />
+      ),
+    };
+  },
+});
+
 const createAdditionalRoutes = (basePath: string) => [
   // Category without tagged operations
   createRoute({
@@ -106,7 +170,7 @@ export const getRoutes = ({
         basePath,
         routePath: basePath,
         routes: [
-          createRoute({ path: basePath + "/:tag?" }),
+          createNonTagPagesRoute({ path: basePath + "/:tag?" }),
           ...createAdditionalRoutes(basePath),
         ],
         client,

package/src/lib/ui/SyntaxHighlight.tsx

@@ -108,7 +108,7 @@ const SyntaxHighlightInner = ({
         {children}
       </pre>
       {props.showLanguageIndicator && (
-        <span className="absolute top-1.5 right-3 text-[11px] font-mono text-muted-foreground transition group-hover:opacity-0">
+        <span className="absolute top-1.5 end-3 text-[11px] font-mono text-muted-foreground transition group-hover:opacity-0">
           {language}
         </span>
       )}
@@ -118,7 +118,7 @@ const SyntaxHighlightInner = ({
           aria-label="Copy code"
           title="Copy code"
           className={cn(
-            "absolute top-2 right-2 p-2  hover:outline hover:outline-border/75 dark:hover:outline-border rounded-md text-sm text-muted-foreground transition",
+            "absolute top-2 end-2 p-2  hover:outline hover:outline-border/75 dark:hover:outline-border rounded-md text-sm text-muted-foreground transition",
             showCopy === "hover"
               ? "opacity-0 group-hover:opacity-100 group-hover:bg-zinc-100 group-hover:dark:bg-zinc-700"
               : "bg-zinc-100 dark:bg-zinc-700",

package/src/lib/util/traverse.ts

@@ -4,9 +4,10 @@ export type { RecordAny };
 
 export const traverse = <T extends JsonValue = RecordAny>(
   specification: RecordAny,
-  transform: (specification: RecordAny) => T,
+  transform: (specification: RecordAny, path?: string[]) => T,
+  path: string[] = [],
 ) => {
-  const transformed = transform(specification);
+  const transformed = transform(specification, path);
   if (typeof transformed !== "object" || transformed === null) {
     return transformed;
   }
@@ -14,14 +15,16 @@ export const traverse = <T extends JsonValue = RecordAny>(
   const result: RecordAny = Array.isArray(transformed) ? [] : {};
 
   for (const [key, value] of Object.entries(transformed)) {
+    const currentPath = [...path, key];
+
     if (Array.isArray(value)) {
-      result[key] = value.map((item) =>
+      result[key] = value.map((item, index) =>
         typeof item === "object" && item != null
-          ? traverse(item, transform)
+          ? traverse(item, transform, [...currentPath, index.toString()])
           : item,
       );
     } else if (typeof value === "object" && value != null) {
-      result[key] = traverse(value, transform);
+      result[key] = traverse(value, transform, currentPath);
     } else {
       result[key] = value;
     }