A React client for the @braustin-holdings/homebase-node-sdk.
This package will obtain a JSONwebtoken from Homebase and provide you a React Context which contains a pre-configured fetch request which you can use to make GraphQL requests to Homebase.
- Make sure @braustin-holdings/homebase-node-sdk is installed and configured on your server.
npm i @braustin-holdings/homebase-react
Import the HomeBaseCtxProvider
and wrap it around the components that will need access to HB. This may be around your entire app.
import { HomebaseProvider } from '@braustin-holdings/homebase-react';
const App = () => {
<HomebaseProvider>
{/* ... */}
</HomebaseProvider>
}
NOTE: If your server is at a different URL, you can specify the serverUrl
prop on the HomebaseProvider:
<HomebaseProvider serverUrl={process.env.REACT_APP_BRAUSTIN_SERVER_URL}>
This will allow you to make authenticated graphQL calls using the homebaseGQL
function.
import { useHomebase, GET_HOMES } from "@braustin-holdings/homebase-react"
import { useEffect, useState } from "react"
const HomeBaseClient = () => {
const { homebaseGQL } = useHomebase()
const [homes, setHomes] = useState([])
useEffect(() => {
getHomes()
}, [])
const getHomes = async () => {
const res = await homebaseGQL(GET_HOMES)
setHomes(res.data.homes)
}
return (
<>
<h3>Homes</h3>
<pre>{JSON.stringify(homes, null, 2)}</pre>
</>
)
}