kawaandClaude Opus 4.6
29aa6b9e2f
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
4.0 KiB
status, trigger, created, updated
| status | trigger | created | updated |
|---|---|---|---|
| diagnosed | Tooltip info buttons on Remote Config wizard step: hovering doesn't show anything, icon placement is wrong (above field instead of beside helpText) | 2026-04-01T00:00:00Z | 2026-04-01T00:00:00Z |
Current Focus
hypothesis: Two distinct root causes — onClick-only toggle (no hover), and icon placed above TextFieldMD3 instead of beside helpText test: Code review of FieldRenderer.tsx lines 83-109 and TextFieldMD3.tsx lines 65-67 expecting: Confirm both issues from source next_action: Report diagnosis
Symptoms
expected: (1) Hovering tooltip button shows tooltip text. (2) Icon is beside the helpText under the field. actual: (1) Nothing happens on hover — only click toggles. (2) Icon is above the TextFieldMD3 component. errors: none reproduction: Open Remote Config wizard, hover over any info button started: Since phase-09 tooltip implementation
Eliminated
(none needed — root causes identified on first pass)
Evidence
-
timestamp: 2026-04-01T00:00:00Z checked: FieldRenderer.tsx lines 83-109 (text input default branch) found: | The tooltip button at lines 85-94 uses onClick={() => setShowTooltip(v => !v)} only. There are NO onMouseEnter/onMouseLeave handlers, and no CSS hover-triggered tooltip. The tooltip text (lines 95-99) is only rendered when showTooltip state is true, which only changes on click — never on hover. implication: Root cause of Issue 1 — tooltip requires click, not hover
-
timestamp: 2026-04-01T00:00:00Z checked: FieldRenderer.tsx lines 83-109 (DOM structure of text input branch) found: | The DOM order is:
{tooltipText && icon} ← lines 85-94: icon ABOVE field {tooltipText && showTooltip &&The icon button is a sibling rendered BEFORE TextFieldMD3, placing it above the field. Meanwhile, helpText is rendered INSIDE TextFieldMD3 (TextFieldMD3.tsx lines 65-67), so the icon cannot be "beside the helpText" from its current position. implication: Root cause of Issue 2 — icon is structurally above the field, not beside helpTexttext
} ← lines 95-99: tooltip text ABOVE field ← lines 100-107: field with helpText inside -
timestamp: 2026-04-01T00:00:00Z checked: TextFieldMD3.tsx lines 65-67 found: | helpText is rendered inside TextFieldMD3: {helpText && !error && (
{helpText}
)} This is encapsulated inside the component — FieldRenderer has no way to inject an icon beside it without either: (a) passing the icon as a prop, or (b) moving helpText rendering out of TextFieldMD3. implication: Fix requires changing TextFieldMD3 interface or moving helpText rendering
Resolution
root_cause: | ISSUE 1 — Tooltip doesn't show on hover: File: src/components/ui/FieldRenderer.tsx, lines 85-94 The tooltip button only has an onClick handler that toggles showTooltip state. There are no onMouseEnter/onMouseLeave handlers and no CSS :hover mechanism. The tooltip content (lines 95-99) is conditionally rendered only when showTooltip === true, which never becomes true from hovering.
ISSUE 2 — Icon placed above field instead of beside helpText: File: src/components/ui/FieldRenderer.tsx, lines 83-109 The icon button is rendered as a sibling BEFORE , placing it visually above the text field. The helpText is rendered INSIDE TextFieldMD3 (TextFieldMD3.tsx line 65-67), making it impossible for the icon in FieldRenderer to sit beside it. To place the icon beside helpText, either: (a) TextFieldMD3 needs a new prop (e.g., helpTextSuffix or helpTextIcon) to render content inline with the helpText paragraph, or (b) helpText rendering moves out of TextFieldMD3 back into FieldRenderer, where the icon and helpText can be placed in a flex-row together.
fix: (not applied — diagnosis only) verification: (not applied — diagnosis only) files_changed: []