[UI] Update CodeEditor to a different package

[acald-creator]

Current Behavior

Currently meshery/ui is on Next.js v12 and React@17. However there is a package that will need to be removed in due time, react-codemirror2, because this package relies on React@16, and we're in need of moving to a different package.

Desired Behavior

There were some suggestions of packages:

• @monaco-editor/react
• monaco-editor
• react-ace (which is already used in ui-restructuring-meshery branch)
• codemirror

Implementation

I have already completed a couple of protoypes with codemirror and @monaco-editor/react but have not finalize this change.

Acceptance Tests

Mockups

---

Contributor Guides and Handbook

• 🛠 Meshery Build & Release Strategy
• 📚 Instructions for contributing to documentation
  • Meshery documentation site and source
• 🎨 Wireframes and designs for Meshery UI in Figma
• 🙋🏾🙋🏼 Questions: Discussion Forum and Community Slack

[github-actions]

This issue has been labeled with 'component/ui'. 🧰 Here are docs on Contributing to Meshery UI. 🎨 Here is the Meshery UI Figma File File. Lastly, here are docs on Contributing to Meshery's End-to-End Tests Using Cypress.

---

        Be sure to join the community, if you haven't yet and please leave a ⭐ star on the project 😄

[acald-creator]

bump

[acald-creator]

Working on this now.

Researching @uwi/react-codemirror and rodemirror with codemirror.

[acald-creator]

Bump

using https://github.com/yjs/y-codemirror.next to replace the existing editor.

[nebula-aac]

bump

[nebula-aac]

Will be providing an update with the design spec.

[sandramsc]

Hi @nebula-aac @acald-creator are you still intend to work on this issue? Let us know so we know to allow you more time, otherwise, we'll need to free (unassign you) the issue so as to allow other contributors to give it a go.