no errors, only warnings and ignored things

biome.jsonc

@@ -24,7 +24,11 @@
         "useExhaustiveDependencies": "warn"
       },
       "suspicious": {
-        "noExplicitAny": "warn"
+        "noExplicitAny": "warn",
+        "noDuplicateFontNames": "off"
+      },
+      "style": {
+        "noNonNullAssertion": "warn"
       },
       "recommended": true
     }

package.json

@@ -12,6 +12,7 @@
     "cpy:readme": "cp README.MD packages/trpc-ui/README.md",
     "start:test-app": "node ./packages/test-app/lib/server.ts",
     "biome:check": "biome check --max-diagnostics=none",
+    "biome:check:errors": "biome check --max-diagnostics=none --diagnostic-level=error",
     "biome:check:changed": "biome check --changed --max-diagnostics=none",
     "biome:check:fix": "biome check --write --unsafe --max-diagnostics=none"
   },

packages/trpc-ui/src/parse/routerType.ts

@@ -86,6 +86,7 @@ const ProcedureSchema = z.object({
 
 export type Procedure = z.infer<typeof ProcedureSchema>;
 
+// biome-ignore lint/complexity/noBannedTypes: <explanation>
 export function isProcedure(obj: unknown | Function): obj is Procedure {
   if (typeof obj !== "function" || !("_def" in obj)) return false;
   return ProcedureDefSchema.safeParse((obj as any)._def).success;

packages/trpc-ui/src/react-app/components/CollapsableSection.tsx

@@ -72,6 +72,7 @@ export function CollapsableSection({
     >
       {collapsable ? (
         <button
+          type="button"
           onClick={() => {
             collapsables.toggle(fullPath);
             setPath(fullPath.join("."));

packages/trpc-ui/src/react-app/components/HeadersPopup.tsx

@@ -94,7 +94,7 @@ export function HeadersPopup() {
         </div>
         <div className="flex flex-col space-y-2 px-4 py-2">
           {headers.map(([headerKey, headerValue], i) => (
-            <div className="flex flex-col" key={`${i}`}>
+            <div className="flex flex-col" key={`${headerKey}, ${headerValue}`}>
               <div className="flex flex-row items-start">
                 <BaseTextField
                   className="flex-1"

packages/trpc-ui/src/react-app/components/LogoSvg.tsx

@@ -13,6 +13,7 @@ export function LogoSvg({ className }: { className?: string }) {
       enableBackground="new 0 0 512 512"
       className={className}
     >
+      <title>trpc-ui logo</title>
       <path
         fill="#282829"
         opacity="1.000000"

packages/trpc-ui/src/react-app/components/SideNav.tsx

@@ -47,6 +47,7 @@ function SideNavItem({
     <>
       {path.length > 0 && (
         <button
+          type="button"
           className={`flex w-full flex-row items-center justify-between font-bold ${
             shown ? "" : "opacity-70"
           }`}

packages/trpc-ui/src/react-app/components/contexts/AllPathsContext.tsx

@@ -18,6 +18,7 @@ function flatten(
   if (node.nodeType === "router") {
     const o = Object.values(node.children)
       .map(flatten)
+      // biome-ignore lint/performance/noAccumulatingSpread: <idk what this code is even doing>
       .reduce((a, b) => [...a, ...b]);
     return [...r, ...o, [node.path.join("."), colorSchemeType]];
   }

packages/trpc-ui/src/react-app/components/form/ProcedureForm/Error.tsx

@@ -4,7 +4,7 @@ import { FormSection } from "./FormSection";
 import { StackTrace } from "./StackTrace";
 import type { TRPCErrorType } from "./index";
 
-export function Error({ error }: { error: TRPCErrorType }) {
+export function ErrorDisplay({ error }: { error: TRPCErrorType }) {
   const json = error.meta.responseJSON[0]?.error.json ?? ({} as any);
   const msg = json.message;
   const code = json.code;

packages/trpc-ui/src/react-app/components/form/ProcedureForm/index.tsx

@@ -19,7 +19,7 @@ import getSize from "string-byte-length";
 import SuperJson from "superjson";
 import { z } from "zod";
 import JSONEditor from "../JSONEditor";
-import { Error as ErrorComponent } from "./Error";
+import { ErrorDisplay as ErrorComponent } from "./Error";
 import { FormSection } from "./FormSection";
 import { ProcedureFormButton } from "./ProcedureFormButton";
 import { Response } from "./Response";
@@ -161,7 +161,7 @@ export function ProcedureForm({
       );
       setShouldReset(false);
     }
-  }, [shouldReset]);
+  }, [shouldReset, setShouldReset, resetForm, defaultFormValuesForNode]);
   function reset() {
     setShouldReset(true);
     setQueryEnabled(false);

packages/trpc-ui/src/react-app/components/form/fields/ArrayField.tsx

@@ -66,8 +66,11 @@ export function ArrayField({
       iconElement={<DataArray className="mr-1" />}
       title={label}
     >
-      {field.value.map((_: ParsedInputNode, i: number) => (
-        <span key={`${i}`} className="flex flex-row items-start">
+      {field.value.map((parsedNode: ParsedInputNode, i: number) => (
+        <span
+          key={`${JSON.stringify(parsedNode.path)} ${i}`}
+          className="flex flex-row items-start"
+        >
           <span className="flex flex-1 flex-col">
             <Field
               key={textFieldKeys[i]}

packages/trpc-ui/src/react-app/components/form/fields/DiscriminatedUnionField.tsx

@@ -29,7 +29,8 @@ export function DiscriminatedUnionField({
     control,
   });
   function onDiscriminatorChange(value: string) {
-    const newObj = nodeTypecast.discriminatedUnionChildrenMap[value]!;
+    const newObj = nodeTypecast.discriminatedUnionChildrenMap[value];
+    if (!newObj) return;
     const newDefaultValues = {
       ...defaultFormValuesForNode(newObj),
       [nodeTypecast.discriminatorName]: value,
@@ -38,7 +39,7 @@ export function DiscriminatedUnionField({
   }
   const children = nodeTypecast.discriminatedUnionChildrenMap[
     field.value[nodeTypecast.discriminatorName]
-  ]! as ParsedInputNode & { type: "object" };
+  ] as ParsedInputNode & { type: "object" };
   return (
     <InputGroupContainer
       title={label}

packages/trpc-ui/src/react-app/components/form/utils.ts

@@ -19,8 +19,8 @@ export function defaultFormValuesForNode(node: ParsedInputNode): any {
     case "object": {
       const obj: any = {};
       // biome-ignore lint/style/noVar: <This errors when not using var, leave it unless you are going to properly fix it>
-      for (var [name, node] of Object.entries(node.children)) {
-        obj[name] = defaultFormValuesForNode(node);
+      for (var [name, nodeChild] of Object.entries(node.children)) {
+        obj[name] = defaultFormValuesForNode(nodeChild);
       }
       return obj;
     }