Used the new getChatWidth function in ChatProcessingInfo

This commit is contained in:
Imad Saddik 2025-12-20 09:28:55 +01:00
parent 62614a5faa
commit 416bb35130
1 changed files with 3 additions and 5 deletions

View File

@ -4,16 +4,14 @@
import { slotsService } from '$lib/services/slots';
import { isLoading, activeMessages, activeConversation } from '$lib/stores/chat.svelte';
import { config } from '$lib/stores/settings.svelte';
import { MAX_WIDTH_CLASSES, DEFAULT_MAX_WIDTH_CLASS } from '$lib/constants/width-classes';
import { getChatWidth } from '$lib/utils/chat-width';
const processingState = useProcessingState();
let isCurrentConversationLoading = $derived(isLoading());
let processingDetails = $derived(processingState.getProcessingDetails());
let showSlotsInfo = $derived(isCurrentConversationLoading || config().keepStatsVisible);
let maxWidthClass = $derived(
config().responsiveChatWidth ? MAX_WIDTH_CLASSES : DEFAULT_MAX_WIDTH_CLASS
);
let widthConfig = $derived(getChatWidth(config().autoChatWidth, config().customChatWidth));
// Track loading state reactively by checking if conversation ID is in loading conversations array
$effect(() => {
@ -81,7 +79,7 @@
</script>
<div class="chat-processing-info-container pointer-events-none" class:visible={showSlotsInfo}>
<div class="chat-processing-info-content {maxWidthClass}">
<div class="chat-processing-info-content {widthConfig.class}" style={widthConfig.style}>
{#each processingDetails as detail (detail)}
<span class="chat-processing-info-detail pointer-events-auto">{detail}</span>
{/each}