# fluidai-gpt-sdk

> Hooks and components for FluidAI GPT

Latest version **1.0.21** (published 2023-09-04) · ISC license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install fluidai-gpt-sdk
pnpm add fluidai-gpt-sdk
yarn add fluidai-gpt-sdk
bun add fluidai-gpt-sdk
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 1.0.21 |
| Published | 2023-09-04 |
| First published | 2023-09-04 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 111.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | FluidAI |
| Maintainers | bharath_fluidai |
| Keywords | fluidai, react, gpt, hooks, component |

## Links

- npm: https://www.npmjs.com/package/fluidai-gpt-sdk
- Repository: https://github.com/Fluid-AI/fluid-ai-gpt-javascript-sdk
- Homepage: https://github.com/Fluid-AI/fluid-ai-gpt-javascript-sdk#readme
- Issues: https://github.com/Fluid-AI/fluid-ai-gpt-javascript-sdk/issues
- npm.io page: https://npm.io/package/fluidai-gpt-sdk

## Dependencies (1)

- [jwt-decode](https://npm.io/package/jwt-decode.md) ^3.1.2

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.21 (latest) — 2023-09-04
- 1.0.20 — 2023-09-04
- 1.0.19 — 2023-09-04
- 1.0.18 — 2023-09-04
- 1.0.17 — 2023-09-04
- 1.0.16 — 2023-09-04
- 1.0.15 — 2023-09-04
- 1.0.14 — 2023-09-04
- 1.0.12 — 2023-09-04
- 1.0.11 — 2023-09-04
- 1.0.10 — 2023-09-04
- 1.0.9 — 2023-09-04
- 1.0.6 — 2023-09-04
- 1.0.3 — 2023-09-04
- 1.0.0 — 2023-09-04

## README

# fluidai-gpt-sdk

Welcome to the documentation for fluidai-gpt-sdk module! This module contains a collection of React components and hooks that have been developed to streamline processes and enhance functionalities within our organization. By utilizing this module, you'll be able to accelerate development and maintain consistency across various projects.

## Installation

To use this module in your projects, follow these simple steps:

1. Install the module using npm:

```bash
npm i fluidai-gpt-sdk
```

## Hooks

Hooks available are

- useFluidGpt
- useSpeechRecognition
- useSpeechSynthesis

Import the desired hook from the module in your functional component:

### useFluidGpt

Hook handles all the request and response from the GPT. Helps keeping the context.

#### How it works

You've to set the token that you've received from fluid gpt. Once the token and tenant name (name of your organization) are sent. Hook handles the context of the conversation and handles response received from GPT.

```jsx
import { useGptQuery } from 'fluidai-gpt-sdk';
```

#### Using useFluidGpt hook

Apply the imported hook within your functional component:

```jsx
function ChatInterface() {
	const {
		getGptResponse,
		conversationHistory,
		isLoading,
		errorLog,
		setGptToken,
		setTenant,
		setConversationHistory,
	} = useGptQuery();
	// Stores the user query
	const [userQuery, setUserQuery] = useState('');

	// Setting the access token
	useEffect(() => {
		// Getting the access token
		(async function () {
			const token = await getAccessToken();
			setGptToken(token);
		})();
	}, []);

	function sendBtnHandler(event) {
		event.preventDefault();
		getGptResponse(userQuery);
	}
}
```

#### States exposed by useFluidGpt

- **conversationHistory**
  Keeps track of the back and forth done between user and gpt. Helping keeping the context for the gpt bot.
  ConversationHistory contains an array of type conversation

  ```ts
  interface Conversation {
  	role: 'assistant' | 'user';
  	content: string | null; // Response send from gpt or query of the user
  	isLoading?: boolean;
  }
  ```

- **setConversationHistory**: Helps set the context of the conversation.
- **setGptToken** : GPT access token.
- **setTenant**: Setting the tenant value for the token.
- **getGptResponse**: Pass the query string, conversation history state is manipulated and appends the gpt response to conversation history state.
- **errorLog** : All the errors are logged.
- **isLoading** : Check if the gpt is generating response for the query.

### useSpeechRecognition

```jsx
import { useSpeechRecognition } from 'fluidai-gpt-sdk';
```

#### Using useSpeechRecognition hook

Convert speech into text using useSpeechRecognition hook. Uses the Speech Recognition module present in the browser, and exposes all the functionality as states with live indicators.

```jsx
function RecordComponent() {
	const {
		transcript,
		isRecording,
		setStartRecording,
		errorMsg,
		isSpeechRecognitionSupported,
	} = useSpeechRecognition();

	return isRecording ? (
		<RecordingIndicator />
	) : (
		<RecordMic onClick={setStartRecording(true)} />
	);
}
```

#### States exposed by useSpeechRecognition

- **isRecording**: Let you know, if the browser is recording.
- **setStartRecording**: Start recording and list.
- **transcript** : Once the speech is converted to text, it is stored in transcript.
- **errorMsg**: If the conversation failed, error message is logged inside this state.
- **isSpeechRecognitionSupported** :Check if the browser support Speech to text conversation

#### Using useSpeechSynthesis hook

Convert text to speech using useSpeechRecognition hook. Uses the SpeechSynthesi module present in the browser, and exposes all the functionality as states with live indicators.

```jsx
function useSpeechSynthesis() {
	const {
		setTTSVoices,
		convertTextToSpeech,
		isSpeaking,
		cancelTTS,
		isSpeechSynthesisSupported,
	} = useSpeechSynthesis();
}
```

#### States exposed by useSpeechRecognition

- **setTTSVoices**: Setting the voice for the TTS.
- **convertTextToSpeech**: Pass your text, that need to converted to speech.
- **isSpeaking** : Let us know, if the TTS is speaking.
- **cancelTTS**: Stop the browser from speaking.
- **isSpeechSynthesisSupported** :Check if the browser support Text to speech conversation

---

Thank you for choosing our fluidai-gpt-sdk module! We hope these components and hooks will enhance your development process and contribute to more efficient and consistent projects within our organization. If you have any questions or need further assistance, feel free to reach out to our team. Happy coding!

---
_Source: https://npm.io/package/fluidai-gpt-sdk · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._