-
Notifications
You must be signed in to change notification settings - Fork 3
Changed component to display YAML files to Monaco Editor #308
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull Request Overview
This PR replaces the existing react-syntax-highlighter
component with Monaco Editor for displaying and editing YAML files. The change provides a more feature-rich code editing experience with syntax highlighting, themes, and diff visualization capabilities.
- Integrates Monaco Editor with YAML language support and custom GitHub themes
- Creates reusable
YamlEditor
andYamlDiffEditor
wrapper components - Updates all YAML viewing components to use Monaco Editor instead of syntax highlighter
Reviewed Changes
Copilot reviewed 16 out of 17 changed files in this pull request and generated 3 comments.
Show a summary per file
File | Description |
---|---|
vite.config.js | Adds vite-plugin-static-copy to bundle Monaco Editor assets |
src/main.tsx | Initializes Monaco Editor configuration on app startup |
src/lib/monaco.ts | Configures Monaco Editor with YAML support and GitHub themes |
src/components/YamlEditor/*.tsx | New wrapper components for Monaco Editor and DiffEditor |
src/components/Yaml/YamlViewer.tsx | Replaces syntax highlighter with Monaco Editor |
src/components/Yaml/YamlDiff.tsx | Replaces custom diff implementation with Monaco DiffEditor |
package.json | Updates dependencies to include Monaco Editor packages |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull Request Overview
Copilot reviewed 20 out of 22 changed files in this pull request and generated 2 comments.
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
Co-authored-by: Copilot <[email protected]>
Co-authored-by: Copilot <[email protected]>
…ect/ui-frontend into resources-yaml-edit
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good job!! (Reviewed via call)
What this PR does / why we need it:
This PR replaces the existing react-syntax-highlighter component with Monaco Editor for displaying and editing YAML files. The change provides a more feature-rich code editing experience with syntax validation, highlighting etc.