zudoku 0.0.0-f417aae → 0.0.0-f46233e4

package/src/lib/plugins/openapi/processors/removePaths.ts

@@ -0,0 +1,57 @@
+import type { ProcessorArg } from "../../../../config/validators/BuildSchema.js";
+import type { OpenAPIDocument } from "../../../oas/parser/index.js";
+import { type RecordAny, traverse } from "./traverse.js";
+
+interface RemovePathsOptions {
+  // Path definitions, e.g., { '/path': true, '/path-2': ['get'] }
+  paths?: Record<string, true | string[]>;
+  shouldRemove?: (options: {
+    path: string;
+    method: true | string;
+    operation: RecordAny;
+  }) => boolean;
+}
+
+export const removePaths =
+  ({ paths = {}, shouldRemove }: RemovePathsOptions) =>
+  ({ schema }: ProcessorArg) =>
+    traverse(schema, (spec) => {
+      if (!spec.paths) return spec;
+
+      const updatedPaths: RecordAny = {};
+
+      for (const [path, methods] of Object.entries(spec.paths)) {
+        const operations = spec.paths[path];
+
+        // If the path is explicitly marked for removal in `paths`
+        if (paths[path] === true) continue;
+
+        // If the path should be removed via `shouldRemove`
+        if (shouldRemove?.({ path, method: true, operation: operations }))
+          continue;
+
+        if (typeof methods === "object" && methods !== null) {
+          const filteredPath = Object.fromEntries(
+            Object.entries(methods).filter(([method]) => {
+              const operations = spec.paths[path][method];
+              const isMethodToRemove =
+                Array.isArray(paths[path]) && paths[path].includes(method);
+
+              const isMethodFiltered = shouldRemove?.({
+                path,
+                method,
+                operation: operations,
+              });
+
+              return !isMethodToRemove && !isMethodFiltered;
+            }),
+          );
+
+          updatedPaths[path] = filteredPath;
+        } else {
+          updatedPaths[path] = methods;
+        }
+      }
+
+      return { ...spec, paths: updatedPaths };
+    }) as OpenAPIDocument;

package/src/lib/plugins/openapi/processors/traverse.ts

@@ -0,0 +1 @@
+export { type RecordAny, traverse } from "../../../util/traverse.js";

package/src/lib/plugins/openapi/schema/AllOfGroup/AllOfGroupConnector.tsx

@@ -0,0 +1,36 @@
+import { ChevronDownIcon, CircleFadingPlusIcon } from "lucide-react";
+import { cn } from "../../../../util/cn.js";
+
+export const AllOfGroupConnector = ({
+  isOpen,
+  className,
+  schemeName,
+}: {
+  isOpen: boolean;
+  className?: string;
+  schemeName?: string;
+}) => {
+  return (
+    <div
+      className={cn(
+        "text-green-500 dark:text-green-300/60",
+        "relative text-sm flex py-2",
+        "before:border-l before:absolute before:-top-2 before:-bottom-2 before:border-border before:border-dashed before:content-['']",
+        className,
+      )}
+    >
+      <div className="-translate-x-[7px] flex gap-1 items-center">
+        <CircleFadingPlusIcon size={16} className="fill-card" />
+        <div
+          className={cn(
+            "translate-y-px mx-px opacity-0 group-hover:opacity-100 transition",
+            !isOpen && "-rotate-90",
+          )}
+        >
+          <ChevronDownIcon size={16} />
+        </div>
+        <span className="text-sm text-foreground">{schemeName}</span>
+      </div>
+    </div>
+  );
+};

package/src/lib/plugins/openapi/schema/AllOfGroup/AllOfGroupItem.tsx

