feat: Chat Form Actions UI logic improvements

This commit is contained in:
Aleksander Grygier 2025-11-22 19:06:17 +01:00
parent db8ed5df9c
commit dc913ec424
1 changed files with 12 additions and 3 deletions

View File

@ -11,6 +11,7 @@
import { getFileTypeCategory } from '$lib/utils/file-type'; import { getFileTypeCategory } from '$lib/utils/file-type';
import { supportsAudio } from '$lib/stores/server.svelte'; import { supportsAudio } from '$lib/stores/server.svelte';
import { config } from '$lib/stores/settings.svelte'; import { config } from '$lib/stores/settings.svelte';
import { modelOptions, selectedModelId } from '$lib/stores/models.svelte';
import type { ChatUploadedFile } from '$lib/types/chat'; import type { ChatUploadedFile } from '$lib/types/chat';
interface Props { interface Props {
@ -48,12 +49,20 @@
hasAudioModality && !hasText && !hasAudioAttachments && currentConfig.autoMicOnEmpty hasAudioModality && !hasText && !hasAudioAttachments && currentConfig.autoMicOnEmpty
); );
let shouldShowSubmitButton = $derived(!shouldShowRecordButton || hasAudioAttachments); let shouldShowSubmitButton = $derived(!shouldShowRecordButton || hasAudioAttachments);
let isSelectedModelInCache = $derived.by(() => {
const currentModelId = selectedModelId();
if (!currentModelId) return false;
return modelOptions().some((option) => option.id === currentModelId);
});
</script> </script>
<div class="flex w-full items-center gap-3 {className}"> <div class="flex w-full items-center gap-3 {className}">
<ChatFormActionFileAttachments class="mr-auto" {disabled} {onFileUpload} /> <ChatFormActionFileAttachments class="mr-auto" {disabled} {onFileUpload} />
<SelectorModel class="max-w-80" /> <SelectorModel class="max-w-80" forceForegroundText={true} />
{#if isLoading} {#if isLoading}
<Button <Button
@ -74,10 +83,10 @@
{canSend} {canSend}
{disabled} {disabled}
{isLoading} {isLoading}
tooltipLabel={isLastModelInCache tooltipLabel={isSelectedModelInCache
? '' ? ''
: 'Selected model is not available, please select another'} : 'Selected model is not available, please select another'}
isModelAvailable={isLastModelInCache} isModelAvailable={isSelectedModelInCache}
/> />
{/if} {/if}
{/if} {/if}