npm.io
0.7.12 • Published 1h ago

@getuserfeedback/react

Licence
MIT
Version
0.7.12
Deps
1
Size
49 kB
Vulns
0
Weekly
0

@getuserfeedback/react

In-product surveys for React apps, from getuserfeedback.com. Ask one short question at the right moment, and read every answer.

Plain JavaScript or another framework? Use @getuserfeedback/sdk.

Install

npm install @getuserfeedback/react

Requires react >= 18.

For AI agents

Installing this for someone? Start with our MCP server, not with this page. Connect https://mcp.getuserfeedback.com (listed in the MCP registry as com.getuserfeedback/mcp) and read its get-started resource — getuserfeedback://docs/get-started. It walks the whole path in order: workspace, API key (the MCP hands it to you), this package's install, the first survey, and which steps need a human.

Get started

Grab your Public API key from the dashboard — Settings → Widget — and mount the provider near the root of your app:

import { GetUserFeedbackProvider } from "@getuserfeedback/react";

export function App() {
  return (
    <GetUserFeedbackProvider clientOptions={{ apiKey: "YOUR_API_KEY" }}>
      <YourApp />
    </GetUserFeedbackProvider>
  );
}

If your app has signed-in users, also identify them. It lets surveys target signed-in users, and each answer arrives attributed to the person instead of anonymous. Call identify from an effect keyed on your auth state — resetting only when a signed-in user signs out, so anonymous visitors keep their identity — and render the component anywhere inside the provider:

import { useEffect, useRef } from "react";
import { useGetUserFeedback } from "@getuserfeedback/react";

function IdentifyUser({ user }: { user: { id: string; email: string } | null }) {
  const client = useGetUserFeedback();
  const wasIdentified = useRef(false);
  useEffect(() => {
    if (user) {
      client.identify(user.id, { email: user.email });
      wasIdentified.current = true;
    } else if (wasIdentified.current) {
      wasIdentified.current = false;
      client.reset();
    }
  }, [user, client]);
  return null;
}

That's it. The widget is running, and surveys you publish in the dashboard show up based on the targeting you set there — nothing shows until you publish something.

Keywords