@@ -0,0 +1,25 @@
+import * as Collapsible from "@radix-ui/react-collapsible";
+import { useState } from "react";
+import type { SchemaObject } from "../../../../oas/parser/index.js";
+import { SchemaView } from "../SchemaView.js";
+import { AllOfGroupConnector } from "./AllOfGroupConnector.js";
+
+export const AllOfGroupItem = (props: { schema: SchemaObject }) => {
+  const [isOpen, setIsOpen] = useState(true);
+
+  return (
+    <Collapsible.Root
+      open={isOpen}
+      onOpenChange={() => setIsOpen((prev) => !prev)}
+      className="group"
+    >
+      <Collapsible.Trigger>
+        <AllOfGroupConnector isOpen={isOpen} schemeName={props.schema.title} />
+      </Collapsible.Trigger>
+      {!isOpen && <div className="wavy-line bg-border translate-y-1" />}
+      <Collapsible.Content>
+        <SchemaView schema={props.schema} />
+      </Collapsible.Content>
+    </Collapsible.Root>
+  );
+};

package/src/lib/plugins/openapi/schema/AllOfGroup/AllOfGroupView.tsx

@@ -0,0 +1,42 @@
+import * as Collapsible from "@radix-ui/react-collapsible";
+import { SquareMinusIcon, SquarePlusIcon } from "lucide-react";
+import { useCallback, useState } from "react";
+import type { SchemaObject } from "../../../../oas/parser/index.js";
+import { Card } from "../../../../ui/Card.js";
+import { AllOfGroupItem } from "./AllOfGroupItem.js";
+
+export const AllOfGroupView = ({
+  schema,
+  cardHeader,
+}: {
+  schema: SchemaObject;
+  cardHeader?: React.ReactNode;
+}) => {
+  const [isOpen, setIsOpen] = useState(true);
+  const toggleOpen = useCallback(() => setIsOpen((prev) => !prev), []);
+
+  if (!schema.allOf) return null;
+
+  return (
+    <Collapsible.Root open={isOpen} onOpenChange={toggleOpen} asChild>
+      <Card className="overflow-hidden">
+        {cardHeader}
+        <Collapsible.Trigger className="flex gap-2 items-center py-2 px-6 w-full text-sm text-muted-foreground -translate-x-1.5">
+          {isOpen ? (
+            <SquareMinusIcon size={14} />
+          ) : (
+            <SquarePlusIcon size={14} />
+          )}
+          <span>All of</span>
+        </Collapsible.Trigger>
+
+        <Collapsible.Content className="pb-4 px-6">
+          {schema.allOf.map((subSchema, index) => (
+            // biome-ignore lint/suspicious/noArrayIndexKey: Index needed for key
+            <AllOfGroupItem key={index} schema={subSchema} />
+          ))}
+        </Collapsible.Content>
+      </Card>
+    </Collapsible.Root>
+  );
+};

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

@@ -0,0 +1,39 @@
+import type { SchemaObject } from "../../../oas/parser/index.js";
+import { SelectOnClick } from "../components/SelectOnClick.js";
+
+export const SchemaExampleAndDefault = ({
+  schema,
+}: {
+  schema: SchemaObject;
+}) => {
+  const example = schema.examples?.at(0);
+  const defaultValue = schema.default;
+
+  if (example === undefined && defaultValue === undefined) return null;
+
+  return (
+    <div className="flex flex-col gap-1 text-xs">
+      {example !== undefined && (
+        <div>
+          <span className="text-muted-foreground">Example: </span>
+          <SelectOnClick className="border rounded-sm px-1 font-mono">
+            {typeof example === "object" || typeof example === "boolean"
+              ? JSON.stringify(example)
+              : example}
+          </SelectOnClick>
+        </div>
+      )}
+      {defaultValue !== undefined && (
+        <div>
+          <span className="text-muted-foreground">Default: </span>
+          <SelectOnClick className="border rounded-sm px-1 font-mono">
+            {typeof defaultValue === "object" ||
+            typeof defaultValue === "boolean"
+              ? JSON.stringify(defaultValue)
+              : defaultValue}
+          </SelectOnClick>
+        </div>
+      )}
+    </div>
+  );
+};

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

