github-starred/open-webui
2
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2026-11-12 14:45:38 -06:00
Code Issues 2.4k Packages Projects Releases 129 Wiki Activity

[PR #4548] [CLOSED] **feat**: Artifacts #125169

New Issue
Closed
opened 2026-05-21 05:35:07 -05:00 by GiteaMirror · 0 comments
GiteaMirror commented 2026-05-21 05:35:07 -05:00
Owner
Copy Link
Copy Source

📋 Pull Request Information

Original PR: https://github.com/open-webui/open-webui/pull/4548
Author: @atgehrhardt
Created: 8/12/2024
Status: ❌ Closed

Base: dev ← Head: artifacts

📝 Commits (10+)

📊 Changes

6 files changed (+415 additions, -2 deletions)

View changed files

➕ src/lib/components/chat/ArtifactsModal.svelte (+364 -0)
📝 src/lib/components/chat/Chat.svelte (+3 -0)
📝 src/lib/components/chat/Messages.svelte (+4 -0)
📝 src/lib/components/layout/Sidebar.svelte (+40 -2)
📝 src/lib/stores/index.ts (+1 -0)
📝 src/routes/(app)/+layout.svelte (+3 -0)

📄 Description

Pull Request Checklist

Note to first-time contributors: Please open a discussion post in Discussions and describe your changes before submitting a pull request.

  • I am skipping this as I have contributed to Pipelines and this has been discussed in detail in the Discord :)

Changelog Entry

Description

  • This makes minor changes to existing components to allow for adding a new modal for the Artifacts feature. The main addition here is the actual Artifacts modal which parses all messages in the currently open chat, extracts code from those messages where possible and renders that code. If you open the modal you can see all renders.

This does not create actual artifacts or store the code. When the chat is deleted, the code is gone as it is simply live rendering parsed code.

Added

  • New Artifacts feature for rendering HTML, CSS, and JavaScript content from chat messages
    - Added ArtifactsModal.svelte component for displaying rendered content
    - Implemented artifact rendering in full view and preview mode
    - Added support for responsive, mobile, and desktop viewing modes
  • New "Artifacts" button in the sidebar for accessing the Artifacts modal
  • showArtifacts store for managing the visibility of the Artifacts modal

Changed

  • Updated Chat.svelte to include the new ArtifactsModal component
  • Modified Messages.svelte to handle chat actions related to artifacts
  • Enhanced Sidebar.svelte with a new Artifacts button and associated SVG icon
  • Updated +layout.svelte to incorporate the ArtifactsModal in the app layout

Deprecated

  • N/A

Removed

  • N/A

Fixed

  • N/A

