Doc: Reorganized the work space section, fixing the links and spelling.

docs/features/plugin/functions/actions.md

@@ -1,20 +1,82 @@
 ---
-sidebar_position: 6
-title: "Actions"
+sidebar_position: 5
+title: "💬 Actions "
 ---
 
-# Actions
-Action functions allow you to write custom buttons to the message toolbar for end users to interact 
-with. This feature enables more interactive messaging, enabling users to grant permission before a 
-task is performed, generate visualizations of structured data, download an audio snippet of chats, 
-and many other use cases.
+# 💬 Actions
 
-A scaffold of Action code can be found [in the community section](https://openwebui.com/f/hub/custom_action/).
+Ever wanted a 🔘 button that lets you quickly do something with the AI’s response? That’s where **Actions** come in. Actions in Open WebUI are mini-interactive elements you can attach to individual chat messages, making interactions smoother and more efficient. ⚡
 
-An example of a graph visualization Action can be seen in the video below.
+## TL;DR
+- **Actions** are buttons or interactive elements you can add to chat messages.
+- They allow users to interact with messages—such as confirming, adding notes, or triggering additional responses.
+
+### What Are Actions? 🤔
+Actions allow you to place buttons right below any chat message, making it super easy for users to respond to prompts, confirm information, or trigger a new task based on the conversation.
+
+### How Do Actions Work? ⚙️
+Actions are created with a primary component, the **action function**, which defines what happens when the button is clicked. For instance, an action might open a small text input where users can add feedback or perform a secondary task.
+
+### Examples of Actions:
+1. **Confirm Action**  – Users click to confirm an instruction or agreement.
+2. **Add Feedback**  – Opens a text box to input additional information.
+3. **Quick Reply**  – Buttons for fast responses like “Yes” or “No”.
+
+By making interactions intuitive, Actions create a better user experience within Open WebUI, helping users stay engaged and making workflows faster and easier to manage.
+
+Some of the actual usecases includes:
+- Grant permission before performing a specific task
+- Generate visualizations of structured data 
+- Download audio snippets of chats 
+- Enable other interactive use cases for a richer messaging experience
+
+## 💻 Getting Started with Actions
+To start using action functions you can start by checking the [community functions](https://openwebui.com).[This guide](index.mdx#how-to-install-functions) provides a foundation for setting up an action.
+
+## 📊 Example: Graph Visualization Action
+
+For example, a graph visualization Action can enrich user interactions by enabling real-time data visuals. Check out the example below to see it in action:
 
 <p align="center">
   <a href="#">
     <img src="/img/pipelines/graph-viz-action.gif" alt="Graph Visualization Action" />
   </a>
 </p>
+
+Explore and experiment to make your interactions more dynamic and engaging with **Actions**!
+
+
+
+## 📝 Starting with Code
+
+If you’re ready to dive into writing code, start with reading this [document](../getting_started.md). You can also use the **Action code scaffold** available in [the community section](https://openwebui.com/f/hub/custom_action/).
+
+Actions have a single main component called an action function. This component takes an object defining the type of action and the data being processed.
+
+<summary>Example</summary>
+
+```
+async def action(
+        self,
+        body: dict,
+        __user__=None,
+        __event_emitter__=None,
+        __event_call__=None,
+    ) -> Optional[dict]:
+        print(f"action:{__name__}")
+
+        response = await __event_call__(
+            {
+                "type": "input",
+                "data": {
+                    "title": "write a message",
+                    "message": "here write a message to append",
+                    "placeholder": "enter your message",
+                },
+            }
+        )
+        print(response)
+```
+
+
+

docs/features/plugin/functions/filter.md

@@ -0,0 +1,96 @@
+---
+sidebar_position: 5
+title: "🚦 Filters"
+---
+
+# 🚦 Filters
+
+When using Open WebUI, not all user messages or model outputs might be perfectly suited for every conversation—this is where **Filters** come to the rescue. Filters let you control what goes in and out, ensuring that only the most relevant content reaches your chat or model.
+
+## TL;DR
+- **Filters** are used to pre-process (edit) incoming user messages or post-process (tweak) the AI’s responses. 
+- Filters help you adjust content on the fly, adding flexibility for sensitive topics, formatting, or message simplification. 
+
+### Why Use Filters? 🤔
+Filters are ideal for adding rules to chat interactions, like removing specific keywords or reformatting text.
+
+### ✨ Examples of Filters:
+1. **Profanity Filter** – Screens and removes inappropriate words from user messages.
+2. **Format Adjuster** – Automatically reformats incoming or outgoing text for consistency.
+3. **Spam Blocker** – Filters out repetitive or unwanted messages.
+4. **Resize Pictures** - Make the image smaller in size before giving it to the model.
+
+By setting up Filters, you control the flow of your conversation, ensuring that interactions are smooth, clean, and always relevant!
+
+## 💻 Getting Started with Filters
+To start using filter functions you can start by checking the [community functions](https://openwebui.com).[This guide](index.mdx#how-to-install-functions) provides a foundation for setting up a filter.
+
+<!-- To start creating filter functions, use the **Action code scaffold** available in [the community section](https://openwebui.com/f/hub/custom_action/). [This guide](index.mdx#how-to-install-functions) provides a foundation for setting up custom Actions tailored to your needs. -->
+
+### How Filters Work
+Filters work with two main components:
+1. **Inlet** – Pre-processes a user’s message before sending it to the model.
+2. **Outlet** – Adjusts the model’s response after it’s generated.
+
+When a filter pipeline is enabled on a model or pipe, the incoming message from the user (or "inlet") is passed to the filter for processing. The filter performs the desired action against the message before requesting the chat completion from the LLM model. Finally, the filter performs post-processing on the outgoing LLM message (or "outlet") before it is sent to the user.
+
+
+
+<!-- # Filters
+Filters are used to perform actions against incoming user messages and outgoing assistant (LLM) messages. Potential actions that can be taken in a filter include sending messages to monitoring platforms (such as Langfuse or DataDog), modifying message contents, blocking toxic messages, translating messages to another language, or rate limiting messages from certain users. A list of examples is maintained in the [Pipelines repo](https://github.com/open-webui/pipelines/tree/main/examples/filters). Filters can be executed as a Function or on a Pipelines server. The general workflow can be seen in the image below. -->
+
+<p align="center">
+  <a href="#">
+    <img src="/img/pipelines/filters.png" alt="Filter Workflow" />
+  </a>
+</p>
+
+
+## 📝 Starting with Code
+
+If you’re ready to dive into writing code, start with reading this [document](../getting_started.md).
+
+
+<summary>Example</summary>
+
+```
+class Filter:
+    # Define and Valves
+    class Valves(BaseModel):
+        priority: int = Field(
+            default=0, description="Priority level for the filter operations."
+        )
+        test_valve: int = Field(
+            default=4, description="A valve controlling a numberical value"
+        )
+        pass
+
+    # Define any UserValves
+    class UserValves(BaseModel):
+        test_user_valve: bool = Field(
+            default=False, description="A user valve controlling a True/False (on/off) switch"
+        )
+        pass
+
+    def __init__(self):
+        self.valves = self.Valves()
+        pass
+
+    def inlet(self, body: dict, __user__: Optional[dict] = None) -> dict:
+        print(f"inlet:{__name__}")
+        print(f"inlet:body:{body}")
+        print(f"inlet:user:{__user__}")
+
+        # Pre-processing logic here
+
+        return body
+
+    def outlet(self, body: dict, __user__: Optional[dict] = None) -> dict:
+        print(f"outlet:{__name__}")
+        print(f"outlet:body:{body}")
+        print(f"outlet:user:{__user__}")
+
+        # Post-processing logic here
+
+        return body
+```