@@ -0,0 +1,141 @@
+import * as Collapsible from "@radix-ui/react-collapsible";
+import { MinusIcon, PlusIcon, RefreshCcwDotIcon } from "lucide-react";
+import { useState } from "react";
+import { InlineCode } from "../../../components/InlineCode.js";
+import { Markdown } from "../../../components/Markdown.js";
+import type { SchemaObject } from "../../../oas/parser/index.js";
+import { Button } from "../../../ui/Button.js";
+import { ConstValue } from "../components/ConstValue.js";
+import { EnumValues } from "../components/EnumValues.js";
+import { SelectOnClick } from "../components/SelectOnClick.js";
+import { ParamInfos } from "../ParamInfos.js";
+import { AllOfGroupView } from "./AllOfGroup/AllOfGroupView.js";
+import { SchemaExampleAndDefault } from "./SchemaExampleAndDefault.js";
+import { SchemaView } from "./SchemaView.js";
+import {
+  extractCircularRefInfo,
+  isArrayCircularRef,
+  isArrayType,
+  isCircularRef,
+  isComplexType,
+} from "./utils.js";
+
+const RecursiveIndicator = ({ circularProp }: { circularProp?: string }) => (
+  <InlineCode
+    className="inline-flex items-center gap-1.5 italic text-xs translate-y-0.5"
+    selectOnClick={false}
+  >
+    <RefreshCcwDotIcon size={13} />
+    <span>{circularProp ? `${circularProp} (circular)` : "circular"}</span>
+  </InlineCode>
+);
+
+export const SchemaPropertyItem = ({
+  name,
+  schema,
+  group,
+  defaultOpen = false,
+  showCollapseButton = true,
+}: {
+  name: string;
+  schema: SchemaObject;
+  group: "required" | "optional" | "deprecated";
+  defaultOpen?: boolean;
+  showCollapseButton?: boolean;
+}) => {
+  const [isOpen, setIsOpen] = useState(defaultOpen);
+
+  if (isCircularRef(schema)) {
+    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 rtl:space-x-reverse">
+            <code>{name}</code>
+            <ParamInfos
+              schema={schema}
+              extraItems={[<RecursiveIndicator key="circular-ref" />]}
+            />
+          </div>
+          <SchemaExampleAndDefault schema={schema} />
+        </div>
+      </li>
+    );
+  }
+
+  const isCollapsible = Boolean(
+    (schema.allOf ||
+      schema.anyOf ||
+      schema.oneOf ||
+      isComplexType(schema) ||
+      (isArrayType(schema) &&
+        "items" in schema &&
+        isComplexType(schema.items)) ||
+      schema.additionalProperties) &&
+      !isArrayCircularRef(schema),
+  );
+
+  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 rtl:space-x-reverse">
+          <SelectOnClick asChild>
+            <code>{name}</code>
+          </SelectOnClick>
+          <ParamInfos
+            schema={schema}
+            extraItems={[
+              group !== "optional" && (
+                <span className="text-primary">required</span>
+              ),
+              isArrayCircularRef(schema) && (
+                <RecursiveIndicator
+                  circularProp={extractCircularRefInfo(schema.items)}
+                />
+              ),
+            ]}
+          />
+        </div>
+        {schema.description && (
+          <Markdown
+            className="text-sm leading-normal"
+            content={schema.description}
+          />
+        )}
+        {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} />
+
+        {isCollapsible && (
+          <Collapsible.Root
+            defaultOpen={defaultOpen}
+            open={isOpen}
+            onOpenChange={() => setIsOpen(!isOpen)}
+          >
+            {showCollapseButton && (
+              <Collapsible.Trigger asChild>
+                <Button variant="expand" size="sm">
+                  {isOpen ? <MinusIcon size={12} /> : <PlusIcon size={12} />}
+                  {!isOpen ? "Show properties" : "Hide properties"}
+                </Button>
+              </Collapsible.Trigger>
+            )}
+            <Collapsible.Content>
+              <div className="mt-2">
+                {schema.allOf ? (
+                  <AllOfGroupView schema={schema} />
+                ) : schema.anyOf || schema.oneOf || schema.type === "object" ? (
+                  <SchemaView schema={schema} />
+                ) : isArrayType(schema) && "items" in schema ? (
+                  <SchemaView schema={schema.items} />
+                ) : null}
+              </div>
+            </Collapsible.Content>
+          </Collapsible.Root>
+        )}
+      </div>
+    </li>
+  );
+};

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

