Delete CountButton component
This commit is contained in:
parent
bd27b549aa
commit
4212dae5bf
1 changed files with 0 additions and 38 deletions
|
@ -1,38 +0,0 @@
|
|||
import { useState, useEffect } from "react";
|
||||
|
||||
// Interface for the response from the server
|
||||
// This should eventually reside in a dedicated file
|
||||
interface CountResponse {
|
||||
pressCount: number;
|
||||
}
|
||||
|
||||
// Some constants for the button
|
||||
const BUTTON_ENDPOINT = "/api/button";
|
||||
|
||||
// A simple button that counts how many times it's been pressed
|
||||
export function CountButton(): JSX.Element {
|
||||
const [count, setCount] = useState<number>(NaN);
|
||||
|
||||
// useEffect with a [] dependency array runs only once
|
||||
useEffect(() => {
|
||||
async function getCount(): Promise<void> {
|
||||
const response = await fetch(BUTTON_ENDPOINT);
|
||||
const data = (await response.json()) as CountResponse;
|
||||
setCount(data.pressCount);
|
||||
}
|
||||
void getCount();
|
||||
}, []);
|
||||
|
||||
// This is what runs on every button click
|
||||
function press(): void {
|
||||
async function pressPost(): Promise<void> {
|
||||
const response = await fetch(BUTTON_ENDPOINT, { method: "POST" });
|
||||
const data = (await response.json()) as CountResponse;
|
||||
setCount(data.pressCount);
|
||||
}
|
||||
void pressPost();
|
||||
}
|
||||
|
||||
// Return some JSX with the button and associated handler
|
||||
return <button onClick={press}>count is {count}</button>;
|
||||
}
|
Loading…
Add table
Reference in a new issue