Security

  • Adding the ability to render code in this manner opens up users to malicious code injection via an LLM. The long term goal is to implement a proper sandbox within OWUI and have the iframe simple render that (so the core code shouldn't change much if at all). For now, this should be safe enough for most users, but if they were to use an LLM capable of generating malicious javascript, it WOULD execute said code in the modal.

Breaking Changes

  • N/A

Additional Information

  • I'm Unsaidpaper from the Discord
  • I would be happy to split this into Atomics, but 90% of this PR is simply a new file. The changes are quite minor mostly imports to the other files save for Sidebar.svelte in which I simply added a new button. I can split this into two if you would prefer. One for the changes and one for the new file.
  • This is a brand new implementation of Artifacts and while I also wrote the Artifacts function on the community site, these two implementations actually have very little in common.

Screenshots or Videos

https://github.com/user-attachments/assets/90afd126-bb3f-44ed-9bfc-8d8744c43118

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/open-webui/open-webui/pull/4548 **Author:** [@atgehrhardt](https://github.com/atgehrhardt) **Created:** 8/12/2024 **Status:** ❌ Closed **Base:** `dev` ← **Head:** `artifacts` --- ### 📝 Commits (10+) - [`b461efb`](https://github.com/open-webui/open-webui/commit/b461efbca519e6b90616850d621e37bbf8f488c7) Finalized Artifacts Modal - [`9d6c7d9`](https://github.com/open-webui/open-webui/commit/9d6c7d9e6bc36305aef4a3c1caab66469abbacd4) Finalized Artifacts Modal - [`2cd9b8b`](https://github.com/open-webui/open-webui/commit/2cd9b8b528a46f99c37e8acb8a5bfb37f8a2c310) Cleanup - [`213f1ac`](https://github.com/open-webui/open-webui/commit/213f1acb2746c55308fc63fe8365643b1817464b) Cleanup - [`17d86aa`](https://github.com/open-webui/open-webui/commit/17d86aa0ae3a9d55b6749b36fca4f1b3a5564b27) Errors - [`7f8a071`](https://github.com/open-webui/open-webui/commit/7f8a071878274af85574526db72b24c921ceae00) Fixes - [`df9dcee`](https://github.com/open-webui/open-webui/commit/df9dcee33726f33ac39b81c180b3a7dbf1f6e47d) Fixes - [`9ed0f44`](https://github.com/open-webui/open-webui/commit/9ed0f4426c47bac5929e59b0c5b06e4a1e623ca3) Fixes - [`6858805`](https://github.com/open-webui/open-webui/commit/68588051425233c747410c7405eb6ff2d62091fe) Rebased on main - [`1e9b6bb`](https://github.com/open-webui/open-webui/commit/1e9b6bbd3ae5d4a51f9f13f4cd10df282081e134) Updated sidebar ### 📊 Changes **6 files changed** (+415 additions, -2 deletions) <details> <summary>View changed files</summary> ➕ `src/lib/components/chat/ArtifactsModal.svelte` (+364 -0) 📝 `src/lib/components/chat/Chat.svelte` (+3 -0) 📝 `src/lib/components/chat/Messages.svelte` (+4 -0) 📝 `src/lib/components/layout/Sidebar.svelte` (+40 -2) 📝 `src/lib/stores/index.ts` (+1 -0) 📝 `src/routes/(app)/+layout.svelte` (+3 -0) </details> ### 📄 Description # Pull Request Checklist ### Note to first-time contributors: Please open a discussion post in [Discussions](https://github.com/open-webui/open-webui/discussions) and describe your changes before submitting a pull request. - I am skipping this as I have contributed to Pipelines and this has been discussed in detail in the Discord :) # Changelog Entry ### Description - This makes minor changes to existing components to allow for adding a new modal for the Artifacts feature. The main addition here is the actual Artifacts modal which parses all messages in the currently open chat, extracts code from those messages where possible and renders that code. If you open the modal you can see all renders. This does not create actual artifacts or store the code. When the chat is deleted, the code is gone as it is simply live rendering parsed code. ### Added - New Artifacts feature for rendering HTML, CSS, and JavaScript content from chat messages - Added ArtifactsModal.svelte component for displaying rendered content - Implemented artifact rendering in full view and preview mode - Added support for responsive, mobile, and desktop viewing modes - New "Artifacts" button in the sidebar for accessing the Artifacts modal - showArtifacts store for managing the visibility of the Artifacts modal ### Changed - Updated Chat.svelte to include the new ArtifactsModal component - Modified Messages.svelte to handle chat actions related to artifacts - Enhanced Sidebar.svelte with a new Artifacts button and associated SVG icon - Updated +layout.svelte to incorporate the ArtifactsModal in the app layout ### Deprecated - N/A ### Removed - N/A ### Fixed - N/A ### Security - Adding the ability to render code in this manner opens up users to malicious code injection via an LLM. The long term goal is to implement a proper sandbox within OWUI and have the iframe simple render that (so the core code shouldn't change much if at all). For now, this should be safe enough for most users, but if they were to use an LLM capable of generating malicious javascript, it WOULD execute said code in the modal. ### Breaking Changes - N/A --- ### Additional Information - I'm Unsaidpaper from the Discord - I would be happy to split this into Atomics, but 90% of this PR is simply a new file. The changes are quite minor mostly imports to the other files save for Sidebar.svelte in which I simply added a new button. I can split this into two if you would prefer. One for the changes and one for the new file. - This is a brand new implementation of Artifacts and while I also wrote the Artifacts function on the community site, these two implementations actually have very little in common. ### Screenshots or Videos https://github.com/user-attachments/assets/90afd126-bb3f-44ed-9bfc-8d8744c43118 --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2026-05-21 05:35:08 -05:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
bug
confirmed
confirmed issue
core
documentation
enhancement
good first issue
help wanted
non-core
pull-request
Mirrored from GitHub Pull Request
 python
question
testing wanted
No labels pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No projects
Assignees
Clear assignees
GiteaMirror ninjasurge (Kaehlen Rog)
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/open-webui#125169