@@ -1,165 +1,139 @@
-import { Markdown, ProseClasses } from "../../../components/Markdown.js";
+import { InfoIcon } from "lucide-react";
+import { Markdown } from "../../../components/Markdown.js";
 import type { SchemaObject } from "../../../oas/parser/index.js";
-import { Card, CardContent, CardHeader, CardTitle } from "../../../ui/Card.js";
-import { cn } from "../../../util/cn.js";
+import { Card } from "../../../ui/Card.js";
 import { groupBy } from "../../../util/groupBy.js";
-import { SchemaLogicalGroup, SchemaPropertyItem } from "./SchemaComponents.js";
-import { hasLogicalGroupings } from "./utils.js";
+import { ConstValue } from "../components/ConstValue.js";
+import { EnumValues } from "../components/EnumValues.js";
+import { ParamInfos } from "../ParamInfos.js";
+import { AllOfGroupView } from "./AllOfGroup/AllOfGroupView.js";
+import { SchemaExampleAndDefault } from "./SchemaExampleAndDefault.js";
+import { SchemaPropertyItem } from "./SchemaPropertyItem.js";
+import { UnionView } from "./UnionView.js";
+import { isBasicType } from "./utils.js";
+
+const renderMarkdown = (content?: string) =>
+  content && (
+    <Markdown
+      className="text-sm leading-normal line-clamp-4"
+      content={content}
+    />
+  );
+
+const renderBasicSchema = (
+  schema: SchemaObject,
+  cardHeader?: React.ReactNode,
+) => (
+  <Card className="overflow-hidden">
+    {cardHeader}
+    <div className="p-4 space-y-2">
+      <span className="text-sm text-muted-foreground">
+        <ParamInfos schema={schema} />
+      </span>
+      {schema.enum && <EnumValues values={schema.enum} />}
+      {renderMarkdown(schema.description)}
+      <SchemaExampleAndDefault schema={schema} />
+    </div>
+  </Card>
+);
 
 export const SchemaView = ({
   schema,
-  level = 0,
   defaultOpen = false,
+  cardHeader,
+  embedded,
 }: {
   schema?: SchemaObject | null;
-  level?: number;
   defaultOpen?: boolean;
+  cardHeader?: React.ReactNode;
+  embedded?: boolean;
 }) => {
   if (!schema || Object.keys(schema).length === 0) {
     return (
-      <Card className="p-4">
-        <span className="text-sm text-muted-foreground italic">
-          No response specified
-        </span>
+      <Card className="overflow-hidden">
+        {cardHeader}
+        <div className="text-sm text-muted-foreground italic p-4">
+          No data returned
+        </div>
       </Card>
     );
   }
 
-  const renderSchema = (schema: SchemaObject, level: number) => {
-    if (hasLogicalGroupings(schema)) {
-      return <SchemaLogicalGroup schema={schema} level={level} />;
-    }
-
-    // Sometimes items is not defined
-    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-    if (schema.type === "array" && schema.items) {
-      const itemsSchema = schema.items as SchemaObject;
+  if (schema.const) {
+    return <ConstValue schema={schema} />;
+  }
 
-      if (
-        typeof itemsSchema.type === "string" &&
-        ["string", "number", "boolean", "integer"].includes(itemsSchema.type)
-      ) {
-        return (
-          <Card className="p-4">
-            <span className="text-sm text-muted-foreground">
-              {itemsSchema.type}[]
-            </span>
-            {schema.description && (
-              <Markdown
-                className={cn(
-                  ProseClasses,
-                  "text-sm leading-normal line-clamp-4",
-                )}
-                content={schema.description}
-              />
-            )}
-          </Card>
-        );
-      } 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>
-            {renderSchema(itemsSchema, level + 1)}
-          </Card>
-        );
-      } else {
-        return renderSchema(itemsSchema, level + 1);
-      }
-    }
+  if (Array.isArray(schema.oneOf) || Array.isArray(schema.anyOf)) {
+    return <UnionView schema={schema} cardHeader={cardHeader} />;
+  }
 
