Fix unreadable user markdown colors and truncate long texts in deletion dialogs ...

* webui: limit conversation name length in dialogs

* webui: fix unreadable colors on links and table cell hover in user markdown

* webui: keep table borders visible in user markdown

* webui: updating unified exports

* Update tools/server/webui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentThumbnailFile.svelte

Co-authored-by: Aleksander Grygier <redacted>
* chore: update webui build output

* chore: update webui build output

* chore: update webui build output

---------

Co-authored-by: Aleksander Grygier <redacted>

diff --git a/tools/server/public/index.html.gz b/tools/server/public/index.html.gz
index 1834d1d91f46fcdaa39f2ccff19e82ee2a2479f3..036feff1c3e182484fa80cc64e53e386a4560558 100644 (file)
Binary files a/tools/server/public/index.html.gz and b/tools/server/public/index.html.gz differ

diff --git a/tools/server/webui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentThumbnailFile.svelte b/tools/server/webui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentThumbnailFile.svelte
index 6fdd8572142d0126d5ebdcccd9d604ee21d2d959..908db5894bbfa6a1b6e03e41019aa6fa442ff4fc 100644 (file)
--- a/tools/server/webui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentThumbnailFile.svelte
+++ b/tools/server/webui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentThumbnailFile.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
        import { RemoveButton } from '$lib/components/app';
-       import { getFileTypeLabel, getPreviewText, formatFileSize, isTextFile } from '$lib/utils';
+       import { formatFileSize, getFileTypeLabel, getPreviewText, isTextFile } from '$lib/utils';
        import { AttachmentType } from '$lib/enums';
 
        interface Props {

diff --git a/tools/server/webui/src/lib/components/app/chat/ChatSidebar/ChatSidebar.svelte b/tools/server/webui/src/lib/components/app/chat/ChatSidebar/ChatSidebar.svelte
index 1d313e284e1dfd320babdc4ade50706bab478d7b..aa0c27f6d391d726162f583c80528d370e35e38b 100644 (file)
--- a/tools/server/webui/src/lib/components/app/chat/ChatSidebar/ChatSidebar.svelte
+++ b/tools/server/webui/src/lib/components/app/chat/ChatSidebar/ChatSidebar.svelte
@@ -9,6 +9,7 @@
        import Input from '$lib/components/ui/input/input.svelte';
        import { conversationsStore, conversations } from '$lib/stores/conversations.svelte';
        import { chatStore } from '$lib/stores/chat.svelte';
+       import { getPreviewText } from '$lib/utils/text';
        import ChatSidebarActions from './ChatSidebarActions.svelte';
 
        const sidebar = Sidebar.useSidebar();
@@ -20,6 +21,9 @@
        let showEditDialog = $state(false);
        let selectedConversation = $state<DatabaseConversation | null>(null);
        let editedName = $state('');
+       let selectedConversationNamePreview = $derived.by(() =>
+               selectedConversation ? getPreviewText(selectedConversation.name) : ''
+       );
 
        let filteredConversations = $derived.by(() => {
                if (searchQuery.trim().length > 0) {
@@ -162,7 +166,7 @@
        bind:open={showDeleteDialog}
        title="Delete Conversation"
        description={selectedConversation
-               ? `Are you sure you want to delete "${selectedConversation.name}"? This action cannot be undone and will permanently remove all messages in this conversation.`
+               ? `Are you sure you want to delete "${selectedConversationNamePreview}"? This action cannot be undone and will permanently remove all messages in this conversation.`
                : ''}
        confirmText="Delete"
        cancelText="Cancel"

diff --git a/tools/server/webui/src/lib/components/app/misc/MarkdownContent.svelte b/tools/server/webui/src/lib/components/app/misc/MarkdownContent.svelte
index 9c37bde0d493848f24577f6af672661b30f1dc5e..2a4a39535e0b45bd7d7ac9f728ed2e8896113675 100644 (file)
--- a/tools/server/webui/src/lib/components/app/misc/MarkdownContent.svelte
+++ b/tools/server/webui/src/lib/components/app/misc/MarkdownContent.svelte
@@ -504,6 +504,14 @@
                background: hsl(var(--muted) / 0.1);
        }
 
+       /* User message markdown should keep table borders visible on light primary backgrounds */
+       div.markdown-user-content :global(table),
+       div.markdown-user-content :global(th),
+       div.markdown-user-content :global(td),
+       div.markdown-user-content :global(.table-wrapper) {
+               border-color: currentColor;
+       }
+
        /* Horizontal rules */
        div :global(hr) {
                border: none;
@@ -642,6 +650,21 @@
                background: var(--muted);
        }
 
+       /* Disable hover effects when rendering user messages */
+       .markdown-user-content :global(a),
+       .markdown-user-content :global(a:hover) {
+               color: var(--primary-foreground);
+       }
+
+       .markdown-user-content :global(table:hover) {
+               box-shadow: none;
+       }
+
+       .markdown-user-content :global(th:hover),
+       .markdown-user-content :global(td:hover) {
+               background: inherit;
+       }
+
        /* Enhanced blockquotes */
        div :global(blockquote) {
                transition: all 0.2s ease;

diff --git a/tools/server/webui/src/lib/utils/file-preview.ts b/tools/server/webui/src/lib/utils/file-preview.ts
index 115f8727a979005581d22e8baa8bb2b0f52bc290..26a60533ae6fc986f809a4446629785356c47c2f 100644 (file)
--- a/tools/server/webui/src/lib/utils/file-preview.ts
+++ b/tools/server/webui/src/lib/utils/file-preview.ts
@@ -34,12 +34,3 @@ export function getFileTypeLabel(input: string | undefined): string {
        // Handle AttachmentType or other plain strings
        return input.toUpperCase();
 }
-
-/**
- * Truncates text content for preview display
- * @param content - The text content to truncate
- * @returns Truncated content with ellipsis if needed
- */
-export function getPreviewText(content: string): string {
-       return content.length > 150 ? content.substring(0, 150) + '...' : content;
-}

diff --git a/tools/server/webui/src/lib/utils/index.ts b/tools/server/webui/src/lib/utils/index.ts
index d8a893ed645f2e9f4311cdf20bd7bc396bf55e83..2485e34de33c44e4f9ff63838e13733bf55c2e8a 100644 (file)
--- a/tools/server/webui/src/lib/utils/index.ts
+++ b/tools/server/webui/src/lib/utils/index.ts
@@ -43,7 +43,8 @@ export { createMessageCountMap, getMessageCount } from './conversation-utils';
 export { copyToClipboard, copyCodeToClipboard } from './copy';
 
 // File preview utilities
-export { getFileTypeLabel, getPreviewText } from './file-preview';
+export { getFileTypeLabel } from './file-preview';
+export { getPreviewText } from './text';
 
 // File type utilities
 export {

diff --git a/tools/server/webui/src/lib/utils/text.ts b/tools/server/webui/src/lib/utils/text.ts
new file mode 100644 (file)
index 0000000..5c5dd0f
--- /dev/null
+++ b/tools/server/webui/src/lib/utils/text.ts
@@ -0,0 +1,7 @@
+/**
+ * Returns a shortened preview of the provided content capped at the given length.
+ * Appends an ellipsis when the content exceeds the maximum.
+ */
+export function getPreviewText(content: string, max = 150): string {
+       return content.length > max ? content.slice(0, max) + '...' : content;
+}