feat: live markdown preview toggle in chat input

- Eye icon button next to file picker toggles preview on/off
- Shows rendered markdown above textarea in real-time
- Lazy-loads ReactMarkdown (no bundle impact when off)
- Preference persisted in localStorage
- i18n: EN/FR labels for show/hide preview

FEEDBACK.md

@@ -554,7 +554,8 @@
 ## Item #52
 - **Date:** 2026-02-12
 - **Priority:** medium
-- **Status:** pending
+- **Status:** done
+- **Completed:** 2026-02-13 — commit `82d2e37`
 - **Description:** Raw JSON viewer — toggle to see raw gateway messages
   - Toggle button to switch between rendered view and raw JSON
   - Show the full gateway message payload as formatted JSON

src/components/ChatInput.tsx

@@ -1,7 +1,12 @@
-import { useState, useRef, useEffect, useCallback } from 'react';
+import { useState, useRef, useEffect, useCallback, lazy, Suspense } from 'react';
-import { Send, Square, Paperclip, X, FileText } from 'lucide-react';
+import { Send, Square, Paperclip, X, FileText, Eye, EyeOff } from 'lucide-react';
 import { useT } from '../hooks/useLocale';
 
+const ReactMarkdown = lazy(() => import('react-markdown'));
+const remarkGfm = import('remark-gfm').then(m => m.default);
+let _remarkGfm: typeof import('remark-gfm').default | null = null;
+remarkGfm.then(p => { _remarkGfm = p; });
+
 interface FileAttachment {
   id: string;
   file: File;
@@ -85,6 +90,7 @@ export function ChatInput({ onSend, onAbort, isGenerating, disabled, sessionKey
   const [text, setText] = useState('');
   const [files, setFiles] = useState<FileAttachment[]>([]);
   const [isDragOver, setIsDragOver] = useState(false);
+  const [showPreview, setShowPreview] = useState(() => localStorage.getItem('pinchchat-md-preview') === '1');
   const textareaRef = useRef<HTMLTextAreaElement>(null);
   const fileInputRef = useRef<HTMLInputElement>(null);
 
@@ -248,6 +254,15 @@ export function ChatInput({ onSend, onAbort, isGenerating, disabled, sessionKey
             </div>
           )}
 
+          {/* Markdown preview */}
+          {showPreview && text.trim() && (
+            <div className="mb-3 px-1 max-h-[200px] overflow-y-auto rounded-2xl border border-pc-border bg-pc-elevated/30 p-3 text-sm text-pc-text prose prose-invert prose-sm max-w-none [&_pre]:bg-pc-elevated [&_pre]:rounded-lg [&_pre]:p-2 [&_code]:text-cyan-300 [&_a]:text-cyan-400">
+              <Suspense fallback={<span className="text-pc-text-muted text-xs">Loading…</span>}>
+                <ReactMarkdown remarkPlugins={_remarkGfm ? [_remarkGfm] : []}>{text}</ReactMarkdown>
+              </Suspense>
+            </div>
+          )}
+
           <div className="flex items-end gap-3">
             {/* File picker button */}
             <button
@@ -259,6 +274,15 @@ export function ChatInput({ onSend, onAbort, isGenerating, disabled, sessionKey
             >
               <Paperclip size={18} />
             </button>
+            {/* Markdown preview toggle */}
+            <button
+              onClick={() => setShowPreview(v => { const next = !v; localStorage.setItem('pinchchat-md-preview', next ? '1' : '0'); return next; })}
+              className={`shrink-0 h-11 w-11 rounded-2xl border border-pc-border bg-pc-elevated/30 flex items-center justify-center transition-colors ${showPreview ? 'text-pc-accent-light bg-[var(--pc-accent-glow)]' : 'text-pc-text-secondary hover:text-pc-accent-light hover:bg-[var(--pc-hover)]'}`}
+              title={showPreview ? t('chat.hidePreview') : t('chat.showPreview')}
+              aria-label={showPreview ? t('chat.hidePreview') : t('chat.showPreview')}
+            >
+              {showPreview ? <EyeOff size={18} /> : <Eye size={18} />}
+            </button>
             <input
               ref={fileInputRef}
               type="file"

src/lib/i18n.ts

@@ -40,6 +40,8 @@ const en = {
   'chat.attachFile': 'Attach file',
   'chat.send': 'Send',
   'chat.stop': 'Stop',
+  'chat.showPreview': 'Preview markdown',
+  'chat.hidePreview': 'Hide preview',
   'chat.scrollToBottom': 'New messages',
   'chat.collapseTools': 'Collapse all tools',
   'chat.expandTools': 'Expand all tools',
@@ -151,6 +153,8 @@ const fr: Record<keyof typeof en, string> = {
   'chat.attachFile': 'Joindre un fichier',
   'chat.send': 'Envoyer',
   'chat.stop': 'Arrêter',
+  'chat.showPreview': 'Aperçu markdown',
+  'chat.hidePreview': 'Masquer l\'aperçu',
   'chat.scrollToBottom': 'Nouveaux messages',
   'chat.collapseTools': 'Replier tous les outils',
   'chat.expandTools': 'Déplier tous les outils',