-    if (schema.type === "object" && !schema.properties) {
-      return (
-        <Card className="p-4 flex gap-2 items-center">
-          {"name" in schema && <>{schema.name}</>}
-          <span className="text-sm text-muted-foreground">object</span>
-          {schema.description && (
-            <Markdown
-              className={cn(
-                ProseClasses,
-                "text-sm leading-normal line-clamp-4",
-              )}
-              content={schema.description}
-            />
-          )}
-        </Card>
-      );
-    }
+  if (Array.isArray(schema.allOf)) {
+    return <AllOfGroupView schema={schema} cardHeader={cardHeader} />;
+  }
 
-    if (schema.properties) {
-      const groupedProperties = groupBy(
-        Object.entries(schema.properties),
-        ([propertyName, property]) => {
-          return property.deprecated
-            ? "deprecated"
-            : schema.required?.includes(propertyName)
-              ? "required"
-              : "optional";
-        },
-      );
+  if (isBasicType(schema.type)) {
+    return renderBasicSchema(schema, cardHeader);
+  }
 
-      const groupNames = ["required", "optional", "deprecated"] as const;
+  if (schema.type === "array" && typeof schema.items === "object") {
+    return <SchemaView schema={schema.items} cardHeader={cardHeader} />;
+  }
 
-      return (
-        <Card className="divide-y overflow-hidden">
-          {groupNames.map(
-            (group) =>
-              groupedProperties[group] && (
-                <ul key={group} className="divide-y">
-                  {groupedProperties[group].map(([name, schema]) => (
-                    <SchemaPropertyItem
-                      key={name}
-                      name={name}
-                      schema={schema}
-                      group={group}
-                      level={level}
-                      defaultOpen={defaultOpen}
-                    />
-                  ))}
-                </ul>
-              ),
-          )}
-        </Card>
-      );
-    }
+  if (schema.type === "object") {
+    const groupedProperties = groupBy(
+      Object.entries(schema.properties ?? {}),
+      ([propertyName, property]) => {
+        return property.deprecated
+          ? "deprecated"
+          : schema.required?.includes(propertyName)
+            ? "required"
+            : "optional";
+      },
+    );
+    const groupNames = ["required", "optional", "deprecated"] as const;
 
-    if (
-      typeof schema.type === "string" &&
-      ["string", "number", "boolean", "integer", "null"].includes(schema.type)
-    ) {
-      return (
-        <Card className="p-4">
-          <span className="text-sm text-muted-foreground">{schema.type}</span>
-          {schema.description && (
-            <Markdown
-              className={cn(
-                ProseClasses,
-                "text-sm leading-normal line-clamp-4",
-              )}
-              content={schema.description}
-            />
-          )}
-        </Card>
-      );
-    }
+    const additionalProperties =
+      typeof schema.additionalProperties === "object" ? (
+        <SchemaView schema={schema.additionalProperties} embedded />
+      ) : schema.additionalProperties === true ? (
+        <div className="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;
 
-    if (schema.additionalProperties) {
-      return (
-        <Card className="my-2">
-          <CardHeader>
-            <CardTitle>Additional Properties:</CardTitle>
-          </CardHeader>
-          <CardContent>
-            {renderSchema(
-              schema.additionalProperties as SchemaObject,
-              level + 1,
-            )}
-          </CardContent>
-        </Card>
-      );
-    }
+    const Component = embedded ? "div" : Card;
 
-    return null;
-  };
+    return (
+      <Component className="divide-y overflow-hidden">
+        {cardHeader}
+        {groupNames.map(
+          (group) =>
+            groupedProperties[group] && (
+              <ul key={group} className="divide-y">
+                {groupedProperties[group].map(([name, schema]) => (
+                  <SchemaPropertyItem
+                    key={name}
+                    name={name}
+                    schema={schema}
+                    group={group}
+                    defaultOpen={defaultOpen}
+                  />
+                ))}
+              </ul>
+            ),
+        )}
+        {additionalProperties}
+      </Component>
+    );
+  }
 
-  return renderSchema(schema, level);
+  return null;
 };