Framework guide

RFQ for React

Install @bootstrapware/rfq, import the stylesheet, and render RfqRequester, RfqSupplier, or RfqComparison from a Client Component. Bootstrapware does not authenticate end users. Wire the real session actor id.

Install

pnpm add @bootstrapware/rfq

Import @bootstrapware/rfq/styles.css once near the feature. The components use hooks, so they belong in a client boundary.

Local

import { RfqRequester, createLocalAdapter } from "@bootstrapware/rfq";
import "@bootstrapware/rfq/styles.css";

<RfqRequester
  scope={{ appId: "rqa_local", tenantKey: workspace.id }}
  actor={{ id: session.user.id, permissions: ["buyer_read", "buyer_edit"] }}
  adapter={createLocalAdapter({ storageKey: "demo-rfq" })}
/>

createLocalAdapter keeps RFQ records in the browser. It is a demo of the same transitions. It is not a production access check. RfqSupplier and RfqComparison take the same scope, actor, and adapter. Omit surface on those three.

Hosted

import { RfqRequester, createHostedAdapter } from "@bootstrapware/rfq";
import "@bootstrapware/rfq/styles.css";

const adapter = createHostedAdapter({
  appId: "rqa_demo",
  publishableKey: process.env.NEXT_PUBLIC_BSW_RFQ_PUBLISHABLE_KEY,
  scope: { tenantKey: workspace.id },
  authorToken,
});

<RfqRequester
  scope={{ appId: "rqa_demo", tenantKey: workspace.id }}
  actor={{ id: session.user.id, permissions: ["buyer_read", "buyer_edit"] }}
  adapter={adapter}
  renewAuthorToken={renewFromYourServer}
/>

Replace rqa_demo with the rqa_ id from get_rfq_install_snippet. The publishable env value comes from ensure_rfq_test_publishable. Put that value in NEXT_PUBLIC_BSW_RFQ_PUBLISHABLE_KEY. authorToken is the string your server route returned. Pass renewAuthorToken so the widget can refresh it. Optional apiBaseUrl defaults to https://rfq.bootstrapware.co.

BYO

Pass createByoAdapter(customerAdapter) as adapter. RFQ records stay on your API. Bootstrapware still publishes app config when you use live keys. Contract: adapter. A Postgres reference lives in examples/rfq-nextjs.

Pitfalls

Inventing actor.id. The prop is actor. Use session.user.id.
Treating actor.id or the permissions prop as authorization. The server session and author token are the authority.
Mixing buyer and supplier permissions on one token.
Minting authorToken in the browser.
Forgetting the stylesheet.
Putting bsw_live_sec_ or bsw_test_sec_ in client code.