51 lines
1.5 KiB
TypeScript
51 lines
1.5 KiB
TypeScript
import { useState } from "react";
|
|
import { coachService } from "../api";
|
|
|
|
export default function EdtCoach() {
|
|
const [name, setName] = useState("");
|
|
const [error, setError] = useState("");
|
|
const [statusCode, setStatusCode] = useState<number | null>(null);
|
|
|
|
const handleCreate = async () => {
|
|
try {
|
|
const response = await coachService.create({ name });
|
|
console.log("Success:", response.status, response.data);
|
|
alert(`Coach created! Status: ${response.status}`);
|
|
setError("");
|
|
setStatusCode(response.status);
|
|
} catch (err: any) {
|
|
if (err.response) {
|
|
// This is the HTTP response from the server
|
|
console.error("HTTP status:", err.response.status);
|
|
console.error("Response data:", err.response.data);
|
|
setError(`Failed to create coach: ${err.response.data}`);
|
|
setStatusCode(err.response.status);
|
|
} else if (err.request) {
|
|
console.error("No response received", err.request);
|
|
setError("No response from server!");
|
|
setStatusCode(null);
|
|
} else {
|
|
console.error("Error", err.message);
|
|
setError(err.message);
|
|
setStatusCode(null);
|
|
}
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div>
|
|
<h2>Create Coach</h2>
|
|
<input
|
|
type="text"
|
|
value={name}
|
|
onChange={(e) => setName(e.target.value)}
|
|
placeholder="Coach name"
|
|
/>
|
|
<button onClick={handleCreate}>Create</button>
|
|
|
|
{error && <p style={{ color: "red" }}>{error}</p>}
|
|
{statusCode && <p>HTTP Status: {statusCode}</p>}
|
|
</div>
|
|
);
|
|
}
|