-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: Initial support for assistant-ui (#249)
* feat: Move initialPrompt from useRun to start * feat: Add assistant UI project * ci: Add assistant-ui build step * chore: Remove autoprefixer * chore: Remove assistant-ui pipeline
- Loading branch information
1 parent
76c0d6b
commit 744d979
Showing
23 changed files
with
9,053 additions
and
192 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,94 @@ | ||
<p align="center"> | ||
<img src="https://a.inferable.ai/logo-hex.png" width="200" style="border-radius: 10px" /> | ||
</p> | ||
|
||
# Assistant UI Runtime | ||
|
||
[![npm version](https://badge.fury.io/js/%40inferable%2Freact.svg)](https://badge.fury.io/js/%40inferable%2Freact) | ||
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) | ||
[![Documentation](https://img.shields.io/badge/docs-inferable.ai-brightgreen)](https://docs.inferable.ai/) | ||
|
||
Inferable Runtime for [assistant-ui](https://github.com/Yonom/assistant-ui). | ||
|
||
## Installation | ||
|
||
```bash | ||
npm install @inferable/assistant-ui | ||
``` | ||
|
||
```bash | ||
yarn add @inferable/assistant-ui | ||
``` | ||
|
||
```bash | ||
pnpm add @inferable/assistant-ui | ||
``` | ||
|
||
## Quick Start | ||
|
||
> More details on Inferable front-end usage can be found [here](https://docs.inferable.ai/pages/frontend). | ||
### useInferableRuntime | ||
|
||
`useInferableRuntime` provides an `AssistantRuntime` object which can be used with `assistant-ui` to render a Chat UI with Inferable. | ||
|
||
```typescript | ||
import { useInferableRuntime } from '@inferable/assistant-ui'; | ||
import { Thread } from "@assistant-ui/react"; | ||
|
||
const { runtime, run } = useInferableRuntime({ | ||
clusterId: '<YOUR_CLUSTER_ID>', | ||
apiSecret: '<YOUR_API_SECRET>', | ||
onError: (error) => { | ||
console.error(error); | ||
} | ||
}) | ||
|
||
return ( | ||
<div className="h-full"> | ||
<Thread runtime={runtime}/> | ||
</div> | ||
); | ||
``` | ||
|
||
`userInferableRuntime` can also be used with `AssistantModal` for a modal UI. | ||
|
||
|
||
#### Error Handling | ||
|
||
You can handle errors by providing an `onError` callback: | ||
|
||
```typescript | ||
const { runtime, run } = useInferableRuntime({ | ||
clusterId: '<YOUR_CLUSTER_ID>', | ||
apiSecret: '<YOUR_API_SECRET>', | ||
onError: (error) => { | ||
console.error(error); | ||
} | ||
}) | ||
``` | ||
|
||
|
||
## Local Development | ||
|
||
There is development server included in the repository at `./demo`. | ||
|
||
1. Start the development server: | ||
```bash | ||
npm run dev | ||
``` | ||
|
||
This will start a Vite dev server at http://localhost:3000 with the test page, which provides a simple interface to test the runtime. | ||
|
||
## Documentation | ||
|
||
- [Inferable documentation](https://docs.inferable.ai/) contains all the information you need to get started with Inferable. | ||
- [Assistant UI documentation](https://www.assistant-ui.com/docs/getting-started) contains all the information you need to get started with Assistant UI. | ||
|
||
## Support | ||
|
||
For support or questions, please [create an issue in the repository](https://github.com/inferablehq/inferable/issues). | ||
|
||
## Contributing | ||
|
||
Contributions to the Inferable React SDK are welcome. Please ensure that your code adheres to the existing style and includes appropriate tests. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
module.exports = { | ||
presets: [ | ||
'@babel/preset-env', | ||
'@babel/preset-typescript', | ||
['@babel/preset-react', { runtime: 'automatic' }], | ||
], | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
import { useInferableRuntime } from '../src' | ||
import { Thread } from "@assistant-ui/react"; | ||
import toast from "react-hot-toast"; | ||
|
||
const TestPage = () => { | ||
const existingRunId = localStorage.getItem("runID") | ||
|
||
const { runtime, run } = useInferableRuntime({ | ||
clusterId: import.meta.env.VITE_INFERABLE_CLUSTER_ID, | ||
apiSecret: import.meta.env.VITE_INFERABLE_API_SECRET, | ||
runId: existingRunId, | ||
onError: (error) => { | ||
toast.error(error.message) | ||
} | ||
}) | ||
|
||
if (run && existingRunId !== run.id) { | ||
localStorage.setItem("runID", run.id); | ||
} | ||
|
||
if (existingRunId && !run) { | ||
return <div className="center">Loading...</div>; | ||
} | ||
|
||
return ( | ||
<div className="h-full"> | ||
<Thread runtime={runtime}/> | ||
</div> | ||
); | ||
}; | ||
|
||
export default TestPage |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
@tailwind base; | ||
@tailwind components; | ||
@tailwind utilities; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
<!doctype html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
<title>Vite + React</title> | ||
</head> | ||
<body> | ||
<div id="root"></div> | ||
<script type="module" src="/main.jsx"></script> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
import { StrictMode } from 'react' | ||
import { createRoot } from 'react-dom/client' | ||
import './index.css' | ||
import TestPage from './TestPage.jsx' | ||
import { Toaster } from 'react-hot-toast' | ||
|
||
createRoot(document.getElementById('root')).render( | ||
<StrictMode> | ||
<TestPage/> | ||
<Toaster/> | ||
</StrictMode>, | ||
) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
module.exports = { | ||
plugins: { | ||
tailwindcss: { | ||
config: "./demo/tailwind.config.js", | ||
}, | ||
}, | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
/** @type {import('tailwindcss').Config} */ | ||
export default { | ||
content: [ | ||
"./index.html", | ||
"./src/**/*.{js,ts,jsx,tsx}", | ||
], | ||
theme: { | ||
extend: {}, | ||
}, | ||
plugins: [ | ||
require("tailwindcss-animate"), | ||
require("@assistant-ui/react/tailwindcss") | ||
], | ||
} |
Oops, something went wrong.