Skip to main content

​
React

The GuidesFeedback widget lets you gather feedback on the guides.
This feature uses the Insights API to gather events related to Guides feedback. This requires a user token.

​
Installation

The Algolia Guides React package is available on the npm registry. 
npm install @algolia/generative-experiences-react

​
Usage

React
import { createClient } from "@algolia/generative-experiences-api-client";
import { GuidesFeedback } from "@algolia/generative-experiences-react";

const client = createClient({
  appId: "ALGOLIA_APPLICATION_ID",
  indexName: "your_index_name",
  searchOnlyAPIKey: "ALGOLIA_SEARCH_API_KEY",
  region: "us",
});

function App({ userToken, objectIDs }) {
  //...

  return (
    <GuidesFeedback
      client={client}
      objectIDs={[objectIDs]}
      userToken={userToken}
    />
  );
}

​
Parameters

​
client
GSEClient
required
The initialized Algolia Generative Experiences client.
​
objectIDs
string
required
List of object IDs for which to gather feedback.
​
userToken
string
required
The user token for computing feedback.
​
voteTarget
"content" | "headline"
default:"content"
The target of the feedback.
​
children
(props: ChildrenProps) => JSX.Element
A render function to fully customize what’s displayed.The default implementation is:
React
function defaultRender(props) {
  return (
    <section className={cx("ais-Feedback-wrapper", props.classNames?.wrapper)}>
      <props.View />
    </section>
  );
}
​
view
ViewProps
The view component to render your feedback widget.
​
classNames
FeedbackClassNames
The class names for the component.
TypeScript
type FeedbackClassNames = Partial<{
  wrapper?: string;
  container?: string;
  feedbackContainer?: string;
  button?: string;
  buttonIcon?: string;
  buttonsWrapper?: string;
  labelIcon?: string;
  labelWrapper?: string;
  noWrap?: string;
  screenReaderOnly?: string;
  thanksWrapper?: string;
}>;

​
JavaScript

The guidesFeedback widget lets you gather feedback on the guides.
This feature uses the Insights API to gather events related to Guides feedback. This requires a user token.

​
Installation

The Algolia Guides JavaScript package is available on the npm registry. 
npm install @algolia/generative-experiences-js

​
Usage

JavaScript
import { createClient } from "@algolia/generative-experiences-api-client";
import { guidesFeedback } from "@algolia/generative-experiences-js";

const client = createClient({
  appId: "ALGOLIA_APPLICATION_ID",
  indexName: "your_index_name",
  searchOnlyAPIKey: "ALGOLIA_SEARCH_API_KEY",
  region: "us",
});

guidesFeedback({
  container: "#feedback",
  client: client,
  voteTarget: "content",
  objectIDs: objectIDs,
  userToken: "test-user",
});

​
Parameters

​
client
GSEClient
required
The initialized Algolia Generative Experiences client.
​
objectIDs
string
required
List of object IDs for which to gather feedback.
​
userToken
string
required
The user token for computing feedback.
​
voteTarget
"content" | "headline"
default:"content"
The target of the feedback.
​
children
(props: ChildrenProps) => JSX.Element
A render function to fully customize what’s displayed.The default implementation is:
JavaScript
function defaultRender(props) {
  return (
    <section className={cx("ais-Feedback-wrapper", props.classNames?.wrapper)}>
      <props.View />
    </section>
  );
}
​
view
ViewProps
The view component to render your feedback widget.
​
classNames
FeedbackClassNames
The class names for the component.
TypeScript
type FeedbackClassNames = Partial<{
  wrapper?: string;
  container?: string;
  feedbackContainer?: string;
  button?: string;
  buttonIcon?: string;
  buttonsWrapper?: string;
  labelIcon?: string;
  labelWrapper?: string;
  noWrap?: string;
  screenReaderOnly?: string;
  thanksWrapper?: string;
}>;
⌘I