Skip to content
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

[ML] Advanced JSON editor enhancements #66716

Open
1 of 4 tasks
darnautov opened this issue May 15, 2020 · 1 comment
Open
1 of 4 tasks

[ML] Advanced JSON editor enhancements #66716

darnautov opened this issue May 15, 2020 · 1 comment
Assignees
Labels
enhancement New value added to drive a business result epic Meta :ml v8.15.0

Comments

@darnautov
Copy link
Contributor

darnautov commented May 15, 2020

At the moment the advanced editor used in various places in UI, such as job and transform configuration, only validates that JSON input format is correct and supports multiline notation which makes writing painless scrips a bit more user friendly.

It would be useful for users who define advanced configurations to have the following features:

  • Support JSON Schemas which let us provide definitions of expected payloads (e.g. the job and datafeed configs) in order to have an autocomplete for configuration keys, validate the content of the specified properties and show an inline description for configuration keys.
  • Support autocomplete and validation for painless scripting

This will make it easier for users to created configurations for advanced use cases, and reduce the risk of making an error in the configuration.

At the moment we use EUI Code Editor which is a wrapper around ace editor. We probably should move towards monaco editor as Kibana already started the migration, for instance, "Painless Lab" in Kibana dev tools adopted it, hence we might reuse some code for better painless scripts handling.

See #67485 the PR introducing monaco editor for xJson and painless support

This should be applied to the JSON editors in the following areas:

@darnautov darnautov added Meta enhancement New value added to drive a business result :ml labels May 15, 2020
@elasticmachine
Copy link
Contributor

Pinging @elastic/ml-ui (:ml)

@darnautov darnautov self-assigned this Aug 10, 2022
darnautov added a commit that referenced this issue Mar 10, 2023
…rd (#146968)

## Summary

Part of #66716

Updates the code editor for anomaly detection job and datafeed
configurations. It uses the monaco editor instead of ace and passes the
JSON schema definition extracted from the elasticsearch specification to
provide suggestions for available properties and documentation on hover.

- Properties autocompletion (ctrl + space)
<img width="552" alt="image"
src="https://user-images.githubusercontent.com/5236598/205601880-03d484b4-c007-4e1b-9325-a80ccdcd02b8.png">

- Documentation on mouse over 
<img width="512" alt="image"
src="https://user-images.githubusercontent.com/5236598/205602042-53a600ee-8fb5-4c18-991d-ffc2f2cca7e8.png">

- Data types support 
<img width="336" alt="image"
src="https://user-images.githubusercontent.com/5236598/205602158-1298a37b-7d8e-40f8-9f6b-bf3117d37c04.png">


### Checklist

- [ ] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [ ]
[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials
- [ ] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [ ] Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))
- [ ] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [ ] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)
bmorelli25 pushed a commit to bmorelli25/kibana that referenced this issue Mar 10, 2023
…rd (elastic#146968)

## Summary

Part of elastic#66716

Updates the code editor for anomaly detection job and datafeed
configurations. It uses the monaco editor instead of ace and passes the
JSON schema definition extracted from the elasticsearch specification to
provide suggestions for available properties and documentation on hover.

- Properties autocompletion (ctrl + space)
<img width="552" alt="image"
src="https://user-images.githubusercontent.com/5236598/205601880-03d484b4-c007-4e1b-9325-a80ccdcd02b8.png">

- Documentation on mouse over 
<img width="512" alt="image"
src="https://user-images.githubusercontent.com/5236598/205602042-53a600ee-8fb5-4c18-991d-ffc2f2cca7e8.png">

- Data types support 
<img width="336" alt="image"
src="https://user-images.githubusercontent.com/5236598/205602158-1298a37b-7d8e-40f8-9f6b-bf3117d37c04.png">


### Checklist

- [ ] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [ ]
[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials
- [ ] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [ ] Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))
- [ ] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [ ] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)
nkhristinin pushed a commit that referenced this issue Mar 22, 2023
…rd (#146968)

## Summary

Part of #66716

Updates the code editor for anomaly detection job and datafeed
configurations. It uses the monaco editor instead of ace and passes the
JSON schema definition extracted from the elasticsearch specification to
provide suggestions for available properties and documentation on hover.

- Properties autocompletion (ctrl + space)
<img width="552" alt="image"
src="https://user-images.githubusercontent.com/5236598/205601880-03d484b4-c007-4e1b-9325-a80ccdcd02b8.png">

- Documentation on mouse over 
<img width="512" alt="image"
src="https://user-images.githubusercontent.com/5236598/205602042-53a600ee-8fb5-4c18-991d-ffc2f2cca7e8.png">

- Data types support 
<img width="336" alt="image"
src="https://user-images.githubusercontent.com/5236598/205602158-1298a37b-7d8e-40f8-9f6b-bf3117d37c04.png">


### Checklist

- [ ] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [ ]
[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials
- [ ] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [ ] Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))
- [ ] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [ ] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)
@peteharverson peteharverson changed the title [ML] Advanced editor enhancements [ML] Advanced JSON editor enhancements Apr 26, 2024
@peteharverson peteharverson added epic and removed epic labels Apr 26, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New value added to drive a business result epic Meta :ml v8.15.0
Projects
None yet
Development

No branches or pull requests

3 participants