From 9028120a2e4e91e76ba36e5041c234124ff983a2 Mon Sep 17 00:00:00 2001 From: Pedram Amini Date: Sun, 1 Feb 2026 14:12:48 -0500 Subject: [PATCH] feat(tour): use icon descriptions matching actual UI elements MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Update input area tour step to describe each icon with visual hints that match the actual Lucide icons used in the input area. Also update TourStep component to properly render newlines as line breaks so the bulleted list of icons displays correctly. Icons now described: - Pencil (✎) for expanded prompt editor - Image (🖼) for file attachments - History (⏱) for session history toggle - Eye (👁) for read-only mode - Brain (🧠) for extended thinking - Keyboard (⌨) for submit hotkey toggle --- src/renderer/components/Wizard/tour/TourStep.tsx | 9 +++++++-- src/renderer/components/Wizard/tour/tourSteps.ts | 4 ++-- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/src/renderer/components/Wizard/tour/TourStep.tsx b/src/renderer/components/Wizard/tour/TourStep.tsx index bad17690..7746a423 100644 --- a/src/renderer/components/Wizard/tour/TourStep.tsx +++ b/src/renderer/components/Wizard/tour/TourStep.tsx @@ -328,9 +328,14 @@ export function TourStep({ {step.title} - {/* Description */} + {/* Description - render newlines as line breaks */}

- {description} + {description.split('\n').map((line, i, arr) => ( + + {line} + {i < arr.length - 1 &&
} + + ))}

{/* Navigation buttons */} diff --git a/src/renderer/components/Wizard/tour/tourSteps.ts b/src/renderer/components/Wizard/tour/tourSteps.ts index c0df7202..fed8494e 100644 --- a/src/renderer/components/Wizard/tour/tourSteps.ts +++ b/src/renderer/components/Wizard/tour/tourSteps.ts @@ -127,9 +127,9 @@ export const tourSteps: TourStepConfig[] = [ id: 'input-area', title: 'Input Area', description: - 'Type your messages here to communicate with the AI. During Auto Run, this area may be locked while tasks execute. You can queue messages to send after the current task completes.\n\n**Features:** Use the ✏️ pencil icon for an expanded prompt editor, paste images or click the 🖼️ image icon to attach files, and toggle ⏱️ History, 👁️ Read-Only, and 🧠 Thinking modes per-message. You can also change the submission hotkey (Enter vs Shift+Enter). Defaults for these toggles can be changed in Settings → General.\n\nPress {{focusInput}} to quickly jump here.', + 'Type your messages here to communicate with the AI. During Auto Run, this area may be locked while tasks execute. You can queue messages to send after the current task completes.\n\nLook for these icons in the input area:\n• Pencil (✎) - Open expanded prompt editor\n• Image (🖼) - Attach files or paste images\n• History (⏱) - Toggle saving to session history\n• Eye (👁) - Toggle read-only mode\n• Brain (🧠) - Toggle extended thinking\n• Keyboard (⌨) - Switch submit hotkey (Enter/⌘Enter)\n\nDefaults for these toggles can be changed in Settings → General.\n\nPress {{focusInput}} to quickly jump here.', descriptionGeneric: - 'Type your messages here to communicate with the AI. You can also use slash commands and @ mentions for files.\n\n**Features:** Use the ✏️ pencil icon for an expanded prompt editor, paste images or click the 🖼️ image icon to attach files, and toggle ⏱️ History, 👁️ Read-Only, and 🧠 Thinking modes per-message. You can also change the submission hotkey (Enter vs Shift+Enter). Defaults for these toggles can be changed in Settings → General.\n\nPress {{focusInput}} to quickly jump here.', + 'Type your messages here to communicate with the AI. You can also use slash commands and @ mentions for files.\n\nLook for these icons in the input area:\n• Pencil (✎) - Open expanded prompt editor\n• Image (🖼) - Attach files or paste images\n• History (⏱) - Toggle saving to session history\n• Eye (👁) - Toggle read-only mode\n• Brain (🧠) - Toggle extended thinking\n• Keyboard (⌨) - Switch submit hotkey (Enter/⌘Enter)\n\nDefaults for these toggles can be changed in Settings → General.\n\nPress {{focusInput}} to quickly jump here.', selector: '[data-tour="input-area"]', position: 'top', uiActions: [],