chore: Add biome

.github/workflows/test.yml

@@ -44,3 +44,6 @@ jobs:
 
       - name: Run tsc
         run: pnpm --filter @7nohe/react-app test:generated
+
+      - name: Run biome
+        run: pnpm biome check .

biome.json

@@ -0,0 +1,18 @@
+{
+	"$schema": "https://biomejs.dev/schemas/1.7.0/schema.json",
+	"organizeImports": {
+		"enabled": true
+	},
+	"files": {
+		"ignore": ["dist", "examples/react-app/openapi"]
+	},
+	"linter": {
+		"enabled": true,
+		"rules": {
+			"recommended": true
+		}
+	},
+	"formatter": {
+		"enabled": true
+	}
+}

examples/react-app/package.json

@@ -1,31 +1,31 @@
 {
-  "name": "@7nohe/react-app",
-  "private": true,
-  "version": "0.0.0",
-  "type": "module",
-  "scripts": {
-    "dev": "run-p dev:mock dev:client",
-    "dev:client": "vite --clearScreen=false",
-    "dev:mock": "prism mock ./petstore.yaml --dynamic",
-    "build": "tsc && vite build",
-    "preview": "vite preview",
-    "generate:api": "node ../../dist/cli.mjs -i ./petstore.yaml -c axios --request ./request.ts",
-    "test:generated": "tsc -p ./tsconfig.openapi.json --noEmit"
-  },
-  "dependencies": {
-    "@tanstack/react-query": "^5.18.1",
-    "axios": "^1.6.7",
-    "form-data": "~4.0.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
-  },
-  "devDependencies": {
-    "@stoplight/prism-cli": "^5.5.2",
-    "@types/react": "^18.2.52",
-    "@types/react-dom": "^18.2.18",
-    "@vitejs/plugin-react": "^4.2.1",
-    "npm-run-all": "^4.1.5",
-    "typescript": "^5.3.3",
-    "vite": "^5.0.12"
-  }
+	"name": "@7nohe/react-app",
+	"private": true,
+	"version": "0.0.0",
+	"type": "module",
+	"scripts": {
+		"dev": "run-p dev:mock dev:client",
+		"dev:client": "vite --clearScreen=false",
+		"dev:mock": "prism mock ./petstore.yaml --dynamic",
+		"build": "tsc && vite build",
+		"preview": "vite preview",
+		"generate:api": "node ../../dist/cli.mjs -i ./petstore.yaml -c axios --request ./request.ts",
+		"test:generated": "tsc -p ./tsconfig.openapi.json --noEmit"
+	},
+	"dependencies": {
+		"@tanstack/react-query": "^5.18.1",
+		"axios": "^1.6.7",
+		"form-data": "~4.0.0",
+		"react": "^18.2.0",
+		"react-dom": "^18.2.0"
+	},
+	"devDependencies": {
+		"@stoplight/prism-cli": "^5.5.2",
+		"@types/react": "^18.2.52",
+		"@types/react-dom": "^18.2.18",
+		"@vitejs/plugin-react": "^4.2.1",
+		"npm-run-all": "^4.1.5",
+		"typescript": "^5.3.3",
+		"vite": "^5.0.12"
+	}
 }

examples/react-app/request.ts

