1  import { useState } from 'react'
 2  import beaver from './assets/beaver.svg'
 3  import type { ApiResponse } from 'shared'
 4  import './App.css'
 5  
 6  const SERVER_URL = import.meta.env.VITE_SERVER_URL || "http://localhost:3000"
 7  
 8  function App() {
 9    const [data, setData] = useState<ApiResponse | undefined>()
10  
11    async function sendRequest() {
12      try {
13        const req = await fetch(`${SERVER_URL}/hello`)
14        const res: ApiResponse = await req.json()
15        setData(res)
16      } catch (error) {
17        console.log(error)
18      }
19    }
20  
21    return (
22      <>
23        <div>
24          <a href="https://github.com/stevedylandev/bhvr" target="_blank">
25            <img src={beaver} className="logo" alt="beaver logo" />
26          </a>
27        </div>
28        <h1>bhvr</h1>
29        <h2>Bun + Hono + Vite + React</h2>
30        <p>A typesafe fullstack monorepo</p>
31        <div className="card">
32          <div className='button-container'>
33            <button onClick={sendRequest}>
34              Call API
35            </button>
36            <a className='docs-link' target='_blank' href="https://bhvr.dev">Docs</a>
37          </div>
38          {data && (
39            <pre className='response'>
40              <code>
41              Message: {data.message} <br />
42              Success: {data.success.toString()}
43              </code>
44            </pre>
45          )}
46        </div>
47      </>
48    )
49  }
50  
51  export default App