feat/enh: group channel

backend/open_webui/config.py

@@ -1455,6 +1455,10 @@ USER_PERMISSIONS_FEATURES_NOTES = (
     os.environ.get("USER_PERMISSIONS_FEATURES_NOTES", "True").lower() == "true"
 )
 
+USER_PERMISSIONS_FEATURES_CHANNELS = (
+    os.environ.get("USER_PERMISSIONS_FEATURES_CHANNELS", "True").lower() == "true"
+)
+
 USER_PERMISSIONS_FEATURES_API_KEYS = (
     os.environ.get("USER_PERMISSIONS_FEATURES_API_KEYS", "False").lower() == "true"
 )
@@ -1509,8 +1513,9 @@ DEFAULT_USER_PERMISSIONS = {
     "features": {
         # General features
         "api_keys": USER_PERMISSIONS_FEATURES_API_KEYS,
-        "folders": USER_PERMISSIONS_FEATURES_FOLDERS,
         "notes": USER_PERMISSIONS_FEATURES_NOTES,
+        "folders": USER_PERMISSIONS_FEATURES_FOLDERS,
+        "channels": USER_PERMISSIONS_FEATURES_CHANNELS,
         "direct_tool_servers": USER_PERMISSIONS_FEATURES_DIRECT_TOOL_SERVERS,
         # Chat features
         "web_search": USER_PERMISSIONS_FEATURES_WEB_SEARCH,

backend/open_webui/migrations/versions/90ef40d4714e_update_channel_and_channel_members_table.py

@@ -0,0 +1,81 @@
+"""Update channel and channel members table
+
+Revision ID: 90ef40d4714e
+Revises: b10670c03dd5
+Create Date: 2025-11-30 06:33:38.790341
+
+"""
+
+from typing import Sequence, Union
+
+from alembic import op
+import sqlalchemy as sa
+import open_webui.internal.db
+
+
+# revision identifiers, used by Alembic.
+revision: str = "90ef40d4714e"
+down_revision: Union[str, None] = "b10670c03dd5"
+branch_labels: Union[str, Sequence[str], None] = None
+depends_on: Union[str, Sequence[str], None] = None
+
+
+def upgrade() -> None:
+    # Update 'channel' table
+    op.add_column("channel", sa.Column("is_private", sa.Boolean(), nullable=True))
+
+    op.add_column("channel", sa.Column("archived_at", sa.BigInteger(), nullable=True))
+    op.add_column("channel", sa.Column("archived_by", sa.Text(), nullable=True))
+
+    op.add_column("channel", sa.Column("deleted_at", sa.BigInteger(), nullable=True))
+    op.add_column("channel", sa.Column("deleted_by", sa.Text(), nullable=True))
+
+    op.add_column("channel", sa.Column("updated_by", sa.Text(), nullable=True))
+
+    # Update 'channel_member' table
+    op.add_column("channel_member", sa.Column("role", sa.Text(), nullable=True))
+    op.add_column("channel_member", sa.Column("invited_by", sa.Text(), nullable=True))
+    op.add_column(
+        "channel_member", sa.Column("invited_at", sa.BigInteger(), nullable=True)
+    )
+
+    #  Create 'channel_webhook' table
+    op.create_table(
+        "channel_webhook",
+        sa.Column("id", sa.Text(), primary_key=True, unique=True, nullable=False),
+        sa.Column("user_id", sa.Text(), nullable=False),
+        sa.Column(
+            "channel_id",
+            sa.Text(),
+            sa.ForeignKey("channel.id", ondelete="CASCADE"),
+            nullable=False,
+        ),
+        sa.Column("name", sa.Text(), nullable=False),
+        sa.Column("profile_image_url", sa.Text(), nullable=True),
+        sa.Column("token", sa.Text(), nullable=False),
+        sa.Column("last_used_at", sa.BigInteger(), nullable=True),
+        sa.Column("created_at", sa.BigInteger(), nullable=False),
+        sa.Column("updated_at", sa.BigInteger(), nullable=False),
+    )
+
+    pass
+
+
+def downgrade() -> None:
+    # Downgrade 'channel' table
+    op.drop_column("channel", "is_private")
+    op.drop_column("channel", "archived_at")
+    op.drop_column("channel", "archived_by")
+    op.drop_column("channel", "deleted_at")
+    op.drop_column("channel", "deleted_by")
+    op.drop_column("channel", "updated_by")
+
+    # Downgrade 'channel_member' table
+    op.drop_column("channel_member", "role")
+    op.drop_column("channel_member", "invited_by")
+    op.drop_column("channel_member", "invited_at")
+
+    # Drop 'channel_webhook' table
+    op.drop_table("channel_webhook")
+
+    pass

backend/open_webui/models/channels.py

@@ -4,6 +4,7 @@ import uuid
 from typing import Optional
 
 from open_webui.internal.db import Base, get_db
+from open_webui.models.groups import Groups
 from open_webui.utils.access_control import has_access
 
 from pydantic import BaseModel, ConfigDict
@@ -26,12 +27,23 @@ class Channel(Base):
     name = Column(Text)
     description = Column(Text, nullable=True)
 
+    # Used to indicate if the channel is private (for 'group' type channels)
+    is_private = Column(Boolean, nullable=True)
+
     data = Column(JSON, nullable=True)
     meta = Column(JSON, nullable=True)
     access_control = Column(JSON, nullable=True)
 
     created_at = Column(BigInteger)
+
     updated_at = Column(BigInteger)
+    updated_by = Column(Text, nullable=True)
+
+    archived_at = Column(BigInteger, nullable=True)
+    archived_by = Column(Text, nullable=True)
+
+    deleted_at = Column(BigInteger, nullable=True)
+    deleted_by = Column(Text, nullable=True)
 
 
 class ChannelModel(BaseModel):
@@ -39,17 +51,28 @@ class ChannelModel(BaseModel):
 
     id: str
     user_id: str
+
     type: Optional[str] = None
 
     name: str
     description: Optional[str] = None
 
+    is_private: Optional[bool] = None
+
     data: Optional[dict] = None
     meta: Optional[dict] = None
     access_control: Optional[dict] = None
 
     created_at: int  # timestamp in epoch (time_ns)
+
     updated_at: int  # timestamp in epoch (time_ns)
+    updated_by: Optional[str] = None
+
+    archived_at: Optional[int] = None  # timestamp in epoch (time_ns)
+    archived_by: Optional[str] = None
+
+    deleted_at: Optional[int] = None  # timestamp in epoch (time_ns)
+    deleted_by: Optional[str] = None
 
 
 class ChannelMember(Base):
@@ -59,7 +82,9 @@ class ChannelMember(Base):
     channel_id = Column(Text, nullable=False)
     user_id = Column(Text, nullable=False)
 
+    role = Column(Text, nullable=True)
     status = Column(Text, nullable=True)
+
     is_active = Column(Boolean, nullable=False, default=True)
 
     is_channel_muted = Column(Boolean, nullable=False, default=False)
@@ -68,6 +93,9 @@ class ChannelMember(Base):
     data = Column(JSON, nullable=True)
     meta = Column(JSON, nullable=True)
 
+    invited_at = Column(BigInteger, nullable=True)
+    invited_by = Column(Text, nullable=True)
+
     joined_at = Column(BigInteger)
     left_at = Column(BigInteger, nullable=True)
 
@@ -84,7 +112,9 @@ class ChannelMemberModel(BaseModel):
     channel_id: str
     user_id: str
 
+    role: Optional[str] = None
     status: Optional[str] = None
+
     is_active: bool = True
 
     is_channel_muted: bool = False
@@ -93,6 +123,9 @@ class ChannelMemberModel(BaseModel):
     data: Optional[dict] = None
     meta: Optional[dict] = None
 
+    invited_at: Optional[int] = None  # timestamp in epoch (time_ns)
+    invited_by: Optional[str] = None
+
     joined_at: Optional[int] = None  # timestamp in epoch (time_ns)
     left_at: Optional[int] = None  # timestamp in epoch (time_ns)
 
@@ -102,6 +135,40 @@ class ChannelMemberModel(BaseModel):
     updated_at: Optional[int] = None  # timestamp in epoch (time_ns)
 
 
+class ChannelWebhook(Base):
+    __tablename__ = "channel_webhook"
+
+    id = Column(Text, primary_key=True, unique=True)
+    channel_id = Column(Text, nullable=False)
+    user_id = Column(Text, nullable=False)
+
+    name = Column(Text, nullable=False)
+    profile_image_url = Column(Text, nullable=True)
+
+    token = Column(Text, nullable=False)
+    last_used_at = Column(BigInteger, nullable=True)
+
+    created_at = Column(BigInteger, nullable=False)
+    updated_at = Column(BigInteger, nullable=False)
+
+
+class ChannelWebhookModel(BaseModel):
+    model_config = ConfigDict(from_attributes=True)
+
+    id: str
+    channel_id: str
+    user_id: str
+
+    name: str
+    profile_image_url: Optional[str] = None
+
+    token: str
+    last_used_at: Optional[int] = None  # timestamp in epoch (time_ns)
+
+    created_at: int  # timestamp in epoch (time_ns)
+    updated_at: int  # timestamp in epoch (time_ns)
+
+
 ####################
 # Forms
 ####################
@@ -113,18 +180,72 @@ class ChannelResponse(ChannelModel):
 
 
 class ChannelForm(BaseModel):
-    type: Optional[str] = None
+    name: str = ""
-    name: str
     description: Optional[str] = None
+    is_private: Optional[bool] = None
     data: Optional[dict] = None
     meta: Optional[dict] = None
     access_control: Optional[dict] = None
+    group_ids: Optional[list[str]] = None
     user_ids: Optional[list[str]] = None
 
 
+class CreateChannelForm(ChannelForm):
+    type: Optional[str] = None
+
+
 class ChannelTable:
+
+    def _create_memberships_by_user_ids_and_group_ids(
+        self,
+        channel_id: str,
+        invited_by: str,
+        user_ids: Optional[list[str]] = None,
+        group_ids: Optional[list[str]] = None,
+    ) -> list[ChannelMemberModel]:
+        # For group and direct message channels, automatically add the specified users as members
+        user_ids = user_ids or []
+        if invited_by not in user_ids:
+            user_ids.append(invited_by)  # Ensure the creator is also a member
+
+        # Add users from specified groups
+        group_ids = group_ids or []
+        for group_id in group_ids:
+            group_user_ids = Groups.get_group_user_ids_by_id(group_id)
+            for uid in group_user_ids:
+                if uid not in user_ids:
+                    user_ids.append(uid)
+
+        # Ensure uniqueness
+        user_ids = list(set(user_ids))
+
+        memberships = []
+        for uid in user_ids:
+            channel_member = ChannelMemberModel(
+                **{
+                    "id": str(uuid.uuid4()),
+                    "channel_id": channel_id,
+                    "user_id": uid,
+                    "status": "joined",
+                    "is_active": True,
+                    "is_channel_muted": False,
+                    "is_channel_pinned": False,
+                    "invited_at": int(time.time_ns()),
+                    "invited_by": invited_by,
+                    "joined_at": int(time.time_ns()),
+                    "left_at": None,
+                    "last_read_at": int(time.time_ns()),
+                    "created_at": int(time.time_ns()),
+                    "updated_at": int(time.time_ns()),
+                }
+            )
+
+            memberships.append(ChannelMember(**channel_member.model_dump()))
+
+        return memberships
+
     def insert_new_channel(
-        self, form_data: ChannelForm, user_id: str
+        self, form_data: CreateChannelForm, user_id: str
     ) -> Optional[ChannelModel]:
         with get_db() as db:
             channel = ChannelModel(
@@ -140,31 +261,14 @@ class ChannelTable:
             )
             new_channel = Channel(**channel.model_dump())
 
-            if form_data.type == "dm":
+            if form_data.type in ["group", "dm"]:
-                # For direct message channels, automatically add the specified users as members
+                memberships = self._create_memberships_by_user_ids_and_group_ids(
-                user_ids = form_data.user_ids or []
+                    channel.id,
-                if user_id not in user_ids:
+                    user_id,
-                    user_ids.append(user_id)  # Ensure the creator is also a member
+                    form_data.user_ids,
-
+                    form_data.group_ids,
-                for uid in user_ids:
+                )
-                    channel_member = ChannelMemberModel(
+                db.add_all(memberships)
-                        **{
-                            "id": str(uuid.uuid4()),
-                            "channel_id": channel.id,
-                            "user_id": uid,
-                            "status": "joined",
-                            "is_active": True,
-                            "is_channel_muted": False,
-                            "is_channel_pinned": False,
-                            "joined_at": int(time.time_ns()),
-                            "left_at": None,
-                            "last_read_at": int(time.time_ns()),
-                            "created_at": int(time.time_ns()),
-                            "updated_at": int(time.time_ns()),
-                        }
-                    )
-                    new_membership = ChannelMember(**channel_member.model_dump())
-                    db.add(new_membership)
 
             db.add(new_channel)
             db.commit()
@@ -398,8 +502,12 @@ class ChannelTable:
                 return None
 
             channel.name = form_data.name
+            channel.description = form_data.description
+            channel.is_private = form_data.is_private
+
             channel.data = form_data.data
             channel.meta = form_data.meta
+
             channel.access_control = form_data.access_control
             channel.updated_at = int(time.time_ns())
 

backend/open_webui/routers/channels.py

@@ -26,6 +26,7 @@ from open_webui.models.channels import (
     ChannelModel,
     ChannelForm,
     ChannelResponse,
+    CreateChannelForm,
 )
 from open_webui.models.messages import (
     Messages,
@@ -53,6 +54,7 @@ from open_webui.utils.access_control import (
     has_access,
     get_users_with_access,
     get_permitted_group_and_user_ids,
+    has_permission,
 )
 from open_webui.utils.webhook import post_webhook
 from open_webui.utils.channels import extract_mentions, replace_mentions
@@ -76,10 +78,16 @@ class ChannelListItemResponse(ChannelModel):
 
 
 @router.get("/", response_model=list[ChannelListItemResponse])
-async def get_channels(user=Depends(get_verified_user)):
+async def get_channels(request: Request, user=Depends(get_verified_user)):
+    if user.role != "admin" and not has_permission(
+        user.id, "features.channels", request.app.state.config.USER_PERMISSIONS
+    ):
+        raise HTTPException(
+            status_code=status.HTTP_401_UNAUTHORIZED,
+            detail=ERROR_MESSAGES.UNAUTHORIZED,
+        )
 
     channels = Channels.get_channels_by_user_id(user.id)
-
     channel_list = []
     for channel in channels:
         last_message = Messages.get_last_message_by_channel_id(channel.id)
@@ -124,13 +132,69 @@ async def get_all_channels(user=Depends(get_verified_user)):
     return Channels.get_channels_by_user_id(user.id)
 
 
+############################
+# GetDMChannelByUserId
+############################
+
+
+@router.get("/dm/{user_id}", response_model=Optional[ChannelModel])
+async def get_dm_channel_by_user_id(
+    request: Request, user_id: str, user=Depends(get_verified_user)
+):
+    if user.role != "admin" and not has_permission(
+        user.id, "features.channels", request.app.state.config.USER_PERMISSIONS
+    ):
+        raise HTTPException(
+            status_code=status.HTTP_401_UNAUTHORIZED,
+            detail=ERROR_MESSAGES.UNAUTHORIZED,
+        )
+
+    try:
+        existing_channel = Channels.get_dm_channel_by_user_ids([user.id, user_id])
+        if existing_channel:
+            Channels.update_member_active_status(existing_channel.id, user.id, True)
+            return ChannelModel(**existing_channel.model_dump())
+
+        channel = Channels.insert_new_channel(
+            CreateChannelForm(
+                type="dm",
+                name="",
+                user_ids=[user_id],
+            ),
+            user.id,
+        )
+        return ChannelModel(**channel.model_dump())
+    except Exception as e:
+        log.exception(e)
+        raise HTTPException(
+            status_code=status.HTTP_400_BAD_REQUEST, detail=ERROR_MESSAGES.DEFAULT()
+        )
+
+
 ############################
 # CreateNewChannel
 ############################
 
 
 @router.post("/create", response_model=Optional[ChannelModel])
-async def create_new_channel(form_data: ChannelForm, user=Depends(get_admin_user)):
+async def create_new_channel(
+    request: Request, form_data: CreateChannelForm, user=Depends(get_verified_user)
+):
+    if user.role != "admin" and not has_permission(
+        user.id, "features.channels", request.app.state.config.USER_PERMISSIONS
+    ):
+        raise HTTPException(
+            status_code=status.HTTP_401_UNAUTHORIZED,
+            detail=ERROR_MESSAGES.UNAUTHORIZED,
+        )
+
+    if form_data.type not in ["group", "dm"] and user.role != "admin":
+        # Only admins can create standard channels (joined by default)
+        raise HTTPException(
+            status_code=status.HTTP_401_UNAUTHORIZED,
+            detail=ERROR_MESSAGES.UNAUTHORIZED,
+        )
+
     try:
         if form_data.type == "dm":
             existing_channel = Channels.get_dm_channel_by_user_ids(
@@ -173,7 +237,7 @@ async def get_channel_by_id(id: str, user=Depends(get_verified_user)):
     user_ids = None
     users = None
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -203,7 +267,6 @@ async def get_channel_by_id(id: str, user=Depends(get_verified_user)):
                 "unread_count": unread_count,
             }
         )
-
     else:
         if user.role != "admin" and not has_access(
             user.id, type="read", access_control=channel.access_control
@@ -265,7 +328,7 @@ async def get_channel_members_by_id(
     page = max(1, page)
     skip = (page - 1) * limit
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -275,7 +338,6 @@ async def get_channel_members_by_id(
             member.user_id for member in Channels.get_members_by_channel_id(channel.id)
         ]
         users = Users.get_users_by_user_ids(user_ids)
-
         total = len(users)
 
         return {
@@ -358,14 +420,27 @@ async def update_is_active_member_by_id_and_user_id(
 
 @router.post("/{id}/update", response_model=Optional[ChannelModel])
 async def update_channel_by_id(
-    id: str, form_data: ChannelForm, user=Depends(get_admin_user)
+    request: Request, id: str, form_data: ChannelForm, user=Depends(get_verified_user)
 ):
+    if user.role != "admin" and not has_permission(
+        user.id, "features.channels", request.app.state.config.USER_PERMISSIONS
+    ):
+        raise HTTPException(
+            status_code=status.HTTP_401_UNAUTHORIZED,
+            detail=ERROR_MESSAGES.UNAUTHORIZED,
+        )
+
     channel = Channels.get_channel_by_id(id)
     if not channel:
         raise HTTPException(
             status_code=status.HTTP_404_NOT_FOUND, detail=ERROR_MESSAGES.NOT_FOUND
         )
 
+    if channel.user_id != user.id and user.role != "admin":
+        raise HTTPException(
+            status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
+        )
+
     try:
         channel = Channels.update_channel_by_id(id, form_data)
         return ChannelModel(**channel.model_dump())
@@ -382,13 +457,28 @@ async def update_channel_by_id(
 
 
 @router.delete("/{id}/delete", response_model=bool)
-async def delete_channel_by_id(id: str, user=Depends(get_admin_user)):
+async def delete_channel_by_id(
+    request: Request, id: str, user=Depends(get_verified_user)
+):
+    if user.role != "admin" and not has_permission(
+        user.id, "features.channels", request.app.state.config.USER_PERMISSIONS
+    ):
+        raise HTTPException(
+            status_code=status.HTTP_401_UNAUTHORIZED,
+            detail=ERROR_MESSAGES.UNAUTHORIZED,
+        )
+
     channel = Channels.get_channel_by_id(id)
     if not channel:
         raise HTTPException(
             status_code=status.HTTP_404_NOT_FOUND, detail=ERROR_MESSAGES.NOT_FOUND
         )
 
+    if channel.user_id != user.id and user.role != "admin":
+        raise HTTPException(
+            status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
+        )
+
     try:
         Channels.delete_channel_by_id(id)
         return True
@@ -418,7 +508,7 @@ async def get_channel_messages(
             status_code=status.HTTP_404_NOT_FOUND, detail=ERROR_MESSAGES.NOT_FOUND
         )
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -481,7 +571,7 @@ async def get_pinned_channel_messages(
             status_code=status.HTTP_404_NOT_FOUND, detail=ERROR_MESSAGES.NOT_FOUND
         )
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -735,7 +825,7 @@ async def new_message_handler(
             status_code=status.HTTP_404_NOT_FOUND, detail=ERROR_MESSAGES.NOT_FOUND
         )
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -751,7 +841,7 @@ async def new_message_handler(
     try:
         message = Messages.insert_new_message(form_data, channel.id, user.id)
         if message:
-            if channel.type == "dm":
+            if channel.type in ["group", "dm"]:
                 members = Channels.get_members_by_channel_id(channel.id)
                 for member in members:
                     if not member.is_active:
@@ -857,7 +947,7 @@ async def get_channel_message(
             status_code=status.HTTP_404_NOT_FOUND, detail=ERROR_MESSAGES.NOT_FOUND
         )
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -912,7 +1002,7 @@ async def pin_channel_message(
             status_code=status.HTTP_404_NOT_FOUND, detail=ERROR_MESSAGES.NOT_FOUND
         )
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -975,7 +1065,7 @@ async def get_channel_thread_messages(
             status_code=status.HTTP_404_NOT_FOUND, detail=ERROR_MESSAGES.NOT_FOUND
         )
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -1040,7 +1130,7 @@ async def update_message_by_id(
             status_code=status.HTTP_400_BAD_REQUEST, detail=ERROR_MESSAGES.DEFAULT()
         )
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -1104,7 +1194,7 @@ async def add_reaction_to_message(
             status_code=status.HTTP_404_NOT_FOUND, detail=ERROR_MESSAGES.NOT_FOUND
         )
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -1173,7 +1263,7 @@ async def remove_reaction_by_id_and_user_id_and_name(
             status_code=status.HTTP_404_NOT_FOUND, detail=ERROR_MESSAGES.NOT_FOUND
         )
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()
@@ -1256,7 +1346,7 @@ async def delete_message_by_id(
             status_code=status.HTTP_400_BAD_REQUEST, detail=ERROR_MESSAGES.DEFAULT()
         )
 
-    if channel.type == "dm":
+    if channel.type in ["group", "dm"]:
         if not Channels.is_user_channel_member(channel.id, user.id):
             raise HTTPException(
                 status_code=status.HTTP_403_FORBIDDEN, detail=ERROR_MESSAGES.DEFAULT()

backend/open_webui/routers/users.py

@@ -19,7 +19,7 @@ from open_webui.models.users import (
     UserGroupIdsModel,
     UserGroupIdsListResponse,
     UserInfoListResponse,
-    UserIdNameListResponse,
+    UserInfoListResponse,
     UserRoleUpdateForm,
     Users,
     UserSettings,
@@ -102,20 +102,31 @@ async def get_all_users(
     return Users.get_users()
 
 
-@router.get("/search", response_model=UserIdNameListResponse)
+@router.get("/search", response_model=UserInfoListResponse)
 async def search_users(
     query: Optional[str] = None,
+    order_by: Optional[str] = None,
+    direction: Optional[str] = None,
+    page: Optional[int] = 1,
     user=Depends(get_verified_user),
 ):
     limit = PAGE_ITEM_COUNT
 
-    page = 1  # Always return the first page for search
+    page = max(1, page)
     skip = (page - 1) * limit
 
     filter = {}
     if query:
         filter["query"] = query
 
+    filter = {}
+    if query:
+        filter["query"] = query
+    if order_by:
+        filter["order_by"] = order_by
+    if direction:
+        filter["direction"] = direction
+
     return Users.get_users(filter=filter, skip=skip, limit=limit)
 
 
@@ -196,8 +207,9 @@ class ChatPermissions(BaseModel):
 
 class FeaturesPermissions(BaseModel):
     api_keys: bool = False
-    folders: bool = True
     notes: bool = True
+    channels: bool = True
+    folders: bool = True
     direct_tool_servers: bool = False
 
     web_search: bool = True

src/lib/apis/channels/index.ts

@@ -3,6 +3,7 @@ import { WEBUI_API_BASE_URL } from '$lib/constants';
 type ChannelForm = {
 	type?: string;
 	name: string;
+	is_private?: boolean;
 	data?: object;
 	meta?: object;
 	access_control?: object;

src/lib/apis/users/index.ts

@@ -166,11 +166,33 @@ export const getUsers = async (
 	return res;
 };
 
-export const getAllUsers = async (token: string) => {
+export const searchUsers = async (
+	token: string,
+	query?: string,
+	orderBy?: string,
+	direction?: string,
+	page = 1
+) => {
 	let error = null;
 	let res = null;
 
-	res = await fetch(`${WEBUI_API_BASE_URL}/users/all`, {
+	const searchParams = new URLSearchParams();
+
+	searchParams.set('page', `${page}`);
+
+	if (query) {
+		searchParams.set('query', query);
+	}
+
+	if (orderBy) {
+		searchParams.set('order_by', orderBy);
+	}
+
+	if (direction) {
+		searchParams.set('direction', direction);
+	}
+
+	res = await fetch(`${WEBUI_API_BASE_URL}/users/search?${searchParams.toString()}`, {
 		method: 'GET',
 		headers: {
 			'Content-Type': 'application/json',
@@ -194,11 +216,11 @@ export const getAllUsers = async (token: string) => {
 	return res;
 };
 
-export const searchUsers = async (token: string, query: string) => {
+export const getAllUsers = async (token: string) => {
 	let error = null;
 	let res = null;
 
-	res = await fetch(`${WEBUI_API_BASE_URL}/users/search?query=${encodeURIComponent(query)}`, {
+	res = await fetch(`${WEBUI_API_BASE_URL}/users/all`, {
 		method: 'GET',
 		headers: {
 			'Content-Type': 'application/json',

src/lib/components/admin/Users/Groups/EditGroupModal.svelte

@@ -84,8 +84,9 @@
 		},
 		features: {
 			api_keys: false,
-			folders: true,
 			notes: true,
+			channels: true,
+			folders: true,
 			direct_tool_servers: false,
 			web_search: true,
 			image_generation: true,

src/lib/components/admin/Users/Groups/Permissions.svelte

@@ -54,8 +54,9 @@
 		},
 		features: {
 			api_keys: false,
-			folders: true,
 			notes: true,
+			channels: true,
+			folders: true,
 			direct_tool_servers: false,
 			web_search: true,
 			image_generation: true,
@@ -726,6 +727,54 @@
 			{/if}
 		</div>
 
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-1">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Notes')}
+				</div>
+				<Switch bind:state={permissions.features.notes} />
+			</div>
+			{#if defaultPermissions?.features?.notes && !permissions.features.notes}
+				<div>
+					<div class="text-xs text-gray-500">
+						{$i18n.t('This is a default user permission and will remain enabled.')}
+					</div>
+				</div>
+			{/if}
+		</div>
+
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-1">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Channels')}
+				</div>
+				<Switch bind:state={permissions.features.channels} />
+			</div>
+			{#if defaultPermissions?.features?.channels && !permissions.features.channels}
+				<div>
+					<div class="text-xs text-gray-500">
+						{$i18n.t('This is a default user permission and will remain enabled.')}
+					</div>
+				</div>
+			{/if}
+		</div>
+
+		<div class="flex flex-col w-full">
+			<div class="flex w-full justify-between my-1">
+				<div class=" self-center text-xs font-medium">
+					{$i18n.t('Folders')}
+				</div>
+				<Switch bind:state={permissions.features.folders} />
+			</div>
+			{#if defaultPermissions?.features?.folders && !permissions.features.folders}
+				<div>
+					<div class="text-xs text-gray-500">
+						{$i18n.t('This is a default user permission and will remain enabled.')}
+					</div>
+				</div>
+			{/if}
+		</div>
+
 		<div class="flex flex-col w-full">
 			<div class="flex w-full justify-between my-1">
 				<div class=" self-center text-xs font-medium">
@@ -789,21 +838,5 @@
 				</div>
 			{/if}
 		</div>
-
-		<div class="flex flex-col w-full">
-			<div class="flex w-full justify-between my-1">
-				<div class=" self-center text-xs font-medium">
-					{$i18n.t('Notes')}
-				</div>
-				<Switch bind:state={permissions.features.notes} />
-			</div>
-			{#if defaultPermissions?.features?.notes && !permissions.features.notes}
-				<div>
-					<div class="text-xs text-gray-500">
-						{$i18n.t('This is a default user permission and will remain enabled.')}
-					</div>
-				</div>
-			{/if}
-		</div>
 	</div>
 </div>

src/lib/components/channel/ChannelInfoModal.svelte

@@ -44,7 +44,7 @@
 							</div>
 						{:else}
 							<div class=" size-4 justify-center flex items-center">
-								{#if channel?.access_control === null}
+								{#if channel?.type === 'group' ? !channel?.is_private : channel?.access_control === null}
 									<Hashtag className="size-3.5" strokeWidth="2.5" />
 								{:else}
 									<Lock className="size-5.5" strokeWidth="2" />

src/lib/components/channel/Navbar.svelte

@@ -92,7 +92,7 @@
 							{/if}
 						{:else}
 							<div class=" size-4.5 justify-center flex items-center">
-								{#if channel?.access_control === null}
+								{#if channel?.type === 'group' ? !channel?.is_private : channel?.access_control === null}
 									<Hashtag className="size-3.5" strokeWidth="2.5" />
 								{:else}
 									<Lock className="size-5" strokeWidth="2" />
@@ -100,9 +100,7 @@
 							</div>
 						{/if}
 
-						<div
+						<div class=" text-left self-center overflow-hidden w-full line-clamp-1 flex-1">
-							class=" text-left self-center overflow-hidden w-full line-clamp-1 capitalize flex-1"
-						>
 							{#if channel?.name}
 								{channel.name}
 							{:else}

src/lib/components/layout/Sidebar.svelte

@@ -181,9 +181,18 @@
 	};
 
 	const initChannels = async () => {
+		// default (none), group, dm type
 		await channels.set(
 			(await getChannels(localStorage.token)).sort((a, b) =>
-				a.type === b.type ? 0 : a.type === 'dm' ? 1 : -1
+				a.type === b.type
+					? 0
+					: a.type === 'dm'
+						? 1
+						: a.type === 'group'
+							? b.type === 'dm'
+								? -1
+								: 0
+							: -1
 			)
 		);
 	};
@@ -486,7 +495,7 @@
 
 <ChannelModal
 	bind:show={showCreateChannel}
-	onSubmit={async ({ type, name, access_control, user_ids }) => {
+	onSubmit={async ({ type, name, is_private, access_control, group_ids, user_ids }) => {
 		name = name?.trim();
 
 		if (type === 'dm') {
@@ -504,7 +513,9 @@
 		const res = await createNewChannel(localStorage.token, {
 			type: type,
 			name: name,
+			is_private: is_private,
 			access_control: access_control,
+			group_ids: group_ids,
 			user_ids: user_ids
 		}).catch((error) => {
 			toast.error(`${error}`);
@@ -940,14 +951,14 @@
 					</Folder>
 				{/if}
 
-				{#if $config?.features?.enable_channels && ($user?.role === 'admin' || $channels.length > 0)}
+				{#if $config?.features?.enable_channels && ($user?.role === 'admin' || ($user?.permissions?.features?.channels ?? true))}
 					<Folder
 						id="sidebar-channels"
 						className="px-2 mt-0.5"
 						name={$i18n.t('Channels')}
 						chevron={false}
 						dragAndDrop={false}
-						onAdd={$user?.role === 'admin'
+						onAdd={$user?.role === 'admin' || ($user?.permissions?.features?.channels ?? true)
 							? async () => {
 									await tick();
 

src/lib/components/layout/Sidebar/ChannelItem.svelte

@@ -31,10 +31,13 @@
 	{channel}
 	edit={true}
 	{onUpdate}
-	onSubmit={async ({ name, access_control }) => {
+	onSubmit={async ({ name, is_private, access_control, group_ids, user_ids }) => {
 		const res = await updateChannelById(localStorage.token, channel.id, {
 			name,
-			access_control
+			is_private,
+			access_control,
+			group_ids,
+			user_ids
 		}).catch((error) => {
 			toast.error(error.message);
 		});
@@ -119,7 +122,7 @@
 					{/if}
 				{:else}
 					<div class=" size-4 justify-center flex items-center ml-1">
-						{#if channel?.access_control === null}
+						{#if channel?.type === 'group' ? !channel?.is_private : channel?.access_control === null}
 							<Hashtag className="size-3.5" strokeWidth="2.5" />
 						{:else}
 							<Lock className="size-[15px]" strokeWidth="2" />
@@ -154,7 +157,7 @@
 		</div>
 	</a>
 
-	{#if channel?.type === 'dm'}
+	{#if ['dm'].includes(channel?.type)}
 		<div
 			class="ml-0.5 mr-1 invisible group-hover:visible self-center flex items-center dark:text-gray-300"
 		>
@@ -181,7 +184,7 @@
 				<XMark className="size-3.5" />
 			</button>
 		</div>
-	{:else if $user?.role === 'admin'}
+	{:else if $user?.role === 'admin' || channel.user_id === $user?.id}
 		<div
 			class="ml-0.5 mr-1 invisible group-hover:visible self-center flex items-center dark:text-gray-300"
 		>

src/lib/components/layout/Sidebar/ChannelModal.svelte

@@ -1,18 +1,22 @@
 <script lang="ts">
 	import { getContext, createEventDispatcher, onMount } from 'svelte';
+	const i18n = getContext('i18n');
+
+	import { toast } from 'svelte-sonner';
+	import { page } from '$app/stores';
+	import { goto } from '$app/navigation';
+
 	import { createNewChannel, deleteChannelById } from '$lib/apis/channels';
+	import { user } from '$lib/stores';
 
 	import Spinner from '$lib/components/common/Spinner.svelte';
 	import Modal from '$lib/components/common/Modal.svelte';
 	import AccessControl from '$lib/components/workspace/common/AccessControl.svelte';
 	import DeleteConfirmDialog from '$lib/components/common/ConfirmDialog.svelte';
 	import XMark from '$lib/components/icons/XMark.svelte';
-
+	import MemberSelector from '$lib/components/workspace/common/MemberSelector.svelte';
-	import { toast } from 'svelte-sonner';
+	import Visibility from '$lib/components/workspace/common/Visibility.svelte';
-	import { page } from '$app/stores';
+	import Tooltip from '$lib/components/common/Tooltip.svelte';
-	import { goto } from '$app/navigation';
-	import UserListSelector from '$lib/components/workspace/common/UserListSelector.svelte';
-	const i18n = getContext('i18n');
 
 	export let show = false;
 	export let onSubmit: Function = () => {};
@@ -21,10 +25,14 @@
 	export let channel = null;
 	export let edit = false;
 
+	let channelTypes = ['group', 'dm'];
 	let type = '';
 	let name = '';
 
+	let isPrivate = null;
 	let accessControl = {};
+
+	let groupIds = [];
 	let userIds = [];
 
 	let loading = false;
@@ -33,12 +41,26 @@
 		name = name.replace(/\s/g, '-').toLocaleLowerCase();
 	}
 
+	$: onTypeChange(type);
+
+	const onTypeChange = (type) => {
+		if (type === 'group') {
+			if (isPrivate === null) {
+				isPrivate = true;
+			}
+		} else {
+			isPrivate = null;
+		}
+	};
+
 	const submitHandler = async () => {
 		loading = true;
 		await onSubmit({
 			type: type,
 			name: name.replace(/\s/g, '-'),
-			access_control: accessControl,
+			is_private: type === 'group' ? isPrivate : null,
+			access_control: type === '' ? accessControl : {},
+			group_ids: groupIds,
 			user_ids: userIds
 		});
 		show = false;
@@ -46,16 +68,24 @@
 	};
 
 	const init = () => {
-		type = channel?.type ?? '';
+		if ($user?.role === 'admin') {
-		name = channel?.name ?? '';
+			channelTypes = ['', 'group', 'dm'];
-		accessControl = channel.access_control;
+		} else {
-		userIds = channel?.user_ids ?? [];
+			channelTypes = ['group', 'dm'];
+		}
+
+		type = channel?.type ?? channelTypes[0];
+
+		if (channel) {
+			name = channel?.name ?? '';
+			isPrivate = channel?.is_private ?? null;
+			accessControl = channel.access_control;
+			userIds = channel?.user_ids ?? [];
+		}
 	};
 
 	$: if (show) {
-		if (channel) {
+		init();
-			init();
-		}
 	} else {
 		resetHandler();
 	}
@@ -119,21 +149,51 @@
 					}}
 				>
 					{#if !edit}
-						<div class="flex flex-col w-full mt-2">
+						<div class="flex flex-col w-full mt-2 mb-1">
 							<div class=" mb-1 text-xs text-gray-500">{$i18n.t('Channel Type')}</div>
 
 							<div class="flex-1">
-								<select
+								<Tooltip
-									class="w-full text-sm bg-transparent placeholder:text-gray-300 dark:placeholder:text-gray-700 outline-hidden"
+									content={type === 'dm'
-									bind:value={type}
+										? $i18n.t('A private conversation between you and selected users')
+										: type === 'group'
+											? $i18n.t('A collaboration channel where people join as members')
+											: $i18n.t(
+													'A discussion channel where access is controlled by groups and permissions'
+												)}
+									placement="top-start"
 								>
-									<option value="">{$i18n.t('Channel')}</option>
+									<select
-									<option value="dm">{$i18n.t('Direct Message')}</option>
+										class="w-full text-sm bg-transparent placeholder:text-gray-300 dark:placeholder:text-gray-700 outline-hidden"
-								</select>
+										bind:value={type}
+									>
+										{#each channelTypes as channelType, channelTypeIdx (channelType)}
+											<option value={channelType} selected={channelTypeIdx === 0}>
+												{#if channelType === 'group'}
+													{$i18n.t('Group Channel')}
+												{:else if channelType === 'dm'}
+													{$i18n.t('Direct Message')}
+												{:else if channelType === ''}
+													{$i18n.t('Channel')}
+												{/if}
+											</option>
+										{/each}
+									</select>
+								</Tooltip>
 							</div>
 						</div>
 					{/if}
 
+					<div class=" text-gray-300 dark:text-gray-700 text-xs">
+						{#if type === ''}
+							{$i18n.t('Discussion channel where access is based on groups and permissions')}
+						{:else if type === 'group'}
+							{$i18n.t('Collaboration channel where people join as members')}
+						{:else if type === 'dm'}
+							{$i18n.t('Private conversation between selected users')}
+						{/if}
+					</div>
+
 					<div class="flex flex-col w-full mt-2">
 						<div class=" mb-1 text-xs text-gray-500">
 							{$i18n.t('Channel Name')}
@@ -154,17 +214,31 @@
 						</div>
 					</div>
 
-					<hr class=" border-gray-100/40 dark:border-gray-700/10 my-2.5 w-full" />
+					{#if type !== 'dm'}
-
+						<div class="-mx-2 mb-1 mt-2.5 px-2">
-					<div class="-mx-2">
+							{#if type === ''}
-						{#if type === 'dm'}
-							<UserListSelector bind:userIds />
-						{:else}
-							<div class="px-4 py-3 bg-gray-50 dark:bg-gray-950 rounded-3xl">
 								<AccessControl bind:accessControl accessRoles={['read', 'write']} />
-							</div>
+							{:else if type === 'group'}
-						{/if}
+								<Visibility
-					</div>
+									state={isPrivate ? 'private' : 'public'}
+									onChange={(value) => {
+										if (value === 'private') {
+											isPrivate = true;
+										} else {
+											isPrivate = false;
+										}
+										console.log(value, isPrivate);
+									}}
+								/>
+							{/if}
+						</div>
+					{/if}
+
+					{#if type !== ''}
+						<div class="">
+							<MemberSelector bind:userIds includeGroups={type !== 'dm'} />
+						</div>
+					{/if}
 
 					<div class="flex justify-end pt-3 text-sm font-medium gap-1.5">
 						{#if edit}

src/lib/components/workspace/common/MemberSelector.svelte

@@ -0,0 +1,269 @@
+<script lang="ts">
+	import { toast } from 'svelte-sonner';
+	import { getContext, onMount } from 'svelte';
+
+	const i18n = getContext('i18n');
+
+	import { user as _user } from '$lib/stores';
+	import { getUserById, searchUsers } from '$lib/apis/users';
+	import { WEBUI_API_BASE_URL } from '$lib/constants';
+
+	import XMark from '$lib/components/icons/XMark.svelte';
+	import Pagination from '$lib/components/common/Pagination.svelte';
+	import ProfilePreview from '$lib/components/channel/Messages/Message/ProfilePreview.svelte';
+	import Tooltip from '$lib/components/common/Tooltip.svelte';
+	import ChevronUp from '$lib/components/icons/ChevronUp.svelte';
+	import ChevronDown from '$lib/components/icons/ChevronDown.svelte';
+	import Spinner from '$lib/components/common/Spinner.svelte';
+	import Checkbox from '$lib/components/common/Checkbox.svelte';
+	import { getGroups } from '$lib/apis/groups';
+
+	export let onChange: Function = () => {};
+
+	export let includeGroups = true;
+	export let pagination = false;
+
+	export let groupIds = [];
+	export let userIds = [];
+
+	let groups = null;
+	let filteredGroups = [];
+
+	$: filteredGroups = groups
+		? groups.filter((group) => group.name.toLowerCase().includes(query.toLowerCase()))
+		: [];
+
+	let selectedUsers = {};
+
+	let page = 1;
+	let users = null;
+	let total = null;
+
+	let query = '';
+	let orderBy = 'name'; // default sort key
+	let direction = 'asc'; // default sort order
+
+	const setSortKey = (key) => {
+		if (orderBy === key) {
+			direction = direction === 'asc' ? 'desc' : 'asc';
+		} else {
+			orderBy = key;
+			direction = 'asc';
+		}
+	};
+
+	const getUserList = async () => {
+		try {
+			const res = await searchUsers(localStorage.token, query, orderBy, direction, page).catch(
+				(error) => {
+					toast.error(`${error}`);
+					return null;
+				}
+			);
+
+			if (res) {
+				users = res.users;
+				total = res.total;
+			}
+		} catch (err) {
+			console.error(err);
+		}
+	};
+
+	$: if (page !== null && query !== null && orderBy !== null && direction !== null) {
+		getUserList();
+	}
+
+	onMount(async () => {
+		groups = await getGroups(localStorage.token, true);
+		if (userIds.length > 0) {
+			userIds.forEach(async (id) => {
+				const res = await getUserById(localStorage.token, id).catch((error) => {
+					console.error(error);
+					return null;
+				});
+				if (res) {
+					selectedUsers[id] = res;
+				}
+			});
+		}
+	});
+</script>
+
+<div class="">
+	{#if users === null || total === null}
+		<div class="my-10">
+			<Spinner className="size-5" />
+		</div>
+	{:else}
+		{#if userIds.length > 0}
+			<div class="mx-1 mb-1.5">
+				<div class="text-xs text-gray-500 mx-0.5 mb-1">
+					{userIds.length}
+					{$i18n.t('users')}
+				</div>
+				<div class="flex gap-1 flex-wrap">
+					{#each userIds as id}
+						{#if selectedUsers[id]}
+							<button
+								type="button"
+								class="inline-flex items-center space-x-1 px-2 py-1 bg-gray-100/50 dark:bg-gray-850 rounded-lg text-xs"
+								on:click={() => {
+									userIds = userIds.filter((uid) => uid !== id);
+									delete selectedUsers[id];
+								}}
+							>
+								<div>
+									{selectedUsers[id].name}
+								</div>
+
+								<div>
+									<XMark className="size-3" />
+								</div>
+							</button>
+						{/if}
+					{/each}
+				</div>
+			</div>
+		{/if}
+
+		<div class="flex gap-1 -mx-0.5 my-1.5">
+			<div class=" flex w-full space-x-2">
+				<div class="flex flex-1">
+					<div class=" self-center ml-1 mr-3">
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							viewBox="0 0 20 20"
+							fill="currentColor"
+							class="w-4 h-4"
+						>
+							<path
+								fill-rule="evenodd"
+								d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z"
+								clip-rule="evenodd"
+							/>
+						</svg>
+					</div>
+					<input
+						class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent"
+						bind:value={query}
+						placeholder={$i18n.t('Search')}
+					/>
+				</div>
+			</div>
+		</div>
+
+		{#if users.length > 0}
+			<div class="scrollbar-hidden relative whitespace-nowrap w-full max-w-full">
+				<div class=" text-sm text-left text-gray-500 dark:text-gray-400 w-full max-w-full">
+					<div class="w-full max-h-96 overflow-y-auto rounded-lg">
+						{#if includeGroups && filteredGroups.length > 0}
+							<div class="text-xs text-gray-500 mb-1 mx-1">
+								{$i18n.t('Groups')}
+							</div>
+
+							<div class="mb-3">
+								{#each filteredGroups as group, groupIdx (group.id)}
+									<button
+										class=" dark:border-gray-850 text-xs flex items-center justify-between w-full"
+										type="button"
+										on:click={() => {
+											if ((groupIds ?? []).includes(group.id)) {
+												groupIds = groupIds.filter((id) => id !== group.id);
+											} else {
+												groupIds = [...groupIds, group.id];
+											}
+											onChange(groupIds);
+										}}
+									>
+										<div class="px-3 py-1.5 font-medium text-gray-900 dark:text-white flex-1">
+											<div class="flex items-center gap-2">
+												<Tooltip content={group.name} placement="top-start">
+													<div class="font-medium truncate flex items-center gap-1">
+														{group.name} <span class="text-gray-500">{group.member_count}</span>
+													</div>
+												</Tooltip>
+											</div>
+										</div>
+
+										<div class="px-3 py-1">
+											<div class=" translate-y-0.5">
+												<Checkbox
+													state={(groupIds ?? []).includes(group.id) ? 'checked' : 'unchecked'}
+												/>
+											</div>
+										</div>
+									</button>
+								{/each}
+							</div>
+						{/if}
+
+						<div class="text-xs text-gray-500 mb-1 mx-1">
+							{$i18n.t('Users')}
+						</div>
+
+						<div>
+							{#each users as user, userIdx (user.id)}
+								{#if user?.id !== $_user?.id}
+									<button
+										class=" dark:border-gray-850 text-xs flex items-center justify-between w-full"
+										type="button"
+										on:click={() => {
+											if ((userIds ?? []).includes(user.id)) {
+												userIds = userIds.filter((id) => id !== user.id);
+												delete selectedUsers[user.id];
+											} else {
+												userIds = [...userIds, user.id];
+												selectedUsers[user.id] = user;
+											}
+											onChange(userIds);
+										}}
+									>
+										<div class="px-3 py-1.5 font-medium text-gray-900 dark:text-white flex-1">
+											<div class="flex items-center gap-2">
+												<ProfilePreview {user} side="right" align="center" sideOffset={6}>
+													<img
+														class="rounded-2xl w-6 h-6 object-cover flex-shrink-0"
+														src={`${WEBUI_API_BASE_URL}/users/${user.id}/profile/image`}
+														alt="user"
+													/>
+												</ProfilePreview>
+												<Tooltip content={user.email} placement="top-start">
+													<div class="font-medium truncate">{user.name}</div>
+												</Tooltip>
+
+												{#if user?.is_active}
+													<div>
+														<span class="relative flex size-1.5">
+															<span
+																class="absolute inline-flex h-full w-full animate-ping rounded-full bg-green-400 opacity-75"
+															></span>
+															<span class="relative inline-flex size-1.5 rounded-full bg-green-500"
+															></span>
+														</span>
+													</div>
+												{/if}
+											</div>
+										</div>
+
+										<div class="px-3 py-1">
+											<div class=" translate-y-0.5">
+												<Checkbox
+													state={(userIds ?? []).includes(user.id) ? 'checked' : 'unchecked'}
+												/>
+											</div>
+										</div>
+									</button>
+								{/if}
+							{/each}
+						</div>
+					</div>
+				</div>
+			</div>
+		{:else}
+			<div class="text-gray-500 text-xs text-center py-5 px-10">
+				{$i18n.t('No users were found.')}
+			</div>
+		{/if}
+	{/if}
+</div>

src/lib/components/workspace/common/UserListSelector.svelte

@@ -1,247 +0,0 @@
-<script lang="ts">
-	import { toast } from 'svelte-sonner';
-	import { getContext, onMount } from 'svelte';
-
-	const i18n = getContext('i18n');
-
-	import { user as _user } from '$lib/stores';
-	import { getUserById, getUsers } from '$lib/apis/users';
-	import { WEBUI_API_BASE_URL } from '$lib/constants';
-
-	import XMark from '$lib/components/icons/XMark.svelte';
-	import Pagination from '$lib/components/common/Pagination.svelte';
-	import ProfilePreview from '$lib/components/channel/Messages/Message/ProfilePreview.svelte';
-	import Tooltip from '$lib/components/common/Tooltip.svelte';
-	import ChevronUp from '$lib/components/icons/ChevronUp.svelte';
-	import ChevronDown from '$lib/components/icons/ChevronDown.svelte';
-	import Spinner from '$lib/components/common/Spinner.svelte';
-	import Checkbox from '$lib/components/common/Checkbox.svelte';
-
-	export let onChange: Function = () => {};
-	export let userIds = [];
-
-	export let pagination = false;
-
-	let selectedUsers = {};
-
-	let page = 1;
-	let users = null;
-	let total = null;
-
-	let query = '';
-	let orderBy = 'name'; // default sort key
-	let direction = 'asc'; // default sort order
-
-	const setSortKey = (key) => {
-		if (orderBy === key) {
-			direction = direction === 'asc' ? 'desc' : 'asc';
-		} else {
-			orderBy = key;
-			direction = 'asc';
-		}
-	};
-
-	const getUserList = async () => {
-		try {
-			const res = await getUsers(localStorage.token, query, orderBy, direction, page).catch(
-				(error) => {
-					toast.error(`${error}`);
-					return null;
-				}
-			);
-
-			if (res) {
-				users = res.users;
-				total = res.total;
-			}
-		} catch (err) {
-			console.error(err);
-		}
-	};
-
-	$: if (page !== null && query !== null && orderBy !== null && direction !== null) {
-		getUserList();
-	}
-
-	onMount(() => {
-		if (userIds.length > 0) {
-			userIds.forEach(async (id) => {
-				const res = await getUserById(localStorage.token, id).catch((error) => {
-					console.error(error);
-					return null;
-				});
-				if (res) {
-					selectedUsers[id] = res;
-				}
-			});
-		}
-	});
-</script>
-
-<div class="">
-	{#if users === null || total === null}
-		<div class="my-10">
-			<Spinner className="size-5" />
-		</div>
-	{:else}
-		{#if userIds.length > 0}
-			<div class="mx-1 mb-1.5">
-				<div class="text-xs text-gray-500 mx-0.5 mb-1">
-					{userIds.length}
-					{$i18n.t('users')}
-				</div>
-				<div class="flex gap-1 flex-wrap">
-					{#each userIds as id}
-						{#if selectedUsers[id]}
-							<button
-								type="button"
-								class="inline-flex items-center space-x-1 px-2 py-1 bg-gray-100/50 dark:bg-gray-850 rounded-lg text-xs"
-								on:click={() => {
-									userIds = userIds.filter((uid) => uid !== id);
-									delete selectedUsers[id];
-								}}
-							>
-								<div>
-									{selectedUsers[id].name}
-								</div>
-
-								<div>
-									<XMark className="size-3" />
-								</div>
-							</button>
-						{/if}
-					{/each}
-				</div>
-			</div>
-		{/if}
-
-		<div class="flex gap-1 px-0.5">
-			<div class=" flex w-full space-x-2">
-				<div class="flex flex-1">
-					<div class=" self-center ml-1 mr-3">
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							viewBox="0 0 20 20"
-							fill="currentColor"
-							class="w-4 h-4"
-						>
-							<path
-								fill-rule="evenodd"
-								d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z"
-								clip-rule="evenodd"
-							/>
-						</svg>
-					</div>
-					<input
-						class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent"
-						bind:value={query}
-						placeholder={$i18n.t('Search')}
-					/>
-				</div>
-			</div>
-		</div>
-
-		{#if users.length > 0}
-			<div class="scrollbar-hidden relative whitespace-nowrap w-full max-w-full">
-				<div class=" text-sm text-left text-gray-500 dark:text-gray-400 w-full max-w-full">
-					<div
-						class="text-xs text-gray-800 uppercase bg-transparent dark:text-gray-200 w-full mb-0.5"
-					>
-						<div
-							class=" border-b-[1.5px] border-gray-50/50 dark:border-gray-800/10 flex items-center justify-between"
-						>
-							<button
-								type="button"
-								class="px-2.5 py-2 cursor-pointer select-none"
-								on:click={() => setSortKey('name')}
-							>
-								<div class="flex gap-1.5 items-center">
-									{$i18n.t('Name')}
-
-									{#if orderBy === 'name'}
-										<span class="font-normal"
-											>{#if direction === 'asc'}
-												<ChevronUp className="size-2" />
-											{:else}
-												<ChevronDown className="size-2" />
-											{/if}
-										</span>
-									{:else}
-										<span class="invisible">
-											<ChevronUp className="size-2" />
-										</span>
-									{/if}
-								</div>
-							</button>
-						</div>
-					</div>
-					<div class="w-full">
-						{#each users as user, userIdx}
-							{#if user?.id !== $_user?.id}
-								<button
-									class=" dark:border-gray-850 text-xs flex items-center justify-between w-full"
-									type="button"
-									on:click={() => {
-										if ((userIds ?? []).includes(user.id)) {
-											userIds = userIds.filter((id) => id !== user.id);
-											delete selectedUsers[user.id];
-										} else {
-											userIds = [...userIds, user.id];
-											selectedUsers[user.id] = user;
-										}
-										onChange(userIds);
-									}}
-								>
-									<div class="px-3 py-1.5 font-medium text-gray-900 dark:text-white flex-1">
-										<div class="flex items-center gap-2">
-											<ProfilePreview {user} side="right" align="center" sideOffset={6}>
-												<img
-													class="rounded-2xl w-6 h-6 object-cover flex-shrink-0"
-													src={`${WEBUI_API_BASE_URL}/users/${user.id}/profile/image`}
-													alt="user"
-												/>
-											</ProfilePreview>
-											<Tooltip content={user.email} placement="top-start">
-												<div class="font-medium truncate">{user.name}</div>
-											</Tooltip>
-
-											{#if user?.is_active}
-												<div>
-													<span class="relative flex size-1.5">
-														<span
-															class="absolute inline-flex h-full w-full animate-ping rounded-full bg-green-400 opacity-75"
-														></span>
-														<span class="relative inline-flex size-1.5 rounded-full bg-green-500"
-														></span>
-													</span>
-												</div>
-											{/if}
-										</div>
-									</div>
-
-									<div class="px-3 py-1">
-										<div class=" translate-y-0.5">
-											<Checkbox
-												state={(userIds ?? []).includes(user.id) ? 'checked' : 'unchecked'}
-											/>
-										</div>
-									</div>
-								</button>
-							{/if}
-						{/each}
-					</div>
-				</div>
-			</div>
-
-			{#if pagination}
-				{#if total > 30}
-					<Pagination bind:page count={total} perPage={30} />
-				{/if}
-			{/if}
-		{:else}
-			<div class="text-gray-500 text-xs text-center py-5 px-10">
-				{$i18n.t('No users were found.')}
-			</div>
-		{/if}
-	{/if}
-</div>

src/lib/components/workspace/common/Visibility.svelte

@@ -68,9 +68,9 @@
 
 				<div class=" text-xs text-gray-400 font-medium">
 					{#if state === 'private'}
-						{$i18n.t('Only select users and groups with permission can access')}
+						{$i18n.t('Only invited users can access')}
 					{:else}
-						{$i18n.t('Accessible to all users')}
+						{$i18n.t('Visible to all users')}
 					{/if}
 				</div>
 			</div>