@@ -9,80 +9,83 @@ import type { OpenAPIConfig } from "./OpenAPI";
 const source = axios.CancelToken.source();
 
 const axiosInstance = axios.create({
-  // Your custom Axios instance config
-  baseURL: "http://localhost:4010",
-  headers: {
-    // Your custom headers
-  } satisfies RawAxiosRequestHeaders,
+	// Your custom Axios instance config
+	baseURL: "http://localhost:4010",
+	headers: {
+		// Your custom headers
+	} satisfies RawAxiosRequestHeaders,
 });
 
 // Add a request interceptor
 axiosInstance.interceptors.request.use(
-    function (config) {
-        // Do something before request is sent
-        if (!config.url || !config.params) {
-            return config;
-        }
+	(config) => {
+		// Do something before request is sent
+		if (!config.url || !config.params) {
+			return config;
+		}
 
-        Object.entries<any>(config.params).forEach(([key, value]) => {
-            const stringToSearch = `{${key}}`;
-            if(config.url !== undefined && config.url.search(stringToSearch) !== -1) {
-                config.url = config.url.replace(`{${key}}`, encodeURIComponent(value));
-                delete config.params[key];
-            }
-        });
+		for (const [key, value] of Object.entries<string>(config.params)) {
+			const stringToSearch = `{${key}}`;
+			if (
+				config.url !== undefined &&
+				config.url.search(stringToSearch) !== -1
+			) {
+				config.url = config.url.replace(`{${key}}`, encodeURIComponent(value));
+				delete config.params[key];
+			}
+		}
 
-        return  config;
-    },
-    function (error) {
-        // Do something with request error
-        return Promise.reject(error);
-    }
+		return config;
+	},
+	(error) => {
+		// Do something with request error
+		return Promise.reject(error);
+	},
 );
 
 // Add a response interceptor
 axiosInstance.interceptors.response.use(
-  function (response) {
-    // Any status code that lie within the range of 2xx cause this function to trigger
-    // Do something with response data
-    return response;
-  },
-  function (error) {
-    // Any status codes that falls outside the range of 2xx cause this function to trigger
-    // Do something with response error
-    return Promise.reject(error);
-  }
+	(response) => {
+		// Any status code that lie within the range of 2xx cause this function to trigger
+		// Do something with response data
+		return response;
+	},
+	(error) => {
+		// Any status codes that falls outside the range of 2xx cause this function to trigger
+		// Do something with response error
+		return Promise.reject(error);
+	},
 );
 
 export const request = <T>(
-  config: OpenAPIConfig,
-  options: ApiRequestOptions
+	config: OpenAPIConfig,
+	options: ApiRequestOptions,
 ): CancelablePromise<T> => {
-  return new CancelablePromise((resolve, reject, onCancel) => {
-    onCancel(() => source.cancel("The user aborted a request."));
+	return new CancelablePromise((resolve, reject, onCancel) => {
+		onCancel(() => source.cancel("The user aborted a request."));
 
-    let formattedHeaders = options.headers as RawAxiosRequestHeaders;
-    if (options.mediaType) {
-      formattedHeaders = {
-        ...options.headers,
-        "Content-Type": options.mediaType,
-      } satisfies RawAxiosRequestHeaders;
-    }
+		let formattedHeaders = options.headers as RawAxiosRequestHeaders;
+		if (options.mediaType) {
+			formattedHeaders = {
+				...options.headers,
+				"Content-Type": options.mediaType,
+			} satisfies RawAxiosRequestHeaders;
+		}
 
-    return axiosInstance
-      .request({
-        url: options.url,
-        data: options.body,
-        method: options.method,
-        params: options.path,
-        headers: formattedHeaders,
-        cancelToken: source.token,
-      })
-      .then((res) => {
-        resolve(res.data);
-      })
-      .catch((error) => {
-        reject(error);
-      });
-  });
+		return axiosInstance
+			.request({
+				url: options.url,
+				data: options.body,
+				method: options.method,
+				params: options.path,
+				headers: formattedHeaders,
+				cancelToken: source.token,
+			})
+			.then((res) => {
+				resolve(res.data);
+			})
+			.catch((error) => {
+				reject(error);
+			});
+	});
 };

examples/react-app/src/App.tsx

@@ -1,76 +1,79 @@
-import "./App.css";
+import { useState } from "react";
 import {
-  useDefaultServiceAddPet,
-  useDefaultServiceFindPets,
-  useDefaultServiceFindPetsKey,
-  useDefaultServiceGetNotDefined,
-  useDefaultServicePostNotDefined,
+	useDefaultServiceAddPet,
+	useDefaultServiceFindPets,
+	useDefaultServiceFindPetsKey,
+	useDefaultServiceGetNotDefined,
+	useDefaultServicePostNotDefined,
 } from "../openapi/queries";
