Indrajith K L
0e561a3fc8
* Implements Select package.json and parse dependencies * Implements Bun API to handle package Analysis * Implements NPM Registry API handlers * Analyze the cross dependencies between packages * Implements loading NodeJS versions with search (inclusing LTS) * Error handling * Implements Report option to get higher infor about the dependencies * Implements Upgrade command builder
65 lines
2.2 KiB
TypeScript
65 lines
2.2 KiB
TypeScript
import { Button } from "@/components/ui/button";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Label } from "@/components/ui/label";
|
|
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
|
import { Textarea } from "@/components/ui/textarea";
|
|
import { useRef, type FormEvent } from "react";
|
|
|
|
export function APITester() {
|
|
const responseInputRef = useRef<HTMLTextAreaElement>(null);
|
|
|
|
const testEndpoint = async (e: FormEvent<HTMLFormElement>) => {
|
|
e.preventDefault();
|
|
|
|
try {
|
|
const form = e.currentTarget;
|
|
const formData = new FormData(form);
|
|
const endpoint = formData.get("endpoint") as string;
|
|
const url = new URL(endpoint, location.href);
|
|
const method = formData.get("method") as string;
|
|
const res = await fetch(url, { method });
|
|
|
|
const data = await res.json();
|
|
responseInputRef.current!.value = JSON.stringify(data, null, 2);
|
|
} catch (error) {
|
|
responseInputRef.current!.value = String(error);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="flex flex-col gap-6">
|
|
<form onSubmit={testEndpoint} className="flex items-center gap-2">
|
|
<Label htmlFor="method" className="sr-only">
|
|
Method
|
|
</Label>
|
|
<Select name="method" defaultValue="GET">
|
|
<SelectTrigger className="w-[100px]" id="method">
|
|
<SelectValue placeholder="Method" />
|
|
</SelectTrigger>
|
|
<SelectContent align="start">
|
|
<SelectItem value="GET">GET</SelectItem>
|
|
<SelectItem value="PUT">PUT</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
<Label htmlFor="endpoint" className="sr-only">
|
|
Endpoint
|
|
</Label>
|
|
<Input id="endpoint" type="text" name="endpoint" defaultValue="/api/hello" placeholder="/api/hello" />
|
|
<Button type="submit" variant="secondary">
|
|
Send
|
|
</Button>
|
|
</form>
|
|
<Label htmlFor="response" className="sr-only">
|
|
Response
|
|
</Label>
|
|
<Textarea
|
|
ref={responseInputRef}
|
|
id="response"
|
|
readOnly
|
|
placeholder="Response will appear here..."
|
|
className="min-h-[140px] font-mono resize-y"
|
|
/>
|
|
</div>
|
|
);
|
|
}
|