diff --git a/FEEDBACK.md b/FEEDBACK.md index bec3035..651d770 100644 --- a/FEEDBACK.md +++ b/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 diff --git a/src/components/ChatInput.tsx b/src/components/ChatInput.tsx index 6ea51e6..b0abde5 100644 --- a/src/components/ChatInput.tsx +++ b/src/components/ChatInput.tsx @@ -1,7 +1,12 @@ -import { useState, useRef, useEffect, useCallback } from 'react'; -import { Send, Square, Paperclip, X, FileText } from 'lucide-react'; +import { useState, useRef, useEffect, useCallback, lazy, Suspense } from '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([]); const [isDragOver, setIsDragOver] = useState(false); + const [showPreview, setShowPreview] = useState(() => localStorage.getItem('pinchchat-md-preview') === '1'); const textareaRef = useRef(null); const fileInputRef = useRef(null); @@ -248,6 +254,15 @@ export function ChatInput({ onSend, onAbort, isGenerating, disabled, sessionKey )} + {/* Markdown preview */} + {showPreview && text.trim() && ( +
+ Loading…}> + {text} + +
+ )} +
{/* File picker button */} + {/* Markdown preview toggle */} + = { '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',