- Added `emoji-regex` and `remove-accents` packages to improve text processing capabilities. - Implemented automatic Ollama startup in the chat page for better user experience. - Enhanced setup page to include GPU selection based on hardware specifications. - Updated chat input to support real-time validation and improved user feedback. - Refactored message handling in chat to incorporate new processing features.
44 lines
1.0 KiB
TypeScript
44 lines
1.0 KiB
TypeScript
'use client';
|
|
|
|
import { Loader2, Sparkles } from 'lucide-react';
|
|
import { cn } from '@/lib/utils';
|
|
import { useEffect, useState } from 'react';
|
|
|
|
interface StreamingIndicatorProps {
|
|
isStreaming: boolean;
|
|
className?: string;
|
|
}
|
|
|
|
export function StreamingIndicator({ isStreaming, className }: StreamingIndicatorProps) {
|
|
const [dots, setDots] = useState('');
|
|
|
|
useEffect(() => {
|
|
if (!isStreaming) {
|
|
setDots('');
|
|
return;
|
|
}
|
|
|
|
const interval = setInterval(() => {
|
|
setDots(prev => {
|
|
if (prev === '...') return '';
|
|
return prev + '.';
|
|
});
|
|
}, 500);
|
|
|
|
return () => clearInterval(interval);
|
|
}, [isStreaming]);
|
|
|
|
if (!isStreaming) return null;
|
|
|
|
return (
|
|
<div className={cn("flex items-center gap-2 text-xs text-muted-foreground px-6 py-2", className)}>
|
|
<div className="relative">
|
|
<Sparkles className="w-3 h-3 text-primary animate-pulse" />
|
|
<div className="absolute inset-0 bg-primary/20 rounded-full animate-ping" />
|
|
</div>
|
|
<span>Streaming{dots}</span>
|
|
</div>
|
|
);
|
|
}
|
|
|