-import { useState } from "react";
-import { queryClient } from "./queryClient";
+import "./App.css";
 import { SuspenseParent } from "./components/SuspenseParent";
+import { queryClient } from "./queryClient";
 
 function App() {
-  const [tags, _setTags] = useState<string[]>([]);
-  const [limit, _setLimit] = useState<number>(10);
+	const [tags, _setTags] = useState<string[]>([]);
+	const [limit, _setLimit] = useState<number>(10);
 
-  const { data, error, refetch } = useDefaultServiceFindPets({ tags, limit });
-  // This is an example of using a hook that has all parameters optional;
-  // Here we do not have to pass in an object
-  const {} = useDefaultServiceFindPets();
+	const { data, error, refetch } = useDefaultServiceFindPets({ tags, limit });
+	// This is an example of using a hook that has all parameters optional;
+	// Here we do not have to pass in an object
+	const { data: _ } = useDefaultServiceFindPets();
 
-  // This is an example of a query that is not defined in the OpenAPI spec
-  // this defaults to any - here we are showing how to override the type
-  // Note - this is marked as deprecated in the OpenAPI spec and being passed to the client
-  const { data: notDefined } = useDefaultServiceGetNotDefined<undefined>();
-  const { mutate: mutateNotDefined } =
-    useDefaultServicePostNotDefined<undefined>();
+	// This is an example of a query that is not defined in the OpenAPI spec
+	// this defaults to any - here we are showing how to override the type
+	// Note - this is marked as deprecated in the OpenAPI spec and being passed to the client
+	const { data: notDefined } = useDefaultServiceGetNotDefined<undefined>();
+	const { mutate: mutateNotDefined } =
+		useDefaultServicePostNotDefined<undefined>();
 
-  const { mutate: addPet } = useDefaultServiceAddPet();
+	const { mutate: addPet } = useDefaultServiceAddPet();
 
-  if (error)
-    return (
-      <div>
-        <p>Failed to fetch pets</p>
-        <button onClick={() => refetch()}>Retry</button>
-      </div>
-    );
+	if (error)
+		return (
+			<div>
+				<p>Failed to fetch pets</p>
+				<button type="button" onClick={() => refetch()}>
+					Retry
+				</button>
+			</div>
+		);
 
-  return (
-    <div className="App">
-      <h1>Pet List</h1>
-      <ul>
-        {data instanceof Array &&
-          data?.map((pet, index) => (
-            <li key={pet.id + "-" + index}>{pet.name}</li>
-          ))}
-      </ul>
-      <button
-        onClick={() => {
-          addPet(
-            {
-              requestBody: { name: "Duggy" },
-            },
-            {
-              onSuccess: () => {
-                queryClient.invalidateQueries({
-                  queryKey: [useDefaultServiceFindPetsKey],
-                });
-                console.log("success");
-              },
-              onError: (error) => console.error(error),
-            }
-          );
-        }}
-      >
-        Create a pet
-      </button>
-      <div>
-        <h1>Suspense Components</h1>
-        <SuspenseParent />
-      </div>
-    </div>
-  );
+	return (
+		<div className="App">
+			<h1>Pet List</h1>
+			<ul>
+				{Array.isArray(data) &&
+					data?.map((pet, index) => (
+						<li key={`${pet.id}-${index}`}>{pet.name}</li>
+					))}
+			</ul>
+			<button
+				type="button"
+				onClick={() => {
+					addPet(
+						{
+							requestBody: { name: "Duggy" },
+						},
+						{
+							onSuccess: () => {
+								queryClient.invalidateQueries({
+									queryKey: [useDefaultServiceFindPetsKey],
+								});
+								console.log("success");
+							},
+							onError: (error) => console.error(error),
+						},
+					);
+				}}
+			>
+				Create a pet
+			</button>
+			<div>
+				<h1>Suspense Components</h1>
+				<SuspenseParent />
+			</div>
+		</div>
+	);
 }
 
 export default App;