fix(CodeEditor): prevent focus loss (#12211)

[ochosi]

Problem

When using CodeEditor with isUploadEnabled={true}, typing the first character causes the Monaco editor to lose focus and cursor position.

Solution

Remove && !value from the outer conditional at line 599. The outer branch should only depend on whether upload/emptyState features are enabled, not on current code content. The inner condition already handles empty state display correctly.

I have verified the fix locally by running image-builder-frontend linked against the patched patternfly-react.

What: Closes #12211

Additional issues: https://issues.redhat.com/browse/HMS-9956 (Bug surfacing in Image Builder)

Summary by CodeRabbit

• Style

  • Improved editor container visuals and consistent styling across upload-enabled, empty, loading, and populated states.

• Refactor

  • Unified component layout and simplified render structure so the editor uses a consistent container and internal sections in all states.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Walkthrough

Modified CodeEditor rendering so the upload/dropzone container remains stable when isUploadEnabled or emptyState is true by removing the && !value requirement from the outer conditional; both branches now render a consistent codeEditorContainer wrapper to avoid remounts and focus loss.

Changes

Cohort / File(s)	Summary
CodeEditor rendering fix packages/react-code-editor/src/components/CodeEditor/CodeEditor.tsx	Outer conditional changed from `(isUploadEnabled

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately and concisely describes the main fix: preventing focus loss in CodeEditor, which is the core issue addressed by removing the && !value condition.
Linked Issues check	✅ Passed	The code changes directly address all primary objectives: removing && !value from the outer conditional prevents Monaco editor remounting, maintaining focus and cursor position during the empty→non-empty transition.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to fixing the focus loss issue by restructuring the conditional wrapper and updating container logic as described in issue #12211, with no unrelated modifications.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[patternfly-build]

Preview: https://pf-react-pr-12212.surge.sh

A11y report: https://pf-react-pr-12212-a11y.surge.sh