Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/bamacharanchhandogi/use-react-summary
This is a React component that allows you to summarize text using the Google Generative AI API. It provides a custom React hook useSummary that handles the text summarization process and returns the summarized text in Markdown format.
https://github.com/bamacharanchhandogi/use-react-summary
Last synced: 25 days ago
JSON representation
This is a React component that allows you to summarize text using the Google Generative AI API. It provides a custom React hook useSummary that handles the text summarization process and returns the summarized text in Markdown format.
- Host: GitHub
- URL: https://github.com/bamacharanchhandogi/use-react-summary
- Owner: BamaCharanChhandogi
- License: mit
- Created: 2024-04-16T05:25:21.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2024-08-15T17:25:37.000Z (3 months ago)
- Last Synced: 2024-09-15T09:27:55.059Z (about 2 months ago)
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/use-react-summary
- Size: 49.8 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# use React Summary
use-react-summary is a powerful React hook that leverages Google Generative AI to provide real-time text summarization. Whether you’re building a content-heavy application or simply need to condense information, this hook simplifies the integration of AI-driven summarization into your React components
## Features
- **AI-Powered Summarization:** Automatically summarize large blocks of text using advanced AI models from Google Generative AI.
- **Customizable Output:** Specify the desired summary length with the words parameter for greater control over the output.
- **Seamless Markdown Integration:** Outputs the summarized text in Markdown format, making it easy to style and render within your React app.
- **Error Handling:** Built-in error detection and loading states to enhance the user experience.
## Installation
Install the package via npm:
```
npm install use-react-summary
```
## Live Demo
### [Try the `useSummary` Hook Demo](https://use-react-summary-demo-site.vercel.app/)
## Usage
To use the `useSummary` hook, follow these steps:
```jsx
import React from 'react';
import {useSummary} from 'use-react-summary';
const MyComponent = () => {
const text = `This is the text you want to summarize.`;
const { summarizeText, isLoading, error } = useSummary({ text, words: 100 });
return (
{isLoading && Loading...
}
{error && Error: {error}
}
{summarizeText}
);
};
```
### Hook Parameters
- `text (string, required):` The text you want to summarize.
- `words (number, optional):` The maximum number of words you want in the summary.
### Returned Values
- `summarizeText (ReactElement):` A React element that renders the summarized text in Markdown format.
- `isLoading (boolean):` Indicates whether the summarization process is in progress.
- `error (string | null):` If an error occurs during the summarization process, this property will contain the error message. Otherwise, it will be `null`.
**Requirements**
This hook requires the following dependencies
- `react`
- `react-markdown`
- `@google/generative-ai`
These will be installed automatically when you install the package.
## Contribute
Contributions are welcome! If you have suggestions, feature requests, or want to report a bug, feel free to open an issue or submit a pull request.
**License**
-----------------
This project is licensed under the [LICENSE](LICENSE).
## Author
[Bama Charan Chhandogi](https://www.linkedin.com/in/bamacharanchhandogi/)
Made with ❤️ for the React community