feat: add Open WebUI AI chat integration and widget
Adds a new "openWebUi" integration kind (under a new "ai" category) and an AI Chat widget for chatting with models served by Open WebUI. - Integration: Bearer API key auth, model list, native chat history CRUD, and token-by-token streaming chat completions (SSE). - Widget: in-input model picker, streaming responses, and an in-widget history panel. Reconstructs conversations from Open WebUI's message tree with a flat fallback. - Streaming is delivered over the WebSocket subscription link. - Adds integration and widget documentation.
This commit is contained in:
1 parent
f3608b26a0
commit
005c2e4cd1
25 files changed
+1290
No files matched your search
@@ -0,0 +1,39 @@
|
||||
---
|
||||
title: "Open WebUI"
|
||||
description: "Self-hosted AI chat interface for local and remote LLM providers"
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
import { IntegrationHeader } from "@site/src/components/integrations/header";
|
||||
import { IntegrationCapabilites } from "@site/src/components/integrations/widgets";
|
||||
import { AddingIntegration } from "@site/src/components/integrations/adding";
|
||||
import { IntegrationSecrets } from "@site/src/components/integrations/secrets";
|
||||
import { openWebUiIntegration } from ".";
|
||||
import { openWebUiWidget } from "../../widgets/open-webui";
|
||||
|
||||
<IntegrationHeader integration={openWebUiIntegration} categories={["AI", "Chat"]} />
|
||||
|
||||
[Open WebUI](https://openwebui.com/) is a self-hosted AI chat interface that aggregates multiple LLM providers (Ollama, OpenAI-compatible APIs, and more) behind a single API. Homarr connects to it so you can chat with your models directly from your dashboard.
|
||||
|
||||
### Widgets & Capabilities
|
||||
|
||||
<IntegrationCapabilites items={[{ widget: openWebUiWidget }]} />
|
||||
|
||||
### Adding the integration
|
||||
|
||||
<AddingIntegration />
|
||||
|
||||
:::info URL configuration
|
||||
Use the root URL of your Open WebUI instance, for example `http://localhost:3000`. Homarr calls the Open WebUI API under `/api` automatically.
|
||||
:::
|
||||
|
||||
### Secrets
|
||||
|
||||
<IntegrationSecrets
|
||||
secrets={[
|
||||
{
|
||||
credentials: ["apiKey"],
|
||||
steps: [],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
@@ -0,0 +1,8 @@
|
||||
import { IntegrationDefinition } from "@site/src/types";
|
||||
|
||||
export const openWebUiIntegration: IntegrationDefinition = {
|
||||
name: "Open WebUI",
|
||||
description: "Self-hosted AI chat interface for local and remote LLM providers",
|
||||
iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons@master/svg/open-webui.svg",
|
||||
path: "../../integrations/open-webui",
|
||||
};
|
||||
@@ -0,0 +1,47 @@
|
||||
---
|
||||
title: "AI Chat"
|
||||
description: "Chat with AI models through Open WebUI, with model picking and history."
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
import { WidgetHeader } from "@site/src/components/widgets/header";
|
||||
import { AddingWidget } from "@site/src/components/widgets/adding";
|
||||
import { WidgetConfig } from "@site/src/components/widgets/configuration";
|
||||
import { WidgetIntegrations } from "@site/src/components/widgets/integrations";
|
||||
import { openWebUiWidget } from ".";
|
||||
import { openWebUiIntegration } from "@site/docs/integrations/open-webui";
|
||||
|
||||
<WidgetHeader widget={openWebUiWidget} categories={["AI", "Chat"]} />
|
||||
|
||||
The AI Chat widget lets you chat with AI models served by Open WebUI directly from your dashboard. Responses stream in token-by-token, you can pick any model your Open WebUI instance exposes (Ollama, OpenAI, and other configured providers), and you can browse and reopen your Open WebUI chat history.
|
||||
|
||||
### Supported Integrations
|
||||
|
||||
<WidgetIntegrations
|
||||
items={[
|
||||
{
|
||||
integration: openWebUiIntegration,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
|
||||
### Adding the widget
|
||||
|
||||
<AddingWidget />
|
||||
|
||||
### Configuration
|
||||
|
||||
<WidgetConfig configuration={openWebUiWidget.configuration} />
|
||||
|
||||
### Features
|
||||
|
||||
| Feature | Description |
|
||||
| ----------------------- | ----------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| **Model picker** | Lists every model exposed by Open WebUI's `/api/models` endpoint, selectable from the chat input. The first model is selected by default. |
|
||||
| **Streaming responses** | Assistant replies stream in live as they are generated. |
|
||||
| **Chat history** | Browse and reopen previous chats. New conversations are saved back to Open WebUI. |
|
||||
|
||||
### Notes
|
||||
|
||||
- The widget uses a single Open WebUI integration.
|
||||
- Conversations are stored in Open WebUI itself, under the account that owns the API key, so they also appear in the Open WebUI app.
|
||||
@@ -0,0 +1,25 @@
|
||||
import { WidgetDefinition } from "@site/src/types";
|
||||
import { IconRobot } from "@tabler/icons-react";
|
||||
|
||||
export const openWebUiWidget: WidgetDefinition = {
|
||||
icon: IconRobot,
|
||||
name: "AI Chat",
|
||||
description: "Chat with AI models through Open WebUI, with model picking and history.",
|
||||
path: "../../widgets/open-webui",
|
||||
configuration: {
|
||||
items: [
|
||||
{
|
||||
name: "System prompt",
|
||||
description: "Optional instruction prepended to every conversation.",
|
||||
values: { type: "string" },
|
||||
defaultValue: "empty",
|
||||
},
|
||||
{
|
||||
name: "Show chat history",
|
||||
description: "Show a button to browse and reopen previous Open WebUI chats.",
|
||||
values: { type: "boolean" },
|
||||
defaultValue: "yes",
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
Reference in new issue
Block a user