{"id":48095725,"url":"https://github.com/josharsh/ai-hooks","last_synced_at":"2026-04-04T15:35:46.300Z","repository":{"id":215782372,"uuid":"739744311","full_name":"josharsh/ai-hooks","owner":"josharsh","description":"Custom hooks to integrate ai into your react apps","archived":false,"fork":false,"pushed_at":"2024-01-14T12:11:37.000Z","size":239,"stargazers_count":0,"open_issues_count":3,"forks_count":1,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-09-29T06:47:46.034Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/josharsh.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2024-01-06T12:14:46.000Z","updated_at":"2024-01-06T12:29:08.000Z","dependencies_parsed_at":"2024-01-06T14:49:41.887Z","dependency_job_id":null,"html_url":"https://github.com/josharsh/ai-hooks","commit_stats":null,"previous_names":["josharsh/ai-hooks"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/josharsh/ai-hooks","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/josharsh%2Fai-hooks","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/josharsh%2Fai-hooks/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/josharsh%2Fai-hooks/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/josharsh%2Fai-hooks/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/josharsh","download_url":"https://codeload.github.com/josharsh/ai-hooks/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/josharsh%2Fai-hooks/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31403959,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-04T10:20:44.708Z","status":"ssl_error","status_checked_at":"2026-04-04T10:20:06.846Z","response_time":60,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2026-04-04T15:35:46.168Z","updated_at":"2026-04-04T15:35:46.270Z","avatar_url":"https://github.com/josharsh.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# genai-hooks\n\n`genai-hooks` is a collection of React hooks tailored for integrating AI models, such as OpenAI, into your React applications. This package simplifies the process of connecting to various AI APIs, managing responses, and handling state.\n\n## Installation\n\nTo install `genai-hooks`, run the following command in your project directory:\n\n```bash\nnpm install genai-hooks\n```\n\n## Available Hooks\n1. useTextGeneration - For Generating Text\n2. useImageGeneration - For Generating Images\n3. usePredictiveCompletion - For predictive text input suggestions.\n4. useLanguageTranslation - For Translation to any Language\n\n## Sample Usage\n\n#### useTextGeneration Example\n```\nimport { useState } from 'react';\nimport useTextGeneration from 'genai-hooks';\n\nconst TextGeneratorComponent = () =\u003e {\n    const [inputPrompt, setInputPrompt] = useState('');\n    const openAIKey = 'YOUR_OPENAI_API_KEY';\n\n    const { generateText, generatedText, isLoading, error } = useTextGeneration(openAIKey);\n\n    const handleGenerateClick = () =\u003e {\n        generateText(inputPrompt);\n    };\n\n    return (\n        \u003cdiv\u003e\n            \u003ch2\u003eUseTextGeneration Usage\u003c/h2\u003e\n            \u003ctextarea\n                value={inputPrompt}\n                onChange={(e) =\u003e setInputPrompt(e.target.value)}\n                placeholder=\"Enter a prompt for AI\"\n                rows={4}\n                style={{ width: '100%', marginBottom: '10px' }}\n            /\u003e\n            \u003cbutton onClick={handleGenerateClick} disabled={isLoading}\u003e\n                Generate Text\n            \u003c/button\u003e\n            {isLoading \u0026\u0026 \u003cp\u003eLoading...\u003c/p\u003e}\n            {error \u0026\u0026 \u003cp\u003eError: {error.message}\u003c/p\u003e}\n            {generatedText \u0026\u0026 \u003cdiv\u003e\u003cstrong\u003eGenerated Text:\u003c/strong\u003e \u003cp\u003e{generatedText}\u003c/p\u003e\u003c/div\u003e}\n        \u003c/div\u003e\n    );\n};\n\nexport default TextGeneratorComponent;\n```\n\n\n#### useImageGeneration Example\n```\nimport { useState } from 'react';\nimport {useImageGeneration} from 'genai-hooks'\n\nconst ImageGeneratorComponent = () =\u003e {\n    const [prompt, setPrompt] = useState('');\n    const openAIKey = 'YOUR_OPENAI_API_KEY';\n    const { generateImage, imageUrl, isLoading, error } = useImageGeneration(openAIKey);\n\n    const handleGenerateClick = () =\u003e {\n        generateImage(prompt);\n    };\n\n    return (\n        \u003cdiv\u003e\n            \u003cinput \n                type=\"text\" \n                value={prompt} \n                onChange={(e) =\u003e setPrompt(e.target.value)}\n                placeholder=\"Enter a description\"\n            /\u003e\n            \u003cbutton onClick={handleGenerateClick} disabled={isLoading}\u003e\n                Generate Image\n            \u003c/button\u003e\n\n            {isLoading \u0026\u0026 \u003cp\u003eLoading...\u003c/p\u003e}\n            {error \u0026\u0026 \u003cp\u003eError: {error.message}\u003c/p\u003e}\n            {imageUrl \u0026\u0026 \u003cimg src={imageUrl} alt= \"Generated Image\" /\u003e}\n        \u003c/div\u003e\n    );\n};\n\nexport default ImageGeneratorComponent;\n```\n\n\n#### usePredictiveCompletion Example\nRefer to src/examples/PredictiveTextComponent.jsx\n\n![UsePredictiveCompletion Demonstration](https://raw.githubusercontent.com/josharsh/ai-hooks/main/resources/example-usePredictiveCompletion.png)\n\n\n\n#### useLanguageTranslation Example\nRefer to src/examples/LanguageTranslationComponent.jsx\n\n![UseLanguageTranslation Demonstration](https://raw.githubusercontent.com/josharsh/ai-hooks/main/resources/example-useLanguageTranslation.png)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjosharsh%2Fai-hooks","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjosharsh%2Fai-hooks","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjosharsh%2Fai-hooks/lists"}