feat: VRL & pipeline AI fixes — multiline inputs, surgical VRL replacement, layout, scroll

[TerrifiedBug]

Summary

• Pipeline AI chat scroll — added min-h-0 to flex container chain so the review tab message thread scrolls correctly
• Multiline inputs — replaced single-line <Input> with auto-growing <textarea> in both Generate and Review tabs (Enter submits, Shift+Enter for newlines)
• Surgical VRL replacement — added modify_vrl suggestion type that performs targetCode→code string replacement within VRL config fields instead of overwriting entire sections. Updated types, applier, validator, suggestion cards, prompts, and dialog validation.
• VRL follow-up suggestions — added whitespace-normalized matching fallback so suggestions don't grey out after minor whitespace changes from previous edits
• VRL editor modal layout — unified toolsPanel/aiPanelOpen into single rightPanel state; toolbar moved above editor; right panel shows tools OR AI (never both); editor stays full-width always

Test plan

• Open pipeline → AI Pipeline Builder → Review tab → send multiple messages → verify scroll works
• In both Generate and Review tabs, verify Shift+Enter adds newline, Enter submits, textarea auto-grows up to 4 lines
• Open VRL Editor → toggle Fields/Snippets/AI panels → verify editor stays full-width, right panel swaps content
• In VRL AI, apply a suggestion then request follow-up → verify subsequent suggestions are not all greyed out
• Run pnpm tsc --noEmit — no new errors in modified files

[greptile-apps]

Greptile Summary

This PR delivers four cohesive improvements to the VRL editor and Pipeline AI dialog: a scroll fix for the Review tab message thread (min-h-0 on the flex chain), auto-growing multiline textareas in both AI tabs, a new modify_vrl suggestion type that performs surgical string replacement inside VRL config fields instead of overwriting entire sections, and whitespace-normalized matching in the VRL editor AI so suggestions remain actionable after minor formatting changes from prior edits.

Key changes:

• New modify_vrl type — types.ts, suggestion-applier.ts, suggestion-validator.ts, prompts.ts, and ai-suggestion-card.tsx all updated consistently. The applier correctly guards against missing nodes, non-string config paths, and absent targetCode before committing.
• Whitespace-normalized matching (vrl-suggestion-types.ts) — findNormalizedMatch searches within a ±10-character window of the expected needle length, which handles typical indentation/newline differences. One inconsistency exists: the replace_code exact-match path uses replaceAll (all occurrences) while the normalized fallback path uses slice/concat (only the first match), so if targetCode appears more than once and whitespace normalization is required, the two paths silently diverge.
• VRL editor layout — toolsPanel/aiPanelOpen unified into rightPanel; toolbar promoted above the editor; editor is always full-width.

Confidence Score: 4/5

• PR is safe to merge; the one inconsistency in replace_code only manifests when the same VRL snippet appears more than once and exact matching fails.
• All eight files are internally consistent and the new modify_vrl type is correctly wired end-to-end. The single correctness issue — replaceAll for exact matches vs. single-replace for normalized matches in applyVrlSuggestion — is a real divergence but only triggers in the unusual case where targetCode is a duplicated pattern AND whitespace normalization is needed.
• src/lib/ai/vrl-suggestion-types.ts — replace_code normalized fallback path replaces only the first occurrence.

Important Files Changed

Filename	Overview
src/lib/ai/vrl-suggestion-types.ts	Adds whitespace-normalized matching fallback for replace_code/remove_code VRL suggestions. The replace_code normalized path replaces only the first match via slice/concat, while the exact path uses replaceAll — inconsistent behavior when targetCode appears more than once.
src/lib/ai/suggestion-applier.ts	Adds applyModifyVrl for surgical VRL field replacement. Logic is sound: finds node, reads value at dot-path, guards for non-string, checks exact includes, then does replaceAll. Consistent with existing replace_code exact-match behavior.
src/components/flow/ai-pipeline-dialog.tsx	Replaces Input with auto-growing textarea, adds scroll fix via min-h-0, and adds modify_vrl inline validation. Both submit handlers correctly use optional e?: React.FormEvent so calling them without arguments from key handlers is safe.
src/components/vrl-editor/vrl-editor.tsx	Unified toolsPanel/aiPanelOpen into single rightPanel state; toolbar moved above editor; right panel shows tools OR AI. The RightPanel type is defined inside the component function (harmless at runtime since types are erased), cn import correctly removed as it's no longer used.
src/lib/ai/types.ts	Adds ModifyVrlSuggestion interface and includes it in the AiSuggestion union type. Clean, no issues.
src/lib/ai/suggestion-validator.ts	Adds modify_vrl case to getReferencedKeys, returning [s.componentKey] so the existing key-existence validation covers the new type. Correct.
src/lib/ai/prompts.ts	Updates system prompt to document and exemplify modify_vrl, clarifying that VRL fields should always use modify_vrl rather than modify_config. Clean.
src/components/flow/ai-suggestion-card.tsx	Adds modify_vrl label and a diff-style targetCode / code preview block. Also adds componentKey to renderDescription. No issues.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[Pipeline AI Review Tab] -->|sends current YAML| B[AI generates suggestions]
    B -->|modify_vrl suggestion| C{Validate in suggestionStatuses}
    C -->|validateSuggestions: componentKey exists?| D{configPath → string?}
    D -->|no| E[status: invalid]
    D -->|yes| F{value.includes targetCode?}
    F -->|no| G[status: outdated]
    F -->|yes| H[status: actionable]
    H -->|user applies| I[applyModifyVrl]
    I -->|getAtPath config| J{exact includes?}
    J -->|no| K[error: target not found]
    J -->|yes| L[replaceAll → newConfig]
    L --> M[update node in store]

    N[VRL Editor AI Panel] -->|replace_code suggestion| O{computeVrlSuggestionStatuses}
    O -->|exact includes?| P[status: actionable]
    O -->|normalized match?| P
    O -->|neither| Q[status: outdated]
    P -->|user applies| R[applyVrlSuggestion]
    R -->|exact match| S[replaceAll ← all occurrences]
    R -->|normalized match| T[slice+concat ← first occurrence only]

Loading

Comments Outside Diff (1)

1. src/lib/ai/vrl-suggestion-types.ts, line 129-138 (link)

   replace_code replaces all occurrences on exact match but only the first on normalized fallback

   The exact-match path uses replaceAll (line 133), so if the same code pattern appears more than once every occurrence is replaced. But the normalized-whitespace fallback path (line 138) uses slice/concat, which only replaces the single first match found by findNormalizedMatch. If whitespace normalization is needed and targetCode appears twice, the two paths produce different results — a silent correctness divergence.

   Alternatively, the simplest fix is to make the normalized path consistent with exact-match by also replacing all occurrences:

         const match = findNormalizedMatch(currentCode, suggestion.targetCode);
         if (!match) return null;
         // Replace only this first normalized occurrence (consistent with replaceAll when unique)
   

   At minimum the inconsistency should be documented so callers aren't surprised.

_{Last reviewed commit: 951b804}