merge upstream

.gitignore

@@ -308,4 +308,4 @@ cypress/videos
 cypress/screenshots
 .vscode/settings.json
 
-webui.db
+webui.db

backend/open_webui/models/messages.py

@@ -189,9 +189,11 @@ class MessageTable:
                 .all()
             )
 
-            return [
-                MessageModel.model_validate(message) for message in all_messages
-            ] + [MessageModel.model_validate(message)]
+            # If length of all_messages is less than limit, then add the parent message
+            if len(all_messages) < limit:
+                all_messages.append(message)
+
+            return [MessageModel.model_validate(message) for message in all_messages]
 
     def update_message_by_id(
         self, id: str, form_data: MessageForm

backend/open_webui/routers/tasks.py

@@ -499,8 +499,8 @@ async def generate_moa_response(
         "model": task_model_id,
         "messages": [{"role": "user", "content": content}],
         "stream": form_data.get("stream", False),
-        "chat_id": form_data.get("chat_id", None),
         "metadata": {
+            "chat_id": form_data.get("chat_id", None),
             "task": str(TASKS.MOA_RESPONSE_GENERATION),
             "task_body": form_data,
         },

backend/requirements.txt

@@ -105,4 +105,4 @@ googleapis-common-protos==1.63.2
 ## LDAP
 ldap3==2.9.1
 
-gnupg
+gnupg

src/lib/components/NotificationToast.svelte

@@ -12,6 +12,10 @@
 	export let content: string;
 
 	onMount(() => {
+		if (!navigator.userActivation.hasBeenActive) {
+			return;
+		}
+
 		if ($settings?.notificationSound ?? true) {
 			const audio = new Audio(`/audio/notification.mp3`);
 			audio.play();

src/lib/components/channel/Messages/Message.svelte

@@ -178,7 +178,7 @@
 			<div class="flex-auto w-0 pl-1">
 				{#if showUserProfile}
 					<Name>
-						<div class=" self-end text-base font-medium">
+						<div class=" self-end text-base shrink-0 font-medium truncate">
 							{message?.user?.name}
 						</div>
 
@@ -189,7 +189,7 @@
 								<Tooltip
 									content={dayjs(message.created_at / 1000000).format('dddd, DD MMMM YYYY HH:mm')}
 								>
-									{formatDate(message.created_at / 1000000)}
+									<span class="line-clamp-1">{formatDate(message.created_at / 1000000)}</span>
 								</Tooltip>
 							</div>
 						{/if}

src/lib/components/channel/Messages/Message/ReactionPicker.svelte

@@ -61,13 +61,13 @@
 				);
 			}
 		});
-		// Group emojis into rows of 6
+		// Group emojis into rows of 8
 		emojiRows = [];
 		let currentRow = [];
 		flattenedEmojis.forEach((item) => {
 			if (item.type === 'emoji') {
 				currentRow.push(item);
-				if (currentRow.length === 7) {
+				if (currentRow.length === 8) {
 					emojiRows.push(currentRow);
 					currentRow = [];
 				}
@@ -126,7 +126,7 @@
 			{#if emojiRows.length === 0}
 				<div class="text-center text-xs text-gray-500 dark:text-gray-400">No results</div>
 			{:else}
-				<div class="w-full flex ml-2">
+				<div class="w-full flex ml-0.5">
 					<VirtualList rowHeight={ROW_HEIGHT} items={emojiRows} height={384} let:item>
 						<div class="w-full">
 							{#if item.length === 1 && item[0].type === 'group'}
@@ -136,7 +136,7 @@
 								</div>
 							{:else}
 								<!-- Render emojis in a row -->
-								<div class="flex items-center gap-2 w-full">
+								<div class="flex items-center gap-1.5 w-full">
 									{#each item as emojiItem}
 										<Tooltip
 											content={emojiItem.shortCodes.map((code) => `:${code}:`).join(', ')}

src/lib/components/chat/Messages/ResponseMessage.svelte

@@ -489,11 +489,15 @@
 
 		<div class="flex-auto w-0 pl-1">
 			<Name>
-				{model?.name ?? message.model}
+				<Tooltip content={model?.name ?? message.model} placement="top-start">
+					<span class="line-clamp-1">
+						{model?.name ?? message.model}
+					</span>
+				</Tooltip>
 
 				{#if message.timestamp}
 					<span
-						class=" self-center invisible group-hover:visible text-gray-400 text-xs font-medium uppercase ml-0.5 -mt-0.5"
+						class=" self-center shrink-0 translate-y-0.5 invisible group-hover:visible text-gray-400 text-xs font-medium uppercase ml-0.5 -mt-0.5"
 					>
 						{dayjs(message.timestamp * 1000).format($i18n.t('h:mm a'))}
 					</span>

src/lib/components/layout/Sidebar.svelte

@@ -578,82 +578,6 @@
 				? 'opacity-20'
 				: ''}"
 		>
-			{#if !search && $pinnedChats.length > 0}
-				<div class="flex flex-col space-y-1 rounded-xl">
-					<Folder
-						className="px-2"
-						bind:open={showPinnedChat}
-						on:change={(e) => {
-							localStorage.setItem('showPinnedChat', e.detail);
-							console.log(e.detail);
-						}}
-						on:import={(e) => {
-							importChatHandler(e.detail, true);
-						}}
-						on:drop={async (e) => {
-							const { type, id, item } = e.detail;
-
-							if (type === 'chat') {
-								let chat = await getChatById(localStorage.token, id).catch((error) => {
-									return null;
-								});
-								if (!chat && item) {
-									chat = await importChat(localStorage.token, item.chat, item?.meta ?? {});
-								}
-
-								if (chat) {
-									console.log(chat);
-									if (chat.folder_id) {
-										const res = await updateChatFolderIdById(
-											localStorage.token,
-											chat.id,
-											null
-										).catch((error) => {
-											toast.error(error);
-											return null;
-										});
-									}
-
-									if (!chat.pinned) {
-										const res = await toggleChatPinnedStatusById(localStorage.token, chat.id);
-									}
-
-									initChatList();
-								}
-							}
-						}}
-						name={$i18n.t('Pinned')}
-					>
-						<div
-							class="ml-3 pl-1 mt-[1px] flex flex-col overflow-y-auto scrollbar-hidden border-s border-gray-100 dark:border-gray-900"
-						>
-							{#each $pinnedChats as chat, idx}
-								<ChatItem
-									className=""
-									id={chat.id}
-									title={chat.title}
-									{shiftKey}
-									selected={selectedChatId === chat.id}
-									on:select={() => {
-										selectedChatId = chat.id;
-									}}
-									on:unselect={() => {
-										selectedChatId = null;
-									}}
-									on:change={async () => {
-										initChatList();
-									}}
-									on:tag={(e) => {
-										const { type, name } = e.detail;
-										tagEventHandler(type, name, chat.id);
-									}}
-								/>
-							{/each}
-						</div>
-					</Folder>
-				</div>
-			{/if}
-
 			{#if $config?.features?.enable_channels && ($user.role === 'admin' || $channels.length > 0) && !search}
 				<Folder
 					className="px-2 mt-0.5"
@@ -677,22 +601,6 @@
 				</Folder>
 			{/if}
 
-			{#if !search && folders}
-				<Folders
-					{folders}
-					on:import={(e) => {
-						const { folderId, items } = e.detail;
-						importChatHandler(items, false, folderId);
-					}}
-					on:update={async (e) => {
-						initChatList();
-					}}
-					on:change={async () => {
-						initChatList();
-					}}
-				/>
-			{/if}
-
 			<Folder
 				collapsible={!search}
 				className="px-2 mt-0.5"
@@ -750,6 +658,98 @@
 					<div class="absolute z-40 w-full h-full flex justify-center"></div>
 				{/if}
 
+				{#if !search && $pinnedChats.length > 0}
+					<div class="flex flex-col space-y-1 rounded-xl">
+						<Folder
+							className="px-2"
+							bind:open={showPinnedChat}
+							on:change={(e) => {
+								localStorage.setItem('showPinnedChat', e.detail);
+								console.log(e.detail);
+							}}
+							on:import={(e) => {
+								importChatHandler(e.detail, true);
+							}}
+							on:drop={async (e) => {
+								const { type, id, item } = e.detail;
+
+								if (type === 'chat') {
+									let chat = await getChatById(localStorage.token, id).catch((error) => {
+										return null;
+									});
+									if (!chat && item) {
+										chat = await importChat(localStorage.token, item.chat, item?.meta ?? {});
+									}
+
+									if (chat) {
+										console.log(chat);
+										if (chat.folder_id) {
+											const res = await updateChatFolderIdById(
+												localStorage.token,
+												chat.id,
+												null
+											).catch((error) => {
+												toast.error(error);
+												return null;
+											});
+										}
+
+										if (!chat.pinned) {
+											const res = await toggleChatPinnedStatusById(localStorage.token, chat.id);
+										}
+
+										initChatList();
+									}
+								}
+							}}
+							name={$i18n.t('Pinned')}
+						>
+							<div
+								class="ml-3 pl-1 mt-[1px] flex flex-col overflow-y-auto scrollbar-hidden border-s border-gray-100 dark:border-gray-900"
+							>
+								{#each $pinnedChats as chat, idx}
+									<ChatItem
+										className=""
+										id={chat.id}
+										title={chat.title}
+										{shiftKey}
+										selected={selectedChatId === chat.id}
+										on:select={() => {
+											selectedChatId = chat.id;
+										}}
+										on:unselect={() => {
+											selectedChatId = null;
+										}}
+										on:change={async () => {
+											initChatList();
+										}}
+										on:tag={(e) => {
+											const { type, name } = e.detail;
+											tagEventHandler(type, name, chat.id);
+										}}
+									/>
+								{/each}
+							</div>
+						</Folder>
+					</div>
+				{/if}
+
+				{#if !search && folders}
+					<Folders
+						{folders}
+						on:import={(e) => {
+							const { folderId, items } = e.detail;
+							importChatHandler(items, false, folderId);
+						}}
+						on:update={async (e) => {
+							initChatList();
+						}}
+						on:change={async () => {
+							initChatList();
+						}}
+					/>
+				{/if}
+
 				<div class=" flex-1 flex flex-col overflow-y-auto scrollbar-hidden">
 					<div class="pt-1.5">
 						{#if $chats}