mirror of
https://github.com/shishantbiswas/bknd.git
synced 2026-03-16 04:27:21 +00:00
Merge remote-tracking branch 'origin/feat/adapter-api-async' into feat/adapter-auth-env
This commit is contained in:
@@ -65,7 +65,7 @@ import "bknd/dist/styles.css";
|
||||
|
||||
import { getApi } from "bknd/adapter/astro";
|
||||
|
||||
const api = getApi(Astro, { mode: "dynamic" });
|
||||
const api = await getApi(Astro, { mode: "dynamic" });
|
||||
const user = api.getUser();
|
||||
|
||||
export const prerender = false;
|
||||
@@ -94,7 +94,7 @@ Here is an example of using the API in static context:
|
||||
```jsx
|
||||
---
|
||||
import { getApi } from "bknd/adapter/astro";
|
||||
const api = getApi(Astro);
|
||||
const api = await getApi(Astro);
|
||||
const { data } = await api.data.readMany("todos");
|
||||
---
|
||||
|
||||
@@ -109,7 +109,7 @@ On SSR pages, you can also access the authenticated user:
|
||||
```jsx
|
||||
---
|
||||
import { getApi } from "bknd/adapter/astro";
|
||||
const api = getApi(Astro, { mode: "dynamic" });
|
||||
const api = await getApi(Astro, { mode: "dynamic" });
|
||||
const user = api.getUser();
|
||||
const { data } = await api.data.readMany("todos");
|
||||
|
||||
|
||||
@@ -32,6 +32,9 @@ Now make sure that you wrap your root layout with the `ClientProvider` so that a
|
||||
share the same context:
|
||||
```tsx
|
||||
// app/root.tsx
|
||||
import { withApi } from "bknd/adapter/remix"
|
||||
import { type Api, ClientProvider } from "bknd/client";
|
||||
|
||||
export function Layout(props) {
|
||||
// nothing to change here, just for orientation
|
||||
return (
|
||||
@@ -48,21 +51,12 @@ declare module "@remix-run/server-runtime" {
|
||||
}
|
||||
|
||||
// export a loader that initiates the API
|
||||
// and pass it through the context
|
||||
export const loader = async (args: LoaderFunctionArgs) => {
|
||||
const api = new Api({
|
||||
host: new URL(args.request.url).origin,
|
||||
headers: args.request.headers
|
||||
});
|
||||
|
||||
// get the user from the API
|
||||
const user = api.getUser();
|
||||
|
||||
// add api to the context
|
||||
args.context.api = api;
|
||||
|
||||
return { user };
|
||||
};
|
||||
// and passes it down to args.context.api
|
||||
export const loader = withApi(async (args: LoaderFunctionArgs, api: Api) => {
|
||||
return {
|
||||
user: api.getUser()
|
||||
};
|
||||
});
|
||||
|
||||
export default function App() {
|
||||
const { user } = useLoaderData<typeof loader>();
|
||||
@@ -93,15 +87,9 @@ Since the API has already been constructed in the root layout, you can now use i
|
||||
import type { LoaderFunctionArgs } from "@remix-run/server-runtime";
|
||||
import { useLoaderData } from "@remix-run/react";
|
||||
|
||||
export const loader = async (args: LoaderFunctionArgs) => {
|
||||
const { api } = args.context;
|
||||
|
||||
// get the authenticated user
|
||||
const user = api.getAuthState().user;
|
||||
|
||||
// get the data from the API
|
||||
export const loader = async ({ context: { api } }: LoaderFunctionArgs) => {
|
||||
const { data } = await api.data.readMany("todos");
|
||||
return { data, user };
|
||||
return { data, user: api.getUser() };
|
||||
};
|
||||
|
||||
export default function Index() {
|
||||
|
||||
Reference in New Issue
Block a user