Files
PinchChat/src/components/ThinkingBlock.tsx
Nicolas Varrot 3370916931 fix: localize UI to English and add ARIA accessibility attributes
- Replace all French UI strings with English (Connected, Thinking, Result, Send, etc.)
- Add role="log" + aria-live="polite" to chat message area
- Add role="form" + aria-label to message input area
- Add aria-label to sidebar toggle, attach file, send, and textarea
- Add role="banner" to header, role="navigation" to sidebar
- Add role="application" to app root
2026-02-11 12:17:54 +00:00

25 lines
942 B
TypeScript

import { useState } from 'react';
import { ChevronRight, ChevronDown, Brain } from 'lucide-react';
export function ThinkingBlock({ text }: { text: string }) {
const [open, setOpen] = useState(false);
return (
<div className="my-2">
<button
onClick={() => setOpen(!open)}
className="inline-flex items-center gap-1.5 rounded-2xl border border-white/8 bg-zinc-800/35 px-3 py-1.5 text-xs text-violet-300 hover:bg-white/5 transition-colors"
>
<Brain size={13} />
<span className="font-medium">Thinking</span>
{open ? <ChevronDown size={12} className="ml-1 text-zinc-500" /> : <ChevronRight size={12} className="ml-1 text-zinc-500" />}
</button>
{open && (
<div className="mt-2 rounded-2xl border border-white/8 bg-zinc-800/25 p-3 text-sm italic text-zinc-400 whitespace-pre-wrap max-h-96 overflow-y-auto">
{text}
</div>
)}
</div>
);
}